Angular: Keeping it Fat, Dumb, and Happy: An Architectural Approach
summary
Recommendation: adopt an architecture where templates stay declarative and dumb (use ngIf at the highest level so children assume valid inputs), components act as thin controllers with specific handlers not reducers, and services become fat, specific units that hold processing and HTTP calls (avoid injecting HttpClient into components). Use RxJS async pipe for views and tap to capture observable values in the component. Prefer component decision logic (e.g., single‑ vs multi‑server switching) in the component and processing/mapping in services.
AI-written summary · about
chapters (19)
- 0:00Introduction
- 0:22Core Angular concepts
- 1:05Fat dumb happy architecture
- 2:30Templates declarative and dumb
- 5:42Imperative vs declarative templates
- 7:49Dumb templates and coupling
- 9:35Smart and thin components
- 13:08Thin components and testability
- 14:12Component fatness decisions
- 16:39Components as simple as possible
- 17:01Container vs presentation components
- 18:47Async pipe and tap operator
- 20:32Presentation components explained
- 22:19Event handling in components
- 22:40Services fat and happy
- 24:04Component-specific services
- 25:30Happy services and state
- 27:15Stateful vs stateless services
- 29:22Service access and summary
related talks
23mSmart and Dumb Components
24mThe Architecture of Components
34mScalable Angular Architecture
26mScalable Angular Architecture
20mEngineering Scalable Angular Components
27mThe good, the bad and the ugly - Component architecture at scale
18mFlexible data flow architecture in Angular
25mAngular Architecture: From Patterns to Implementation