React16 組件化+測試+全流程 實戰在線賬本項目


第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 改造應用對接后端接口,並且實現所有異步操作。
9-1 下一代的 HTTP 庫:Axios_x264
9-2 學習 axios 的簡單用法
9-3 改造首頁支持異步流程
9-4 使用 async 改造異步流程
9-5 改造創建條目頁和編輯頁
9-6 優化異步請求
9-7 容器型組件測試策略和介紹
9-8 創建編輯頁面測試編寫
9-9 動手實踐

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

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

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

下載地址:React16 組件化+測試+全流程 實戰在線賬本項目

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM