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版)