《基于React的前端工程实战》大纲，也是笔者心中的前端学习路线图

本文从属于笔者的Web 前端入门与最佳实践。

前几日偶然接到某出版社编辑大大的私信，邀约看看可否整理出版一本前端方面的书籍，笔者再三肯定即便一本卖不出去（虽然本身确定会买至少一本，或者多买些屯着代替那啥）也不会被打死以后着手准备大纲具体的章节。笔者仍是很惶恐的，毕竟本身的水本身知道。本文是为书准备的大纲，不过也是笔者心目中的现代前端开发者学习路线图，即便最终没法出版笔者也会默默整理出来，但愿能帮助到些许童鞋。

不过既然有那么些几率出版，也很欢迎全部大大给予指教，对于章节内容的选择，章节目录的顺序，你们以为还想聊聊的内容均可以欢迎留言或者邮箱：384924552@qq .com。本文的永久地址为:基于React的前端工程实战大纲，也是笔者心中的前端学习路线图。另外笔者前几日收到某个跨年演讲邀请，虽然这几天为了毕业论文和项目被虐出翔没准备，仍是欢迎有兴趣的搬个板凳瞅瞅，我给你们讲段子。

前言

本书囊括了笔者五年来在前端工程领域的实践总结，笔者但愿对于不一样等级的开发者都能有所收获。本书最核心的目标:

• 但愿对于没有经验的开发者可以在本书选定的最短路径上快速成为一名合格的现代前端开发者。每一小节都会讲解最基础的语法或者使用要点，可是不会长篇大论地介绍语法细节这些应该查看文档的内容。经过简单的示例快速上手以后，笔者会介绍不少工程当中的具体实践。可能刚入门的开发者并不能理解这些实践的意义或者价值，可是首先保证能用，然后在本身的实践中慢慢回味，逐渐明了。

• 而对于有必定前端开发经验的开发者，本书可以帮你梳理现代纷繁复杂的前端开发情况，探寻百花齐放的工具库背后蕴藏的设计理念与编程范式，最终融会贯通，造成本身的前端工程化思想与体系。

本书最大的优点在于造成了完整的知识体系结构，让你合理概括本身学到的知识，将知识放在它该在的地方。另外笔者想强调的是，不管React仍是Vue或者Angular2都是很是优秀的前端框架，使用哪一个框架仍是属于术的范畴。本书虽然立足于React，可是其中蕴含的设计模式与工程架构能够通用于任何框架。笔者也着力于不但愿受到某个具体框架的太多的束缚，毕竟在这个突飞猛进的前端世界，说不许哪天就落于人后了。

序

第一部分 初窥门径，看山是山

前端基础

Hyper Text Markup Language

HTML语法基础

Semantic HTML

H5

CSS

CSS 语法基础

盒模型

基于Flexbox的网格布局

SCSS

CSS 工程实践

JavaScript

JavaScript 语法基础

本章节对于JavaScript语法基础进行简单介绍，涉及JavaScript/ECMAScript语言的衍化过程，基本的变量定义，变量赋值，变量做用域，常见类型与格式的判断以及转换。

JavaScript 数据结构

本章节包含对于基本数值类型、字符串类型、时间与日期类型、数组类型的操做与解释。

JavaScript 控制流

JavaScript 函数

JavaScript 类与对象

本部分包含对于JavaScript 中Class的使用以及常见的单例模式的编写介绍。

DOM

元素选择与操做

事件响应

Ajax

客户端存储

简单的网页设计规范

本部分会以一步一步来美化网站为例将上述学到的HTML、CSS与JavaScript的知识加以应用。

经常使用的前端工具库

jQuery

jQuery 基础

jQuery 小窍门

jQuery Plugins

你并不须要jQuery

Lodash

Lodash 基础

你并不须要Lodash

Pattern Library

jQuery UI

BootStrap

Webpack

Webpack语法基础

经常使用的Webpack插件

Webpack 代码分割

Webpack

第三章 React 初探

数据流驱动的页面

本部分主要介绍React设计思想，从命令式编程到声明式编程的变化，及以jQuery与React实现相同功能的例子对比。

搭建你的脚手架

create-react-app

基于Webpack2的完整脚手架介绍

React组件

组件声明

组件生命周期

组件样式

React 事件交互

React 事件绑定与处理

React 拖拽

第五节 React Router

第六节 React 动画

第三章 React 技术栈

Redux

Flux

Redux设计思想

简单的Redux实例

MobX

MobX 设计思想

Observable

简单的MobX实例

第二部分 登堂入室，看山不是山

第五章 深刻JavaScript工程实践

基于Flow 的 JavaScript 类型检查

JavaScript 函数式编程

JavaScript 异步编程

Promise

Generator

Async/Await

JavaScript 面向对象

琢磨不透的this

原型链与继承

JavaScript 类的几种实现方式

JavaScript 数据绑定

脏检测

ES6 Proxy

JavaScript 性能优化与样式规范

变量

数据类型

函数

React工程实践

React 设计模式与样式指南

High-Order Component

Stateless Functional Component

Pretty Component

React 性能优化

React 组件测试

Jest

Enzyme

第五节 React 打包发布

包体压缩

避免XSS漏洞

基于React的Pattern Library

Material UI

antd

第五章 深刻React内部原理

简单的Virtual DOM实现

React Diff算法

React setState

React Fiber

Virtual DOM Alternatives

前端状态管理

Redux的得与失

渐进的前端状态管理

常见的状态管理模式

合理的状态设置

第七章 前端性能优化

浏览器渲染原理

前端性能评测

资源加载

首页与关键路径

渲染策略

第八章 前端质量保障

NodeJS

NodeJS 初窥

经常使用NodeJS框架

Express

Koa

服务端渲染

Electron

移动开发

Mobile First

React Native

微信小程序

第三部分 融会贯通，看山仍是山

GUI应用程序架构变迁

MVC

MVP&MVVM

Flux Unidirectional Data Flow

REST 表现层状态转化

HTTP

HTTP 协议基础

HTTP 请求与响应

HTTP 缓存

RESTful API

RESTful API 最佳实践

REST的不足与GraphQL

第三章 前端工程化

先后端分离与全栈

合理的使用工具

渐进式的工程架构

组件化与Web Components

模块系统

微服务与微前端

数据可视化

数据可视化范式

常见的数据可视化库

ECharts

D3.js

Web 安全基础

第七章 Web的将来

WebAssembly

WebVR