Angular Training Built for AI-Paired Learning

This chapter focuses on What Angular is and where it fits, The Angular release cycle and versions, Installing the Angular CLI and the practice needed to use these concepts confidently in real projects.

• What Angular is and where it fits
• The Angular release cycle and versions
• Installing the Angular CLI
• Creating and serving a workspace
• Workspace and project file structure
• angular.json and build targets
• Development against production builds
• The bootstrap process
• Standalone components explained
• Component decorators and metadata
• Templates and the component class
• Interpolation and expression rules
• Property binding
• Attribute, class and style bindings
• Event binding and the $event object
• Two-way binding with ngModel and model signals
• The component lifecycle hooks
• Change detection: what triggers it
• Zone-based against zoneless change detection
• View encapsulation and component styles
• The CLI generate commands
• Debugging with Angular DevTools

This chapter focuses on The built-in control flow syntax, @if, @else if and @else, @for, track expressions and performance and the practice needed to use these concepts confidently in real projects.

• The built-in control flow syntax
• @if, @else if and @else
• @for, track expressions and performance
• @switch and @case
• @defer and deferrable views
• Loading, placeholder and error blocks
• ngClass and ngStyle
• Attribute directives explained
• Writing a custom attribute directive
• Structural directives and the microsyntax
• Writing a custom structural directive
• Host bindings and host listeners
• Template reference variables
• ng-template and ng-container
• ngTemplateOutlet for reusable fragments
• Content projection with ng-content
• Multi-slot projection and selectors
• Built-in pipes: date, currency, number, percent
• async pipe and subscription management
• Writing a custom pipe
• Pure against impure pipes
• Safe navigation and non-null assertion in templates

This chapter focuses on Component inputs and typed input signals, Required inputs and input transforms, Component outputs and the output function and the practice needed to use these concepts confidently in real projects.

• Component inputs and typed input signals
• Required inputs and input transforms
• Component outputs and the output function
• Emitting typed events
• Parent to child and child to parent flow
• Sibling communication through a service
• Signals: the reactive primitive
• Creating and reading a signal
• Updating with set and update
• computed values and derivation
• effect and its correct use
• Signal equality and change detection
• linkedSignal for derived writable state
• resource for async signal state
• toSignal and toObservable interop
• viewChild and viewChildren queries
• contentChild and contentChildren queries
• ElementRef and safe DOM access
• Renderer2 and why direct DOM access is risky
• OnPush change detection strategy
• Immutability and OnPush together
• Refactoring an RxJS component to signals

This chapter focuses on Separating logic from presentation, Creating an injectable service, providedIn root and its tree-shaking benefit and the practice needed to use these concepts confidently in real projects.

• Separating logic from presentation
• Creating an injectable service
• providedIn root and its tree-shaking benefit
• Component-level providers
• The injector hierarchy
• Element injectors and module injectors
• The inject function
• Constructor injection compared with inject
• Injection tokens
• Value, factory and existing providers
• useClass and swapping implementations
• Optional, Self, SkipSelf and Host decorators
• Multi providers
• Environment providers
• Configuring services at bootstrap
• Singleton lifetime and shared state
• Stateful services and signals
• Facade services over complex state
• Testing services in isolation
• Mocking dependencies in tests
• Circular dependency errors
• Structuring services in a large app

This chapter focuses on Configuring HttpClient with providers, GET requests and typed responses, POST, PUT, PATCH and DELETE and the practice needed to use these concepts confidently in real projects.

• Configuring HttpClient with providers
• GET requests and typed responses
• POST, PUT, PATCH and DELETE
• Query parameters with HttpParams
• Custom headers with HttpHeaders
• Reading the full response
• Handling errors with catchError
• Typed error contracts
• Retrying failed requests
• Cancelling in-flight requests
• Functional HTTP interceptors
• Adding auth tokens in an interceptor
• Logging and timing interceptors
• Caching responses in an interceptor
• Handling 401 and refresh flows
• Loading indicators driven by requests
• Pagination and infinite scroll
• File upload with progress events
• File download and blob handling
• The httpResource API for signal-based data
• Testing with HttpTestingController
• Designing a typed API layer

