React+ Redux+ ReactRouter教程,React全家桶一套掌握

課程目錄

Day1

01.React簡單介紹

02.React開發(fā)環(huán)境創(chuàng)建

03.JSX基礎(chǔ)-概念和本質(zhì)

04.JSX基礎(chǔ)-識別js表達式

05.JSX基礎(chǔ)-實現(xiàn)列表渲染

06.JSX基礎(chǔ)-實現(xiàn)基礎(chǔ)條件渲染

07.JSX基礎(chǔ)-實現(xiàn)復(fù)雜條件渲染

08.React中的事件綁定

09.React組件基礎(chǔ)使用

10.useState基礎(chǔ)使用

11.useState修改狀態(tài)的規(guī)則

12.基礎(chǔ)樣式控制

13.評論案例-列表渲染

14.評論案例-刪除功能實現(xiàn)

15.評論案例-tab切換功能實現(xiàn)

16.評論案例-排序?qū)崿F(xiàn)

17.classnames工具優(yōu)化類名控制

Day2

01.表單受控綁定

02.React中獲取DOM

03.發(fā)表評論-核心功能實現(xiàn)

04.發(fā)表評論-id和時間處理

05.發(fā)表評論-清空內(nèi)容和聚焦實現(xiàn)

06.組件通信-父傳子-基礎(chǔ)實現(xiàn)

07.組件通信-父傳子-props說明

08.組件通信-父傳子-chilren說明

09.父子組件通信-子傳父實現(xiàn)

10.使用狀態(tài)提升實現(xiàn)兄弟組件通信

11.使用context機制跨層傳遞數(shù)據(jù)

12.useEffect-概念理解和基礎(chǔ)使用

13.useEffect-不同依賴項說明

14.useEffect-清除副作用

15.自定義Hook實現(xiàn)

16.ReactHooks使用規(guī)則說明

17.案例優(yōu)化-使用useEffect獲取數(shù)據(jù)

18.案例優(yōu)化-自定義hook封裝請求邏輯

19.案例優(yōu)化-評論Item組件封裝

Day3

01.Redux快速上手

02.Redux與React-環(huán)境準備

03.Redux與React-實現(xiàn)counter

04.Redux與React-提交action傳參

05.Redux與React-異步狀態(tài)操作

06.Redux調(diào)試-devtools

07.美團案例-案例演示和環(huán)境準備

08.美團案例-分類和商品列表渲染

09.美團案例-點擊分類激活交互實現(xiàn)

10.美團案例-商品列表切換顯示

11.美團案例-添加購物車實現(xiàn)

12.美團案例-統(tǒng)計區(qū)域功能實現(xiàn)

13.美團案例-購物車列表功能實現(xiàn)

14.美團案例-控制購物車顯示和隱藏

Day4

01.ReactRouter-快速開始

02.ReactRouter-抽象路由模塊

03.ReactRouter-路由導航跳轉(zhuǎn)

04.ReactRouter-導航跳轉(zhuǎn)傳參

05.ReactRouter-嵌套路由配置

06.ReactRouter-默認二級路由配置

07.ReactRouter-404路由配置

08.ReactRouter-倆種路由模式

09.記賬本-功能演示和環(huán)境創(chuàng)建

10.記賬本-配置別名路徑@

11.記賬本-數(shù)據(jù)Mock實現(xiàn)

12.記賬本-整體路由設(shè)計

13.記賬本-antD主題色定制

14.記賬本-Redux管理賬目列表

15.記賬本-TabBar功能實現(xiàn)

Day5

01.月度賬單-統(tǒng)計區(qū)域-功能演示和結(jié)構(gòu)搭建

02.月度賬單-統(tǒng)計區(qū)域-點擊切換時間選擇框

03.月度賬單-統(tǒng)計區(qū)域-點擊確定切換時間顯示

04.月度賬單-統(tǒng)計區(qū)域-數(shù)據(jù)按月分組實現(xiàn)

05.月度賬單-統(tǒng)計區(qū)域-計算選擇月份之后的統(tǒng)計數(shù)據(jù)

06.月度賬單-統(tǒng)計區(qū)域-初始化渲染統(tǒng)計數(shù)據(jù)

07.月度賬單-列表區(qū)域-單日統(tǒng)計列表實現(xiàn)

08.月度賬單-列表區(qū)域-單日賬單列表渲染顯示

09.月度賬單-列表區(qū)域-點擊切換賬單展開和收起

10.月度賬單-賬單類型圖標組件封裝

11.新增賬單-功能熟悉和結(jié)構(gòu)搭建

12.新增賬單-支出和收入功能實現(xiàn)

13.新增賬單-新增表單實現(xiàn)

14.新增賬單-收尾優(yōu)化

Day6

01.使用CRA初始化項目環(huán)境

02.安裝scss包

03.安裝antDesign

04.配置基礎(chǔ)路由Router

05.配置別名路徑

06.使用gitee管理項目

07.登錄-準備靜態(tài)結(jié)構(gòu)

08.登錄-表單校驗實現(xiàn)

09.登錄-獲取表單數(shù)據(jù)

10.登錄-封裝request請求模塊

11.登錄-redux管理token-編寫樣板代碼

12.登錄-redux管理token-實現(xiàn)Token異步獲取

13.登錄-redux管理token-實現(xiàn)登錄后續(xù)邏輯

14.登錄-Token持久化

15.登錄-封裝Token的存取刪方法

Day7

01.Axios請求頭注入Token

02.根據(jù)Token控制路由跳轉(zhuǎn)

03.Layout-結(jié)構(gòu)創(chuàng)建和樣式reset

04.Layout-二級路由配置

05.Layout-點擊菜單跳轉(zhuǎn)路由

06.Layout-根據(jù)當前路由路徑高亮菜單

07.Layout-展示個人信息

08.Layout-退出登錄實現(xiàn)

09.Layout-處理token失效

10.Home-Echarts基礎(chǔ)圖表渲染

11.Home-Echarts組件封裝實現(xiàn)

12.拓展-API模塊封裝

Day8

01.文章發(fā)布-功能演示說明

02.基礎(chǔ)文章發(fā)布-準備基礎(chǔ)結(jié)構(gòu)

03.基礎(chǔ)文章發(fā)布-準備富文本編輯器

04.基礎(chǔ)文章發(fā)布-頻道列表獲取渲染

05.基礎(chǔ)文章發(fā)布-收集表單數(shù)據(jù)提交表單

06.文章封面-上傳文章封面基礎(chǔ)實現(xiàn)

07.文章封面-實現(xiàn)切換封面類型

08.文章封面-控制上傳圖片的數(shù)量

09.文章封面-發(fā)布帶封面的文章

10.文章列表-功能描述和結(jié)構(gòu)創(chuàng)建

11.文章列表-通過自定義hook獲取頻道列表

12.文章列表-渲染table表格

13.文章列表-適配文章狀態(tài)

Day9

01.文章列表-篩選功能實現(xiàn)

02.文章列表-分頁功能實現(xiàn)

03.文章列表-刪除功能實現(xiàn)

04.文章列表-攜帶id跳轉(zhuǎn)到編輯頁

05.編輯文章-回填基礎(chǔ)數(shù)據(jù)

06.編輯文章-回填封面信息

07.編輯文章-根據(jù)id適配編輯和新增狀態(tài)

08.編輯文章-更新文章

09.項目打包-基礎(chǔ)打包和本地預(yù)覽

10.打包優(yōu)化-配置路由懶加載

11.打包優(yōu)化-包體積可視化分析

12.打包優(yōu)化-CDN配置

溫馨提示：

以上內(nèi)容大家先學為敬，還有【提高篇】和【項目實戰(zhàn)前臺篇】暫未上線，老師正在快馬加鞭錄制中，敬請期待!