第1章 課程介紹
介紹了整個課程的背景知識，專案簡介，學習流程，可以掌握的知識點，以及學習方法和前置知識

1-1 課程導讀
第2章 設計稿：從藍圖開始
從原型圖出發，分析整個應用的需求和功能點，最後規定了檔案結構和程式碼規範。

2-1 從分析設計稿開始
2-2 檔案程式碼結構
第3章 首頁：庖丁解牛
使用 React 理念開發首頁的功能，通過元件拆分-展示型元件開發的流程開發所有的展示型元件，並且學習 PropTyps 驗證 React元件的屬性。

3-1 拆分靜態元件
3-2 第一個展示型元件 - 價格列表
3-3 為專案選擇圖示庫
3-4 PropTypes 屬性檢查
3-5 切換Tab元件
3-6 動手實戰
3-7 月份選擇元件 - 需求分析
3-8 月份選擇元件開發 - 編碼第一部分
3-9 月份選擇元件 編碼第二部分
第4章 首頁：樂高積木
繼續 React 理念的開發 ，通過 展示型元件組合 - state和資料流分析 -新增 state 和互動 這樣的流程完成首頁的開發。

4-1 組合所有靜態型元件
4-2 分析設計 State 結構
4-3 分析資料流
4-4 新增邏輯互動程式碼及總結
第5章 元件測試
簡介了測試的基本概念，介紹 通用測試工具 Jest 和 React 測試框架 enzyme，然後使用這兩種工具完成首頁所有展示型元件的測試和首頁的整合測試。

5-1 為什麼要有測試
5-2 通用框架 Jest 簡介
5-3 React 測試工具簡介
5-4 價格題目列表測試分析和編寫
5-5 月份選擇器新增測試
5-6 月份選擇器進階測試
5-7 首頁單元測試分析和編寫
第6章 建立記賬條目頁面
分析建立頁面的需求，學習 SPA 的概念，使用 React-Router 建立路由，並且使用 TDD 的方式開發建立頁面的展示型元件。

6-1 建立頁面需求分析和元件拆分
6-2 React-Router 簡介
6-3 React-Router 程式碼部分
6-4 TDD 的方式開發分類選擇元件
6-5 PriceForm 元件編寫的指導思想
6-6 動手實戰
6-7 使用 children 重構 Tabs 元件
6-8 建立頁面組合展示型元件
6-9 分析 和 flattern 應用 state 結構
6-10 Redux 和 Context 的解決方案
第7章 多頁面結合
分析多頁面的 state 結構，並且提出優化方案，簡介 Redux 和不使用 Redux 的原因使用 Context 將狀態和操作方法抽象到頂層，最後整合整個應用的所有資料操作邏輯。

7-1 分析和優化整個應用的state 結構
7-2 Redux 和 Context 的解決方案
7-3 新增 Context
7-4 使用高階元件實現 Context 重用
7-5 整合兩個頁面的邏輯和互動— 首頁和建立頁
7-6 整合兩個頁面的邏輯和互動 二 - 編輯頁面
7-7 階段性總結
第8章 後端 Mock 環境
簡介 前後端分離開發和 mock server 的概念，然後學習怎樣使用 JSON server 快速搭建一個 mock server，並且學會使用 Postman 測試介面。

8-1 前後端分離開發概念
8-2 使用 json-server 打造 mock server
8-3 分析和建立 Restful 介面
8-4 使用 Postman 測試 API
第9章 動靜結合
學習 Axios 的基本用法，然後使用 Axios 改造應用對接後端介面，並且實現所有非同步操作。

第10章 錦上添花：圖表分析頁面
學習怎樣將開源圖表庫 Recharts 整合到首頁的功能中。

第11章 專案部署
學習 生產環境和開發環境的異同，簡介Leancloud，以及怎樣使用 Leancloud 部署專案。

第12章 課程總結
本課程回顧和總結。

下載地址：

百度網盤