本文主要针对新手党,老司机请绕行。废话不多说,向下看!!!
一、啥是前端?
上图总结的非常精辟,可以让你在复杂的前端中找到捋清各种关系,下面我总结下吧:
1、前端由标签+样式+脚本三部分元素组成。
2、市面上的所有框架都是基于这三部分原生的元素搭建起来的,框架不同侧重点也不同,但都是为了让使用者快速搭建界面为目的。比如:
在javascript脚本基础上搭建的框架:jQuery,Vue在css样式基础上搭建起来的框架:bootstrap在html标签基础上搭建起来的框架:layUI、Element3、大部分框架都不是纯粹的只使用一种元素,比如:Vue-Element,既包含javascript的封装,又包含html标签的封装
二、如何学习前端
前端的知识点非常零散,这也是区别于后台(后台侧重于逻辑)的特性之一,但是和学习后台一样,扎实的基本功不可或缺,也就是说首先需要把原生的javascript+css+html学扎实,没必要上来就研究开源的框架,基本功学习扎实后,再学习框架则事半功倍。
下面说说切入点:
javascript:
学习js不要循规蹈矩的看书,太枯燥,而且收获有限,要有针对性的去学习,我总结了一些供新手学习(动手写纸上列出来,找规律,不要只看)。
1、理解javascript的数据类型,以及区别,用法
2、理解学习javascript中变量的作用域
3、学习javascript中的常用循环for、while用法
4、学习javascript对标签的常用操作,例如:给html追加标签,删除标签、设置值、设置属性、设置样式等。
5、理解javascript中的对象含义,以及和数组的区别,互相嵌套用法
6、理解什么是json,javascript怎么深度解析json
7、理解什么是闭包(前面学好了再看这里)
css:
学习css最终要的就是实践,也就是动手,一定要亲自去试试各个样式的区别,用法。如果还是无从下手,可以随便打开一个网站,按下F12,看看人家怎么写的,任何一个网站都可以成为你学习的目标。下面我总结下侧重点:
1、position属性的绝对定位、相对定位、fixed的用法、区别(非常常用)。
2、理解margin和padding的区别。
3、学习浮动(float)的用法
4、学习怎么控制文本居左、居中、居右。怎么控制标签居左、居中、居右。
5、重点理解、学习css的优先级
这里牵扯到的知识太多、太杂,我就不一一列举了
html:
html本身虽然多种多样,但是重要的还是配合css使用,只要css学好了,哪怕html不熟悉也不要紧,因为哪怕只用一种标签,也可以做出很美的网站。把一些常用的标签灵活运用就行了。下面再总结下侧重点:
1、学习div和span的区别以及应用场景
2、ul和li的组合用法,以及应用场景
3、script标签不用位置的区别
4、常用标签有哪些常用属性
总结:
学习前端是一个漫长积累的过程,需要多看、多动手、多积累。并且一定要有侧重点,一开始学习不需要什么都深入研究,比如html标签,没必要所有的都学,把常用的学好即可。
有问题就留言