Udemy線上課程 React + React Router + Redux 全家桶完全指南 2024 講師:旭乾 張 影音教學 中文發音 中文版(DVD版)
Udemy線上課程React+ReactRouter+Redux全家桶完全指南2024講師:旭乾張影音教學中文發音中文版(DVD版)內容說明:
React是全球最熱門的前端開發框架,由Facebook公司出品。
React有最強大的前端生態,可以實現任何前端應用的需求。
利用組件化的開發方式,可以最大效率地進行開發,並形成規模化、工程化的前端開發模式。
目前,大中小各種規模的公司都有在應用React,從初級到高級開發都有施展的空間,掌握了React可以提高你的就業上限,達到頂級前端開發崗位,拿到更高的薪水。
這門課程會從零開始教會你如何使用React框架,一步一步從React基礎語法,深入到更高級的React組件用法,並掌握良好的開發規範和最佳實踐,讓你擁有完全勝任React前端開發工作的技能。
如果你正打算進入前端開發這一行,或者要跳槽到更有競爭力的崗位上,那麼學完這門課會給你所需要的知識、技能和經驗,讓你的面試更出彩。
課程裏會附帶所有章節的代碼示例,都是從實際開發中演化而來,你可以利用它們進行練習,以及回顧所學的內容。

學完這門課,你可以完全掌握React前端開發必備技能構建大、中、小型的前端項目掌握良好的代碼編寫規範和最佳實踐組件化開發思想和流程
這門課包含React基礎入門、進階和高級用法,並穿插React開發中常見的模式,例如父子組件通信,受控組件非受控組件,發送HTTP請求,Hooks等等。
後面還會介紹React生態相關的庫,例如ReactRouter路由管理,Redux全局狀態管理,styled-components樣式管理。

具體內容(詳見目錄):React開發環境和開發工具配置React項目基本結構和開發流程利用JSX展示條件內容、列表內容處理事件建立與規劃組件Props的基礎用法和高級用法維護組件狀態和狀態的共享父子組件的雙向通信表單控件的處理受控組件、非受控組件、有狀態組件、無狀態組件和高階組件的概念副作用和useEffecthook與後台交互內置和自定義Hooksvirtualdom和diff算法簡介利用ContextAPI+useReducer實現全局狀態管理ref、portal和fragments代碼分割性能優化reactrouter路由配置redux全局狀態管理...更多!
無論你是在校大學生,初入職場的前端開發工程師,或者是中高級的React前端工程師,都可以從這門課程中得到所需要的知識。
你只需要會一些基本的HTML、CSS和JavaScript就夠了。

課程繼續延續我B站影片和其他課程的風格,把節奏設置為最為緊湊的方式,你的學習方式應該是這樣:理解每節課所提到的概念。
把示例實踐過程看懂。
每個影片看完之後,回顧重點,並自己編寫代碼,遇到記不起來的地方再去看源代碼或影片。

感謝你選擇這門課程,接下來的時間,我會陪你在學習的路上一直走下去,幫你學會React前端開發,並指導你如何提高自學能力,成為一箇成長型人才!
課程內容:
01-快速開始
001課程介紹.mp4
002source-code.zip
002源碼下載.html
003React是一個怎樣的庫?.mp4
004為什麼要使用React?.mp4
005從頁面思維轉向組件思維.mp4
006React項目的開發流程.mp4
007安裝Node.js和yarn.mp4
008配置開發工具.mp4
009建立一個React項目.mp4

02-React基礎語法
001利用JSX編寫頁面結構.mp4
002JSX與HTML的區別.mp4
003在JSX中使用JS表達式來展示內容.mp4
004展示列表元素.mp4
005根據條件渲染元素.mp4
006注意:JSX對于假值的處理.mp4
007在JSX中使用注釋.mp4
008處理事件.mp4
009通過className添加樣式.mp4
010添加內聯樣式.mp4
011展示圖片.mp4

03-React組件化開發基礎
001什麼是組件?.mp4
002建立一個組件.mp4
003在JSX中使用組件.mp4
004給組件傳遞Props.mp4
005給props設置默認值.mp4
006給組件傳遞Children,實現自定義組件視圖.mp4
007給組件傳遞事件監聽.mp4
008子組件給父組件傳值.mp4

04-React狀態入門
001什麼是狀態?.mp4
002使用useState定義組件狀態.mp4
003更新組件狀態.mp4
004更新數組狀態.mp4
005更新對象狀態.mp4

