Bootstrap

前端自学学习路线(新手向)

前端自学学习路线(新手向)

很多想自学前端的人不知道从哪里开始下手,前端需要学哪些东西也不是很清楚,这篇博客就是我个人对从0开始学习前端的路线的一些建议。

基本路线

首先要明白前端最基本的三个工具:HTML CSS JS,建议先从HTML学起,然后CSS,最后学习JS,

HTML是页面,CSS是样式,JS是灵魂,至于这三个具体是什么。。。不懂的直接去百度吧,我就不凑字数了

理由:

  • CSS是为HTML服务的,所以先学,JS是对CSS和HTML的操作,所以放在最后面学习

  • HTML和CSS比较简单,对于零基础的人也不难掌握,而JS难度比较高一点

HTML

HTML中要学习的就是各种各样的标签,如h系列,还有div,以及表单,表格的使用,这些都不难掌握,多练即可熟练掌握,而这些也是一个页面最基本最重要的东西。

注意:

  • 要对每个标签的语义都烂熟于心,标签语义化是很重要的,如h系列是标题,table是表格,form是表单

  • 标签不能乱用,嵌套的时候不要弄乱了

  • div是没有语义的标签,但是很重要,一般用来当容器。

CSS

CSS是给页面添加样式,使页面更加美观,在这部分主要学习的是各种各样的属性,如height,width,还有各种选择器,如标签选择器,选择器的作用简单来说就是将选择器里的属性加到对应的标签上,在这一部分,浮动,定位可能是比较难一点的地方,不过也是多加练习就能熟练掌握。

注意:

  • 添加样式的时候要注意优先级,有些属性没加上很可能就是优先级的问题

  • 要注意清除浮动带来的影响

JS

为什么说JS是一个页面的灵魂,因为你掌握了HTML和CSS就可以写出一个静态页面,但是如果你需要给页面添加各种功能,需要动态的渲染数据,或者加一些炫酷的特效,想要前后台交互,这时候就需要用到JS了,从这里开始就会难一点了。学习的时候要有心理准备,但如果你有其他编程语言的基础,你会发现JS比C语言,JAVA简单很多。

首先你要明白JS是由哪几部分组成的

  • ECMAscript: JavaScript的核心,描述了语言的基本语法和数据类型,ECMAScript是一套标准,定义了一种语言的标准与具体实现无关

  • DOM:(document object model 文档对象模型)一套操作页面元素的API

  • BOM:(browser object model 浏览器对象模型)一套操作浏览器功能的API

学的话,肯定先学ECMAscript,因为他是JS的标准。首先需要学习的JS的数据类型,然后掌握JS的基本语法。

对数组,对象之类的要弄明白,而基本语法,for语句,if语句都是很重要的,emmm,不能这么说,应该说所有语法和数据类型都很重要。

学完后可以尝试写写冒泡排序,如果你能很清楚它的实现思路,可能你对for语句以及数组掌握的可能就差不多了

然后学习DOM,DOM其实就是操作页面元素的一组API,什么是API?简单来说就是借口,其实就是预先定义好的一些方法,函数,你可以拿来使用实现某些功能。而DOM就是用来操作页面元素的API,什么是页面元素?就是指你的HTML页面,你可以用DOM去操作这个页面,如创建删除标签,修改页面样式

最后学习BOM,BOM是操作浏览器的API,你可以操作screen或者history等。

最后

如果你前面这些都掌握的很好了,就可以去进阶的学习一些框架和一些库。多学些插件,锻炼自己查文档的能力。掌握如jquery,Vue,angular,react,bootstrap这些框架。因为实际开发的过程中,不可能让你直接写原生JS,更多的是使用各种各样的框架,这时候就需要你看文档的能力,快速的掌握一门框架。

;