This chapter focuses on Template-driven against reactive forms, FormControl and its state, FormGroup and nested groups and the practice needed to use these concepts confidently in real projects.

• Template-driven against reactive forms
• FormControl and its state
• FormGroup and nested groups
• FormArray for dynamic lists
• Typed reactive forms
• FormBuilder and NonNullableFormBuilder
• Binding controls to the template
• Reading and setting values
• setValue against patchValue
• Control states: pristine, dirty, touched
• Value changes and status changes streams
• Built-in validators
• Writing a custom synchronous validator
• Cross-field validation
• Asynchronous validators
• Displaying validation messages accessibly
• Error summary patterns
• Disabling and enabling controls
• Dynamic forms from configuration
• Custom form controls with ControlValueAccessor
• Multi-step wizards and draft state
• Testing forms

This chapter focuses on Configuring routes with provideRouter, router-outlet and route rendering, routerLink and active link styling and the practice needed to use these concepts confidently in real projects.

• Configuring routes with provideRouter
• router-outlet and route rendering
• routerLink and active link styling
• Programmatic navigation with Router
• Route parameters and snapshots
• Reactive parameter streams
• Query parameters and fragments
• Child and nested routes
• Named outlets and auxiliary routes
• Wildcard routes and 404 handling
• Redirects and path matching strategy
• Lazy loading with loadComponent
• Lazy loading with loadChildren
• Preloading strategies
• Functional route guards
• canActivate and canActivateChild
• canDeactivate and unsaved change prompts
• Route resolvers for prefetching data
• Route data and static metadata
• Title strategy and page titles
• Scroll position restoration
• Route-level code splitting and budgets

This chapter focuses on Observables in the Angular ecosystem, Subscribing and unsubscribing safely, takeUntilDestroyed and the practice needed to use these concepts confidently in real projects.

• Observables in the Angular ecosystem
• Subscribing and unsubscribing safely
• takeUntilDestroyed
• The async pipe as the default
• Subjects and BehaviorSubjects for state
• map, filter and tap in practice
• switchMap for search and typeahead
• mergeMap, concatMap and exhaustMap choices
• debounceTime and distinctUntilChanged
• combineLatest for dependent streams
• forkJoin for parallel requests
• startWith and default values
• shareReplay and caching streams
• Error handling in streams
• retry and retryWhen strategies
• Custom operators for reuse
• Testing observables
• Marble testing basics
• Common memory leaks with subscriptions
• Interop between signals and observables
• Choosing signals or RxJS for a problem
• Migrating existing streams incrementally

This chapter focuses on Kinds of state in an application, Local component state with signals, Shared state in services and the practice needed to use these concepts confidently in real projects.

• Kinds of state in an application
• Local component state with signals
• Shared state in services
• When a store becomes necessary
• Store patterns: actions, reducers, selectors
• NgRx overview and mental model
• NgRx Signal Store
• Component Store for local complex state
• Normalising entity collections
• Optimistic updates and rollback
• Caching and invalidation
• Derived state and memoised selectors
• Feature-based folder structure
• Smart and presentational components
• Shared and core module boundaries
• Barrel files and import hygiene
• Enforcing boundaries with lint rules
• Monorepo layout for multiple apps
• Shared UI component libraries
• Versioning and publishing internal libraries
• Documenting architecture decisions
• Refactoring a growing application

This chapter focuses on The Angular testing setup, TestBed configuration, Testing a component template and the practice needed to use these concepts confidently in real projects.

• The Angular testing setup
• TestBed configuration
• Testing a component template
• Component harnesses
• Testing inputs, outputs and signals
• Testing services and HTTP
• Testing routing and guards
• Fake async and tick
• End-to-end testing basics
• Coverage and meaningful tests
• Bundle budgets and build analysis
• Tree shaking and unused code
• Image and font optimisation
• Lazy loading strategy review
• Runtime performance profiling
• Change detection profiling
• Server-side rendering with Angular
• Hydration and incremental hydration
• Prerendering routes
• Environment configuration and secrets
• Deployment pipelines and CI
• Monitoring, error reporting and rollback