NgRx（採用 NgRx 資料）- 完整指南（Angular 15）

了解現代 NgRx 生態系統，包括 NgRx Data、Store、Effects、Router Store、NgRx Entity 和 DevTools

從這 6 小時的課程，你會學到

Github 貯存庫中的程式碼，每個部分都有可下載的 ZIP 檔
熟悉集中儲存模式，以及如何在 Angular 中使用它
了解何時使用集中式 Store (儲存) 解決方案以及原因
了解如何使用 NgRx Data 以最少的程式碼處理實體資料( entity data )
深度地學習 NgRx Store，詳細了解所有核心儲存模式，包括 Reducers 和 Actions
詳細了解 NgRx Effects，了解何時使用副作用
詳細了解 NgRx Entity，何時使用以及為什麼使用，了解有哪些好處
逐步轉換現有的 Angular 普通應用程式，並將其轉變為基於 Store (儲存)的應用程式
學習在 NgRx 中實現常見功能，例如身份驗證或實體分頁
通過實施真實用例，以有趣且實用的方式深入學習 NgRx

要求

只需有點 Angular 和 Typescript

課程說明

本課程是新 NgRx 生態系統的完整指南，包括 NgRx Data、Store、Effects、Router Store、NgRx Entity 和 DevTools，並附帶一個正在運行的 Github repo

本課程簡而言之

當涉及到前端架構設計選擇時，狀態管理是第一個要了解的主題。為什麼選擇在單頁應用程式( SPA，single page application )中進行狀態管理，什麼時候做，為什麼，有什麼好處，有什麼權衡？

這些都是我們將在本課程中解決的關鍵問題，我們將提供 NgRx 生態系統的擴展導覽。

Angular 領域最流行的狀態管理程式庫( state management library )是 NgRx，這是有充分理由的。 NgRx 的最新版本可能是最近整個 Angular 生態系統中最重要的版本之一。 儘管向後相容，但它包含如此多的新功能，幾乎可以說是一個全新的狀態管理程式庫。

在幕後，Actions、Reducers、Effects、Entities 和 Selectors 的核心概念保持不變，但我們現在擁有一個全新的 API，用於以更簡潔的方式管理這些概念。此外，我們還包含了 NgRx Data，這是一種管理實體資料的全新且非常強大的方法。

實際上，NgRx Data 是 NgRx 之上的一個強大的抽象層，它允許我們為應用程式的大部分添加狀態管理，而無需編寫太多程式碼！

課程大綱

在本課程中，我們將採用一個在沒有任何狀態管理的情況下構建的小型現有應用程式。我們將通過識別應用程式在其初始形式中存在的一些問題來了解不進行狀態管理的後果。

然後我們就要開始重構應用了，我們要一步步給應用多螢幕添加狀態管理。我們將從應用程式的身份驗證功能開始，然後將繼續進行實體資料管理部分。

我們將詳細解釋 NgRx 的所有關鍵概念：Actions、Reducers、Effects 和 Selectors，並詳細說明 Store 架構本身，了解其優勢。

在整個課程中，我們將逐步介紹並詳細解釋 NgRx Store 模組、NgRx Effects，且深入介紹 NgRx Entity(實體) 和實體格式，我們將安裝並導覽 NgRx Dev Tools、NgRx Router Store 和時間旅行調試器( time-travelling debugger )。

我們還將學習如何充分利用 NgRx Data，並學習如何對其進行客製化，以便使用最少的應用程式程式碼來管理實體資料。我們將涵蓋 NgRx，同時將如良好的 Action hygiene (衛生)等最佳實踐牢記於心。

本課程涵蓋以下主題：

狀態管理介紹
詳細的 Store 架構
NgRx 關鍵概念
Actions 與 Action Creators
Reducers
NgRx Effects
選擇器
向 NgRx 應用程式添加身份驗證
NgRx Entity 與此實體格式
NgRx DevTools
NgRx 時間旅行調節器 ( Time Travelling Debugger )
NgRx 運行時間檢查和 Store 不變性
NgRx Router Store
NgRx Data 和實體狀態管理
NgRx 最佳實踐

您將在本課程中學到什麼？

在本課程結束時，您將對狀態管理的概念和一般的集中式儲存( store )解決方案感到滿意。

您將使用簡單的方法使用 NgRx 輕鬆設計新應用程式，並且您將深入了解完整的 Ngrx 程式庫( library )生態系統：包括 Ngrx Store、Effects、Entity 和 NgRx Data 程式庫。

您將了解如何使用 Ngrx Schematics 快速構建部分解決方案，以及如何從頭開始設置 Ngrx DevTools，包括路由器整合。

目標受眾

希望深入了解現代 NgRx 生態系統的 Angular 開發人員，包括 Ngrx Store、Effects、Router Store、Ngrx Entity、DevTools 和 Schematics！

講師簡介

Angular University 最暢銷的 Angular 課程 | 10 萬多名學生 | 16門課程

大家好，我是 Vasco Cavalheiro，是 Angular University 的線上講師。

多年來，我已經幫助超過 10 萬名開發人員學習了 Angular 框架及其周圍的技術生態系統。

在右上角的鏈接部分查看我的 Linkedin。

關於 Angular University：

Angular University 的目標是成為您學習和跟上整個 Angular 生態系統的地方。我們提供優質的視訊教程，螢幕操作風格。

無論您是 Angular 的初級、中級還是高級，我們都有幾門課程適合您。

更多關於我：

我是一名擁有多年經驗的軟體開發人員，非常擅長使用 Angular 建構用戶界面。多年來，我一直在各種企業項目中擔任前端開發人員/架構師。

我從事過大量專案，從幫助建構歐洲犯罪記錄資訊交換系統的單頁應用程式，到全新的電子銀行門戶，再到企業銀行門戶，等等。我一直是內部框架團隊的重要成員，該團隊為數十名開發人員的內部部門建構框架。

我也喜歡教授、寫作和談論技術。我期待成為您的 Angular 講師，

親切的問候，

Vasco

英文字幕：有

想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To

點選 ✨ 大多課程 NT320優惠連結 (到 425 )| Udemy 永久擁有課程 ( 在電腦瀏覽器登入，點選“優惠連結”後再回想要的課程介紹中點選“報名參加課程”即可取得）
Udemy 現在越來越多課程有中文字幕，請參考 Soft & Share 中文線上課程
手機上點選優惠連結看到的價格比電腦上看到的貴
＄代表當地貨幣, 如在台灣為 NT
點選”報名參加課程”有可能因瀏覽器 cookies 轉久一點或回報錯誤而無法連上，請稍等刷新或重新點選就會出現