技术是一种载体,在它之上是对整个体系的认知,如何精进呢,Winter 的文章 一个前端的自我修养 ,不容错过!
学习曲线遵循
`JavaScript (ES5/6)` ===> `React` => `React Native` => ------|
| | | | |
`FP` | ==> `Flux/Redux` ==> | |
| |
===> `Vue` => `Vuex` => ----------------|
|
|
`HTML` => `HTML5` ===> `Mental Model` <=== ----------|
| |
| |
| `Design` ===> `Art` ===> ...
|
`CSS` => `CSS3` => `LESS`
本文重在 “术”,追求的是广度,要想继续学习,在前端领域深入耕耘、探索,请参见以下内容:
另外,微信作为一个独立的开发体系,参见 Wechat
How it feels to learn JavaScript in 2016
中文版 => 在 2016 年学 JavaScript 是一种什么样的体验?
Front-End Developer Handbook 2017
WebStorm
/VSCode
/Sublime Text
/Atom
Chrome
一些常用工具的使用方法可参考 toolkit
- Airbnb JavaScript Style Guide
- Airbnb React/JSX Style Guide
- Front-End Coding Guidelines 京东凹凸实验室的前端代码规范
React - 官网
React Native - 官网
- Flux
- Flux 架构入门教程
- Redux
- Redux 中文文档
- 理解 Redux
- Redux 源码分析
- react-redux 源码分析
- dva 基于 redux、redux-saga 和 react-router 的轻量级前端框架
- pure render 阿里数据中台前端团队分享前端相关经验,高质量的知乎专栏
- React 技术栈系列教程
Vue - 官网
AntV 是蚂蚁金服全新一代数据可视化解决方案,致力于提供一套简单方便、专业可靠、无限可能的数据可视化最佳实践
-
一套基于可视化编码的图形语法,以数据驱动,具有高度的易用性和扩展性,用户无需关注各种繁琐的实现细节,一条语句即可构建出各种各样的可交互的统计图表
-
关系数据可视化引擎,开发者可以基于 G6 拓展出属于自己的图分析应用或者图编辑器应用
-
专为移动端定制的一套开箱即用的可视化解决方案,具有精简、高性能、易扩展的特性。适用于对性能、大小、扩展性要求严苛的场景
D3.js (Data-Driven Documents) 是基于数据操作文档的 JavaScript 库。D3 绑定数据到 DOM,根据数据操作文档,创建交互式的图表。需要注意的是,数据转换和绘制相互独立。
设计体系方法论: atomic design,阐述了从抽象到具体的 5 个层次:
Atoms => Molecules => Organisms => Templates => Pages
Ant Design 一个服务于企业级产品的设计体系,基于『确定』和『自然』的设计价值观和模块化的解决方案,让设计者专注于更好的用户体验
Material Design A visual language that synthesizes the classic principles of good design with the innovation of technology and science
- Material-UI React components that implement Google's Material Design
- Ant Design Mobile 一个基于 Preact / React / React Native 的 UI 组件库
- Element 基于 Vue 2.0 的桌面端组件库
- Vant - 移动端 轻量、可靠的移动端 Vue 组件库
- ANT DESIGN PRO 开箱即用的中台前端/设计解决方案
- 飞冰 ICE
作为离用户最近的端,绕不开设计,会将搜集到的一些设计资源汇总在 Design 中。