05-React處理表單事件
001處理用戶的輸入.mp4
002input、select、radio、checkbox的處理.mp4
003定義多個狀態.mp4
004使用循環的方式渲染多個checkboxes和radios.mp4
005表單整體提交事件處理.mp4
006表單重置事件處理&狀態還原.mp4
007表單驗證.mp4

06-React組件的副作用
001什麼是副作用?.mp4
002錯誤使用副作用的例子.mp4
003使用useEffect()執行副作用.mp4
004useEffect()的執行時機與依賴數組的作用.mp4
005清理副作用.mp4
006useEffect()中使用異步函數.mp4

07-JSX進階
001Fragments:解決JSX只能有一個根元素的問題.mp4
002JSX復用與可閱讀性:保存JSX到變量中.mp4
003條件渲染的另一種形式.mp4
004導出子組件:MyComponent.SubComponent.mp4
005一次性傳遞多個屬性:MyComponent{...props}.mp4

08-ReactProps進階
001組件的數據流向:單向數據流.mp4
002子組件跟父組件進行通信(傳值).mp4
003props可以接收任何類型的值.mp4
004props可以接收任何類型的值.mp4
005驗證Props的類型.mp4
006利用children讓子組件給父組件傳值.mp4
007中間組件:Props透傳.mp4
008ClassName屬性傳遞與合并.mp4

09-ReactState進階
001狀態提升:不同組件之間如何共享狀態?.mp4
002注意:狀態更新是異步的.mp4
003正確訪問上一次修改的狀態的方式.mp4
004useReducer集中處理狀態更新邏輯.mp4
005狀態和Props的區別總結.mp4

10-ReactUseEffect進階
001useEffect空依賴數組就完全沒有問題嗎?.mp4
002函數作為useEffects依賴時,如何避免不要的重新渲染.mp4
003不必要的函數依賴:把函數定義在外界.mp4
004在請求遠程數據時避免重新渲染(界面閃現).mp4
005useEffect只能在組件頂級作用域中使用.mp4

11-處理組件錯誤
001處理組件錯誤.mp4
002組件懶加載:實現代碼分割,提高頁面加載速度.mp4
003不要濫用useEffects:把useEffect轉換為事件監聽.mp4
004引入SVG圖標的方式.mp4
005避免..:絕對路徑導入.mp4
006利用Children避免組件過度嵌套與propsdrilling.mp4
007組件概念:受控組件.mp4
008組件概念:非受控組件.mp4
009組件概念:高階組件(已被hooks代替).mp4

12-章節12React自定義Hooks
001什麼是Hooks.mp4
002編寫自定義的hooks.mp4
003給Hooks傳遞參數.mp4
004在不同組件中復用Hooks邏輯.mp4
005多個Hooks聯動.mp4

13-章節13React與後台交互
001HTTP簡介.mp4
002使用fetch發送GET請求,加載遠程數據.mp4
003Loading加載狀態展示.mp4
004傳遞URLquery查詢參數.mp4
005發送POST、DELETE、PUT請求到服務器.mp4
006設置HTTPHeaders.mp4
007處理請求錯誤.mp4
008配置代理:解決跨域問題.mp4
009AbortController取消請求.mp4
010封裝Fetch.mp4
011使用Axios發送請求.mp4
012axios取消請求.mp4
013封裝Axios.mp4

14-章節14React與DOM交互(慎用)
001獲取HTMLDOM實例.mp4
002在useEffect中執行DOM操作.mp4
003fowardRef:讓父組件獲取子組件實例.mp4
004useImperativeHandle:暴露組件方法.mp4
005useId:生成唯一且不重復的id值.mp4

15-React調試、打包
001安裝React開發者工具.mp4
002開發者工具:審查Components.mp4
003開發者工具:測試性能.mp4
004斷點調試:一步一步檢查結果.mp4
005打包React項目為產品環境靜態頁面0358.mp4

16-React內部機制
001React運行原理:jsx是如何編譯成HTML的.mp4
002reconciliation協調過程和diff算法.mp4

17-章節17React性能優化
001使用useMemo避免不必要的重復計算.mp4
002使用React.memo緩存組件.mp4
003使用useCallback緩存函數.mp4
004減少依賴:當useCallback依賴數組包含狀態時.mp4

18-React組件樣式管理
001StyledComponents簡介.mp4
002安裝styled-components和VSCode插件.mp4
003給普通HTML元素添加樣式.mp4
004組織樣式的方式.mp4
005覆蓋樣式.mp4
006給普通React組件添加樣式.mp4
007在樣式中訪問props.mp4
008嵌套樣式.mp4
009定義主題.mp4
010實現組件多態.mp4

