前端技术学习指南
基础
css3、html5:
- 掌握滤镜、渐变、过渡、转换、动画等高级样式;
- 掌握流式布局(flex)和格栅布局(grid)的原理及应用;
- 掌握html5新特性的用法,比如before/after等伪元素的经典用法;
- 解并总结可视化设计中的一些经典用法;
- 掌握css中常用的变量,及函数的使用;
Css预处理:
- 了解css 预处理器less,sass/scss基本使用;
- 掌握scss中的变量,函数,混合函数的使用及设计;
js(es6):
- js的基本用法,譬如jquery库的调用;
- es6及相关api的的学习应用;
- es6相关库的使用,如fetch、axios请求库
动画:
- css动画应用;
- jquery动画api的应用;
- 经典动画库,譬如animate.css,anime.js等等;
Es6编译打包工具:
- 了解node,学会使用包管理工具npm,yarn等;
- 熟练使用webpack,grunt打包工具中的一种;
- 熟悉es6的编译工具babel;
React相关知识:
- 掌握react基本语法,生命周期等基础内容;
- 了解数据管理器Redux原理,熟练使用react-redux管理react数据;
- 了解路由router的原理,熟练使用react-router管理react应用的路由;
- 了解react相关库,如格式化数字等等的库;
- 熟悉ant-desigin、ant-desigin-pro等react的经典应用库
- 熟悉基于react的数据流前端框架dva;
- 熟悉基于react的应用开发框架umi
- 了解基于移动端的ant-design-mobile库;
- 了解基于react的动画库ant-motion;
- 了解数据可视化库antv;
- 掌握react开发中常用的脚手架工具,如create-react-app等;
Vue相关知识:
- 掌握Vue基本语法,生命周期等基础内容;
- 了解数据管理器Vuex原理,熟练使用Vuex管理vue数据;
- 了解路由router的原理,熟练使用vue Router管理vue应用的路由;
- 了解vue相关库,如格式化数字等等的库;
- 熟悉ant-desigin-vue等vue的经典应用库;
- 了解基于vue的移动/微信端ui库YDUI touch等;
- 掌握vue开发中常用的脚手架工具,如vue-cli等;
Angular相关知识:
- 了解Angular.js相关知识即可;
.可视化库:
- 熟练掌握echarts的使用;
- 熟悉d3.js可视化库的使用;
- 了解vijs等库的应用;
进阶
移动端:
- 熟悉基于react的移动端开发框架react-native及其生态库;
- 熟悉google的移动跨平台Ui开发框架flutter及其生态库;
Js进阶:
- Javascript 的根Object的属性和静态方法及实例方法;
- 熟悉javascript的作用域及作用域链;
- 熟悉javascript的闭包原理;
- 熟悉javascript的执行上下文;
- 熟悉javascript的原型机原型链;
- 了解jquery源码,了解其核心封装思想;
React/vue进阶:
- react高阶函数、hook函数的封装及应用;
- 了解react的执行原理,包裹diff算法等等;
- 了解 react,redux,react-redux,react-router-redux,dva等react相关核心库的源码;并了解其执行原理;
- 了解 vue,vuex,vue-router 等vue相关核心库的源码,并了解其执行原理;
Web端:
- 了解构建跨平台桌面应用程序的开发库electron及其生态库;
- 了解前端3D开发库threejs,thingjs;
- 了解前端多线程技术web worker;
- 了解前端渐进式网页应用程序技术PWA;
性能优化:
- 网络层面;
- Js层面;
- Css层面;