2020前端进阶之路

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

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

三、学习建议

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.简化语言和尝试类比

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