19-React動畫實現
001原生CSS過渡transition.mp4
002原生CSS動畫keyframes.mp4
003原生JS動畫:WebAnimation.mp4
004RTG-實現入場和離場動畫.mp4
005RTG組件切換動畫.mp4
006RTG列表項過渡動畫.mp4
007RTG與AnimateCSS集成.mp4

20-章節18ReactRouter
001ReactRouter簡介.mp4
002安裝ReactRouter&項目介紹.mp4
003配置ReactRouter路由渲染第一個頁面.mp4
004配置路由默認首頁及Outlet.mp4
005配置子路由.mp4
006使用Link實現客戶端路由跳轉.mp4
007使用和配置loader加載遠程數據.mp4
008訪問loader加載好的數據并展示.mp4
009獲取動態路由的參數并加載數據.mp4
010高亮選中導航菜單.mp4
011使用Form發送GET請求,控制按鈕的路由跳轉.mp4
012使用Form和Action發送POST請求添加數據.mp4
013使用redirect重定向頁面.mp4
014展示表單默認值.mp4
015使用Form和Action發送PUT請求更新數據.mp4
016使用Form和Action發送Delete刪除數據.mp4
017navigate:編程式的控制導航.mp4
018使用Form和Action發送GET請求+請求參數.mp4
019編程式的提交表單.mp4
020URL與Form表單項同步.mp4
021pushvsreplace.mp4
022實現操作數據但不發生路由跳轉.mp4
023友好用戶體驗:樂觀UI.mp4
024全局加載狀態展示.mp4
025局部加載狀態展示:搜索狀態.mp4
026配置錯誤組件并訪問錯誤信息.mp4
027錯誤邊界.mp4
028拋出自定義錯誤.mp4
029jsonutility:返回客戶端JSON數據.mp4
030先渲染後加載數據:Deferred數據訪問和加載狀態展示.mp4
031使用useAsyncValue訪問deferred數據.mp4
032在Await中訪問fetcher.mp4
033配置滾動恢復.mp4
034使用JSX配置路由.mp4

21-章節19ReactContextAPI原生狀態管理
001為什麼使用ReactContextAPI.mp4
002建立Context.mp4
003組織Context代碼.mp4
004Context結合useReducer實現全局狀態管理.mp4

22-章節20Redux全局狀態管理
001Redux簡介&為什麼需要全局狀態管理.mp4
002ReduxToolkit官方Redux腳手架工具.mp4
003本章項目介紹.mp4
004源碼簡介&添加Redux到項目中.mp4
005配置ReduxStore.mp4
006建立Slice:ReduxToolkit全新狀態管理方式.mp4
007使用selector在組件中讀取狀態.mp4
008添加Reducers&Actions修改狀態.mp4
009Redux開發者工具簡介.mp4
010使用Selector訪問其他Slice的狀態.mp4
011修改數組中的狀態.mp4
012本地表單狀態管理.mp4
013全局表單狀態管理:搜索.mp4
014全局表單狀態管理:排序.mp4
015全局表單狀態管理:過濾.mp4
016在selector中調用其他Selector獲取過濾後的數據.mp4
017練習:剩余單詞,進度.mp4
018Redux中間件&ReduxThunk簡介.mp4
019在thunk中獲取全局狀態.mp4
020項目修改&後端準備.mp4
021asyncthunk處理GET請求.mp4
022觸發asyncthunk并現實加載和錯誤狀態.mp4
023處理POST請求.mp4
024處理PUT請求,并訪問全局狀態.mp4
025RTKQuery簡介.mp4
026RTKQuery加載數據.mp4
027RTKQuery修改數據.mp4
028RTKQuery刷新數據.mp4
029RTKQuery樂觀UI.mp4


相關商品:Udemy線上課程2021年版本React&ReactHook&ReactRouter基礎入門實戰視頻教程(含教材)講師:weilianggan影音教學中文發音中文版(DVD版)Udemy線上課程ReactNative中文全系列教程(含教材)講師:ChinavaneOcean影音教學中文發音中文版(2DVD)Udemy線上課程打造React即時通信UI庫講師:旭乾張影音教學中文發音中文版(DVD版)Udemy線上課程ReactJS前端應用開發:從入門到入行講師:ChrisLin影音教學中文發音繁體中文版(DVD版)Udemy線上課程網頁前端框架React超入門(含教材)講師:谷哥徐影音教學中文發音繁體中文版(DVD版)