前端工程师是怎么练成的
本人Sam。启蒙微软派,遁入前端教。已修炼后端技能、领域驱动设计、前端技能等近八余载。擅长C#,领域驱动设计,必杀技为Javascript、Css。为领域驱动设计在前端教的应用而奋斗。现将自我领悟的前端教技能秘笈总结如下:
上图咯:
内功心法
前端教的三大内功秘笈:Html、Css、Javascript。你必须要掌握的程度
- html:他是Css和Javascript秘笈的根本,没有他Css和Javascript就无法施展其魅力。他包含了标签语义、BFC和IFC标签、h5新功能(如:cnavas、video、websocket、localstorage等)等。
- css:他有静态装饰html元素能力,css3的出现也让他做了一Javascript的事件。你需要区分css2.1与css3的差异。
在css2.1的领域中display(改变元素的BFC和IFC的能力)、float(让元素浮动)、position(定位)、z-index(层级)、vertical-algin(垂直对齐)、Margin和Padding等很重要。而在css3的领域更加完善了background、transition(过渡)、animation(动画)、linear-gradient(渐变)、shadow(阴影)、flex布局、媒体查询的支持、多设备适配的单位等,这些你都需要掌握。
- javascript:他是三大秘笈中最难,也是最致命的技能,什么怪都能打。
es5存在了很多年,es6火得很快,es7又来了。es5虽然很古老,他也是一切罪恶的根源,es6与es7都是为es5解决一些复杂场景应用的问题。在es5领域中的闭包、this指向、自执行函数、执行上下文、Js与Dom的关系等很重要,在es6的领域中,Class、let、Promise、Generator等太多东西,这些你都需要深入理解和掌握。
下山
完成上述内功心法的修炼,我们就可以进入下一个阶段,下山打怪。
在这里我们需要解决掉一个css框架、一个javascript框架,css框架推荐选择当下流行的bootstrap,他是集合了所有怪物的特点于一身。javascript框架推荐选择框架老祖JQuery,虽然现在都MV*了,但是JQuery的江湖地位还是首屈一指的。对于这两个框架我们需要深入理解他的源码,并对每一个值得学习的细节做好笔记。
- boostratp要学习他对css应用场景的分类,如:字体、按钮、表单等,更要掌握他利用样式叠加实现各种效果的组合技能。
- JQuery要学习他的Promise(Es6会原生实现)、Extend方法,链式调用、callback、css相关Hack的处理手段等
制造怪物
在制造怪物之前,我们还需要了解当下流行的MV*框架,他是未来处理前端项目的首先,在这里我们思想要有所改变,要时刻记住只有viewModel才能驱动view的改变,以及Flux概念的理解和应用。
- 选择一个MV*框架深入学习,如:Vue,React,AnglerJs等。
- 学习Nodejs做为前端开发工具的应用
- 学习一门户后端语言,推荐nodejs。可以做到一份代码多端运行,也就是同构方案
- 前端自动化工具的使用,如karma,eslint,webpack,phantomJs,selenim webdirver等 完成上述技能后,就可以选择一个业务领域进行自己框架的开发了。
修炼成仙
完成前三步已经是江湖高手了,在这里主要是把我们渡为神,如下就是神所需要具体的能力
- 对浏览器解析原理的深入理解,了解各浏览器内核,如:webkit,Gecko等,折腾源码建议选择webkit相关的。
- Javascript解析原理的深入理解,首先V8引擎
- 建议选择chrome开源版本的chromium学习和应用
此文为本人转型前端两年来的自我实践总结,如有偏颇欢迎指正。也许我们会在某个阶段停留很久,但不要气馁,相信自己一定会突破难关。为自己,更为同样身在泥潭中的战友,共勉。