Using TypeScript with Redux Architecture
summary
Shows concrete, testable claims: TypeScript plus rxjs and NgRx produce a predictable Redux-style store with real CLI commands and generated NgRx schematics that yield action/effect/reducer skeletons. Demonstrates discriminated-union actions, exhaustive never checks, operator choices like concatMap vs switchMap and startWith, and the entity adapter for efficient collections. The demo wires selectors into Angular with the async pipe and the generated app connects to Redux devtools and time-travel debugging, proving the approach scales for large apps.
AI-written summary · about
chapters (22)
- 0:00Start
- 6:22NgRx Boilerplate
- 7:10Scaffolding
- 8:52String Enum Action Types
- 9:32Object Properties as Action Types
- 9:50Asynchronous Action Creator Classes
- 10:42Discriminated Unions
- 12:14Type Guards
- 12:42Exhaustive Checks
- 17:00Effects for Fetching Data
- 17:31Podcast Reducer
- 17:57Action Reducer Map
- 19:27Entity pattern for shallow data structures
- 19:55LoadPodcasts - Loading State
- 20:06LoadPodcasts Failure - Error State
- 21:13@ngrx/entity - Entity State adapter for collections
- 22:04Angrx/entity - Entity Adapter methods
- 23:14Dependent Asynchronous Effects
- 23:44concatMap vs switch Map
- 25:46Entities Selector
- 26:34Smart Container Components
- 28:39Redux DevTools
related talks
45mKeynote - Understand NGRX by building a Store
27mAngular Architecture: From Patterns to Implementation
57mBuilding Scalable, Maintainable Apps Using TypeScript and React
26mState Management Patterns and Best Practices with NgRx
36mHello generics, Goodbye boilerplate
41mRxJS Advanced Patterns Learn how to manage heavily dynamic Angular apps
57mTypeScript for React developers
23mMagical TypeScript features and how they help projects like NgRx