[348] React劲爆新特性Hooks 重构旅游电商网站火车票PWA - 企业已经在使用React Hooks重构原有系统，轻松应对React工作挑战

网盘链接：

1. 课程简介

• 1-1 关于这门课程，你想了解的都在这里
• 1-2 看了这一节，对学习更有帮助

2. [操作篇]项目搭建

• 2-1 创建项目：使用react-create-app构建工具
• 2-2 编译脚本：react-scripts的作用与工作原理
• 2-3 解构编译脚本：eject的具体用法

3. [新特性]React新特性一览

• 3-1 Context实现跨层级的组件数据传递
• 3-2 静态属性ContextType访问跨层级组件的数据
• 3-3 Lazy与Suspense实现延迟加载
• 3-4 Memo实现指定组件进行渲染

4. [新特性]React颠覆性新特性Hooks

• 4-1 React Hooks的概念与意义
• 4-2 使用State Hooks
• 4-3 使用Effect Hooks
• 4-4 使用Context Hooks
• 4-5 使用Memo&Callback Hooks
• 4-6 使用Ref Hooks
• 4-7 【讨论题】使用 Ref Hooks
• 4-8 自定义Hooks
• 4-9 Hooks的使用法则
• 4-10 Hooks的常见问题
• 4-11 【讨论题】Hooks的常见问题

5. [新特性]React新特性之Redux

• 5-1 React Redux的概念与意义
• 5-2 没有Redux的世界
• 5-3 Dispatch与Action
• 5-4 使用Reducer拆解数据更新
• 5-5 异步Action

6. [新特性]渐进式Web App

• 6-1 PWA简介
• 6-2 服务工作线程：Service Worker
• 6-3 “承诺”控制流：Promise
• 6-4 更优雅的请求：fetch
• 6-5 资源的缓存系统：Cache API
• 6-6 消息推送：Notification API
• 6-7 如何在项目中开启PWA

7. [项目篇]火车票业务架构

• 7-1 项目业务选型以及演示分析
• 7-2 项目模块交互设计演示与分析
• 7-3 项目工程初始化
• 7-4 为项目搭建Mock Server

8. [项目篇]火车票首页

• 8-1 数据结构与模块设计
• 8-2 顶部导航栏
• 8-3 始发终到站
• 8-4 城市选择浮层-顶部搜索栏
• 8-5 城市选择浮层-城市的异步加载
• 8-6 城市选择浮层-渲染城市列表
• 8-7 城市选择浮层-字母快速定位
• 8-8 【讨论题】城市选择浮层-字母快速定位
• 8-9 城市选择浮层-搜索建议
• 8-10 出发日期控件
• 8-11 日期选择浮层-搭建
• 8-12 日期选择浮层-日历组件(上)
• 8-13 日期选择浮层-日历组件(下)
• 8-14 只看高铁&动车控件
• 8-15 提交按钮控件

9. [项目篇]搜索结果页

• 9-1 数据结构与模块设计(上)
• 9-2 数据结构与模块设计(下)
• 9-3 URL解析与数据请求
• 9-4 日期导航
• 9-5 车次列表
• 9-6 底部筛选按钮栏
• 9-7 综合筛选浮层-缓存状态(上)
• 9-8 综合筛选浮层-缓存状态(下)
• 9-9 【讨论题】综合筛选浮层-缓存状态(下)
• 9-10 综合筛选浮层-时间区间滑块(上)
• 9-11 综合筛选浮层-时间区间滑块(下)
• 9-12 【讨论题】综合筛选浮层-时间区间滑块(下)
• 9-13 综合筛选浮层 – 其他逻辑
• 9-14 数据联动与缓冲区重构

10. [项目篇]座次选择页

• 10-1 数据结构与模块设计
• 10-2 URL解析与数据请求
• 10-3 车次详细信息
• 10-4 异步加载时刻表(上)
• 10-5 异步加载时刻表(下)
• 10-6 车次列表

11. [项目篇]订单填写页

• 11-1 数据结构与模块设计
• 11-2 URL解析与数据请求
• 11-3 乘客信息填写(一)
• 11-4 乘客信息填写(二)
• 11-5 -1 乘客信息填写(三)
• 11-6 -2乘客信息填写(四)
• 11-7 在线选座
• 11-8 结算提交

12. [提高篇]工程优化

• 12-1 代码规范格式化
• 12-2 性能与部署

13. 课程总结

• 13-1 课程总结