Angular Masterclasses
Module-by-module masterclasses on enterprise Angular — NgModule vs Standalone architecture, strict TypeScript component design, Hierarchical Dependency Injection, RxJS and Signals, and typed routing with guards.
Angular — Module 1: Architecture, Workspace & Enterprise Setup
Deconstruct Angular's opinionated framework design, understand how ES modules underpin both NgModules and Standalone components, and initialize a production-grade enterprise workspace with the Angular CLI.
Angular — Module 2: NgModule Architecture vs the Standalone Shift
A working NgModule-based feature rewritten as Standalone Components — declarations, imports, exports, and providers mapped 1:1 against standalone: true, showing exactly what boilerplate disappears and what stays.
Angular — Module 3: Component Anatomy & Data Binding Mechanics
The @Component decorator's metadata surface, and all four data binding techniques — interpolation, property binding, event binding, and two-way binding with NgModel — with fully typed event handling.
Angular — Module 4: Hierarchical Dependency Injection & Enterprise Services
Module injector vs Element injector, a fully typed HttpClient-backed service with providedIn: 'root', and the modern inject() function contrasted against constructor injection.
Angular — Module 5: Reactive Programming Mastery — RxJS & Signals
Streams, Observables, and Observers; production RxJS operators (map, filter, switchMap, catchError); and Angular Signals — signal, computed, effect — compared against RxJS for change detection efficiency.
Angular — Module 6: Routing, Guards & the Capstone Operations Board
Strongly typed lazy-loaded routing with loadComponent, an asynchronous CanActivateFn guard, a capstone real-time Enterprise Operations Board with Reactive Forms validation, and a production architecture cheat sheet.