React+Node.js开发实战:从入门到项目上线

前言 第1篇 React和Node.js基础 第1章 准备：搭建React+Node.js开发环境2 1.1 为什么选择React+Node.js2 1.1.1 React的优势2 1.1.2 Node.js的优势3 1.1.3 React+Node.js组合的优势3 1.2 搭建Node.js环境4 1.2.1 安装Node.js4 1.2.2 常用工具1：NPM、CNPM和NRM8 1.2.3 常用工具2：YARN9 1.2.4 常用工具3：npx和npm scripts10 1.2.5 **个Node.js示例12 1.3 搭建React环境13 1.3.1 安装React13 1.3.2 **个React示例16 1.3.3 **个React+Node.js组合示例23 1.4 React+Node.js开发工具28 1.4.1 Visual Studio Code简介28 1.4.2 Chrome简介31 1.4.3 Postman简介34 1.5 小结38 第2章 前端开发：React技术从0到139 2.1 JSX简介39 2.1.1 JSX的由来39 2.1.2 JSX语法40 2.2 组件46 2.2.1 组件的定义46 2.2.2 高阶组件48 2.3 数据流51 2.3.1 Props与State简介51 2.3.2 组件通信简介56 2.3.3 Context API简介58 2.3.4 Redux简介62 2.3.5 MobX简介72 2.4 生命周期75 2.4.1 挂载和卸载75 2.4.2 状态更新76 2.5 小结77 第3章 后端开发：Node.js技术从0到179 3.1 Node.js的特性79 3.1.1 模块化规范80 3.1.2 异步I/O和事件驱动83 3.2 HTTP简介86 3.2.1 请求和响应87 3.2.2 RESTful架构风格90 3.2.3 JSON数据格式93 3.3 开始使用Node.js95 3.3.1 hello world示例95 3.3.2 回调函数与Promise对象97 3.3.3 调试工具100 3.4 Node.js的常用模块104 3.4.1 全局变量104 3.4.2 工具模块108 3.4.3 HTTP模块111 3.4.4 事件循环和EventEmitter114 3.5 小结117 第2篇 打包部署和项目开发实战 第4章 构建与部署120 4.1 Webpack简介120 4.1.1 一切皆模块121 4.1.2 Webpack的使用124 4.1.3 Webpack环境配置130 4.1.4 Webpack进阶134 4.2 Nginx简介138 4.2.1 Nginx的基本特性140 4.2.2 Nginx的安装144 4.2.3 Nginx的配置146 4.2.4 Nginx的高级特性150 4.3 PM2简介153 4.3.1 守护进程154 4.3.2 进程管理工具对比154 4.3.3 PM2的安装和使用154 4.4 部署158 4.4.1 React的部署159 4.4.2 Node.js的部署160 4.5 小结161 第5章 项目实战1：React+Node.js实现单页面评论系统162 5.1 研发流程162 5.2 产品原型163 5.2.1 文章列表页163 5.2.2 文章详情与评论页164 5.2.3 文章编辑页165 5.3 技术选型165 5.3.1 前端技术165 5.3.2 后端技术168 5.4 项目开发175 5.4.1 文章列表175 5.4.2 文章详情与评论184 5.4.3 文章编辑189 5.5 测试部署193 5.5.1 接口测试193 5.5.2 项目部署195 5.6 小结197 第3篇 React和Node.js进阶 第6章 React进阶200 6.1 虚拟DOM200 6.2 Diff算法202 6.2.1 Tree Diff简介203 6.2.2 Component Diff简介204 6.2.3 Element Diff简介204 6.3 Fiber机制205 6.3.1 Fiber树207 6.3.2 Reconciliation阶段207 6.3.3 Commit阶段209 6.3.4 React Fiber小结209 6.4 Immutable.js库210 6.4.1 浅拷贝210 6.4.2 深拷贝211 6.4.3 Immutable.js简介212 6.5 Hook特性217 6.5.1 State Hook简介217 6.5.2 Effect Hook简介218 6.5.3 自定义Hook221 6.5.4 其他Hook223 6.6 小结224 第7章 Node.js进阶225 7.1 跨域225 7.1.1 同源策略225 7.1.2 跨域方案227 7.2 鉴权231 7.2.1 Session机制232 7.2.2 JWT标准235 7.3 缓存238 7.3.1 Redis方案239 7.3.2 单点登录244 7.4 对象—关系映射246 7.4.1 Sequelize——关系型数据库的ORM实现247 7.4.2 Mongoose——MongoDB的ORM实现255 7.5 小结259 第8章 项目实战2：React+Node.js实现社区项目从开发到上线261 8.1 产品原型261 8.1.1 注册与登录261 8.1.2 新建主题262 8.1.3 主题列表262 8.1.4 主题详情262 8.1.5 评论功能263 8.2 技术选型263 8.2.1 服务器端264 8.2.2 Web前端268 8.3 项目开发273 8.3.1 注册与登录273 8.3.2 新建主题289 8.3.3 主题列表293 8.3.4 主题详情297 8.3.5 评论功能300 8.4 项目部署与测试304 8.4.1 项目部署305 8.4.2 E2E测试306 8.5 小结309 第4篇 项目优化和服务端渲染 第9章 项目优化312 9.1 浏览器缓存312 9.1.1 强缓存313 9.1.2 协商缓存314 9.1.3 缓存位置315 9.1.4 缓存策略317 9.1.5 缓存示例317 9.2 压缩321