2021前端进阶之路

2,650 阅读4分钟

前言

纪伯伦的《我曾七次鄙视自己的灵魂》

第一次,当它本可进取时,却故作谦卑;

第二次,当它在空虚时,用爱欲来填充;

第三次,在困难和容易之间,它选择了容易;

第四次,它犯了错,却借由别人也会犯错来宽慰自己;

第五次,它自由软弱,却把它认为是生命的坚韧;

第六次,当它鄙夷一张丑恶的嘴脸时,却不知那正是自己面具中的一副;

第七次,它侧身于生活的污泥中,虽不甘心,却又畏首畏尾。

一、前端程序员标准与要求

1. 初级前端:

熟悉前端基础知识如 HTML、JS、CSS 。 能够使用一门 MVVM 框架进行简单的业务开发。 遇到复杂的组件和模块,会找现有的轮子使用。 会使用百度、google 等检索工具搜索问题。

2. 中级程序员(阿里 p5)

除了前端基础知识外,熟悉计算机、网络等专业基础知识。 熟练掌握工作中使用的技术栈开发业务。 除了 MVVM 框架外,还能了解 webpack的配置。 能了解一个需求从开发-上线整个生命周期,并对各个环节负责。 具备基本的逻辑分析、问题分解、归纳总结等能力。 了解基本的数据结构和算法,写代码较熟练。 知道从靠谱的渠道去查找问题,在找不到合适轮子的时候,会造一些简单的轮子辅助业务开发。

3.高级程序员(阿里 p6)

具有独挡一面的能力,能高质量的完成模块级的工作。 熟练掌握工作中使用的技术栈,并能了解它们的实现原理。 能够在一个需求从开发-上线整个生命周期中找到痛点,并能使用技术的手段解决,提升效率。 能在模块维度对问题或需求做出分析和拆解,并做出相对合理的实现方案。 熟练掌握基础的数据结构和算法,代码符合规范,逻辑清晰。 有较好的技术选型能力。

二、大前端发展趋势

1. 按领域划分

a、后台方向:传统的大web方向,nodejs、express+koa、 MySQL+MongoDB+Redis
b、数据可视化方向:webGL、Canvas、SVG、Echart/HiChart、D3
c、AI方向:TensorFlow
d、游戏方向:Cocos Creator、Egret

2.按端划分

PC端
网页
桌面应用:Electron、NW、PWA桌面
移动端:小程序、快应用,uniapp和taro
web渲染:小程序、快应用、PWA
原生渲染:RN、Weex、Flutter

2.按框架划分

Vue全家桶 : Vuex、Vue-Router、Vue-cli、Element-ui/Cube-ui/Vant-ui

React全家桶: Redux、React-Router、Redux-Saga、dva、umi、(mobx)、Ant-Design

angular全家桶

三、学习建议

1.编码

多做业务,尝试不同的业务,目标是让自己先成为一个熟练工。
学会模仿,参考大牛的编码风格,照葫芦画瓢。并用工具(如eslint)约束自己。跟着抄一遍也行。

2.工作

熟悉业务,认真参与需求评审环节;
提升效率,工作的时候,尽量不要被打断,只编码、减少在群里灌水和斗图的时间。

3.学习

学习内容: 前端基础,JS、CSS、HTML 反复学习。 工作中用到的一门前端 MVVM 框架。了解一些广度知识,比如:HTTP、正则表达式、Web安全、性能优化、设计模式,数据结构和算法。

社区: 慕课网手记、掘金、CSDN、InfoQ 等中文社区,多看一些高质量文章学习。
GitHub: 学会GitHub 的使用,知道 clone、fork、pull、push 等基本操作。
官网文档: 入门每个技术栈最好的方式是通过它的文档学习,系统的过一遍文档,手敲它每一个示例。

4. 提升:

参与组内组件库的开发,一些通用 JSSDK 的开发
学会组件化、模块化的开发方式,学会复用和封装,减少 CV 的操作。 对自己的代码质量负责,可以经常组织 code review。

四、学习方法

1.选择一个概念

选一个你想学习的概念。讲授这个概念(费曼技巧的灵魂)
设想,你面对这个领域的菜鸟,甚至面对十岁的孩童,试图解释清楚这个概念,并让对方完全听懂。这,一方面加深你的理解,另一方面,找到不明白的节点或卡点。你就假装你要把你学的这个东西,要做技术分享,分享给你周围所有的同事朋友或者家人,你怎么做到让他们完全理解这个技术栈。

2.查漏补缺

当你无法解释的时候,重新回头找答案。 回到书上去,回去找同学、找老师、找已经懂的人,把这个概念重新研究一遍。结果要求,你能够把这个概念重新流利地解释出来。

3.简化语言和尝试类比

继续升华。假若是一个学术化或抽象化的词语,尝试用简洁词语来解释。要么,用别的东西来类比它。这里其实还可以理解为深入的了解那个技术栈