2020Web前端的学习之路,以及反省⾃⾝的不⾜之处。
⼀、基础技术
前端的三⼤基础毫⽆疑问就是HTML、CSS和JS。我称之为前端的⾻、⾁和魂。
先说“⾻”——HTML。HTML,翻译过来就是超⽂本标记语⾔,⽽不是江湖上的HOW TO ML。⽅向不能搞错了,我们整的东西可是⽼少咸宜的。HTML学习最重要的标签的学习,div、h1-h6、p、ul-li、strong、图⽚、字体等,什么内容⽤什么框.
推荐学习⽅法:
书籍《HTML5与CSS 3权威指南(上下册)》
再说“⾁”——CSS。CSS定义了HTML标签的显⽰外观,⽓质。主要掌握浮动,宽⾼设置、显⽰属性等
推荐学习⽅法:
书籍《CSS权威指南(第三版)》
反省:对于由于⼯作中css的权重并没那么⾼,这本书还没有阅读。
最后“魂”——Javascript。这是运⾏在浏览器上的脚本,但是现在javascript已经远远不是当年的那个js了,尤其Ecmascript6标准出来后,nodeJS 横空出世,JS暴露出⼀统天下的野⼼,JS让⽹页变得灵活,其实现的每⼀个明⾥暗⾥的交互,其实是为了触及您的灵魂,这也是其成为魂的原因。
推荐学习⽅法:
书籍《JavaScript DOM编程艺术 (第2版)》
书籍《JavaScript语⾔精粹》
书籍《JavaScript权威指南(第6版)》 犀⽜书
书籍《JavaScript设计模式》
反省:设计模式和权威指南的书籍厚度让我暂时还没有开始拜读
⽽现在,CSS3和HTML5的发展,⼜将web推向下⼀个时代,⼀个更为丰富多彩的时代。
⼆、环境基础
设备、浏览器以及运⾏环境
必须指出的是,html CSS JS都是运⾏在浏览器的,是由浏览器负责编译和呈现的。所以必须了解浏览器的⼯作原理。但是浏览器千千万万,也不是每个都要去解剖,主要的有Chrome, Firefox, IE,Safari,Opera,国内的主浏浏览器基本是基于chrome内核开发,做了⼀些更为接地⽓的功能,了解下就可以了,主要有QQ浏览器,UC,百度浏览器,360浏览器,搜狗浏览器,猎豹浏览器等。这⾥我主要使⽤⾕歌浏览器和⽕狐浏览器。
⽬前很多项⽬都是使⽤Node.js 与前后端分离,通过webpack进⾏项⽬打包,npm安装依赖
反省:对于webpack,npm,node.js的使⽤也仅仅只了解到⼀些简单的脚⼿架⼯具的使⽤,这⾥在今后的学习计划中要多花时间。
三、计算机基础
计算机⽹络,http协议。既然是web必不可少需要知道计算机⽹络的知识,这对于⽹页的加载和速度优化有很⼤的帮助,并且,我们做的不是静态的页⾯,⽽是动态的,所以必然涉及到与后台之间的数据的传输和存储,这个是要掌握的。
必须懂:Ajax,JSON,必须会的⼯具:postman⽤于测试接⼝
推荐学习⽅法:
反省:⼯作中的接⼝请求的封装由公司前端⼤佬完成,导致⾃⼰的⼀知半解,能够看懂,从零开始封装不⼀定那么顺利
四、流⾏框架
随着⽇益复杂的⽤户需求,与系统的复杂度上升,传统的开发模式⽇渐的很难满⾜,此时的三⼤框架孕育⽽⽣,让开发者更加⾼效,可复⽤,把关注点都放在数据层的操作,免去那些繁琐⽽⼜重复的视图操作。
网络前端需要学什么现在框架的能⼒已经是前端开发⼈员必备的技能之⼀也是趋势,三⼤框架的「最终⽬的」都是⼀致的,我认为开发者不必纠结于到底应该选择哪⼀个学习,可以选择其中的两个是最好的。对于刚⼊门的⼈来说,建议选择 Vue ⼊⼿,⽐较简单,灵活。
推荐学习⽅法:
反省:公司主要使⽤的框架就是VUE,另外两⼤框架React和Angular暂时还没有接触
五、⼯程化与版本控制
学会使⽤git可以有效、⾼速地处理从很⼩到⾮常⼤的项⽬版本管理。
Webpack 是当下最热门的前端资源模块化管理和打包⼯具。它可以将许多松散的模块按照依赖和规则打包成符合⽣产环境部署的前端资源。
ESLint 规范我们的代码习惯,javascript代码检测⼯具帮助我们写出更规范的代码。
推荐学习⽅法:
反省:webpack打包⼯具的原理需要认真学习,对于代码的规范的重视程度不够
六、锦上添花
Visual Studio Code
微软开源免费产品,受到⾮常多技术⼈员的喜爱,基本上成为前端开发者的必备编辑器,强⼤的插件扩展,可以灵活的打造⾃⼰喜欢的风格。给你们送上常⽤插件列表拿⾛不谢。
Github
全球最⼤的「同性」开源交流社区,没有账号的赶紧注册,在这有很多优秀的资源项⽬,各种⼤神。观摩优秀代码是我们学习的很好路径。另外在开发过程中,很多时候任务重、时间紧,应该避免重复造轮⼦,这⾥能够到你需要的⼯具或代码。
Markdown
Markdown 轻量级标记语⾔,简洁的语法,让作者专注内容⽽⾮复杂的格式要求,我认为⼈⼈都应该掌握,特别是经常写博客的⼈。想想你在⽤ world 时的场景,每次写完⽂章之后,不得不话费很多时间进⾏格式的排版,使⽤它你就可以避免这些烦恼。
TypeScript
ES6 的超集扩展,严格的数据类型,带来更好的维护,适合⼤型项⽬的开发⼯作,有⼈说它是未来的发展趋势,你说要不要了解?
UI框架
移动端框架推荐使⽤vant 和 vux,电脑端框架推荐使⽤element-ui
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论