Detaillierter Kursinhalt
Standalone Components: Concepts & Migration
- Standalone Components vs Modules
- Understanding the Angular Bootstrapping Process
- Registering Providers in app.config.ts
- Routing and app.routes.ts
- Migrate an existing Project to Standalone Components
Components & Forms Deep Dive
- Using & Migrating to Control Flow Syntax
- Deferred Loading & Selective Activation using @deferred
- Standalone Directives & Directives Composition Api
- Reusability with Content Projection
- Reactive Forms (FormGroup, Form Builder, FormControl, FormArray)
- Typed Forms Nullability, NonNullableFormBuilder, GetRawValue
- Partial Values, Optional Controls, Dynamic Groups and FormRecord
- Classic Form Events vs Unified Form Events
- Cascading Form Controls
- Implementing Custom Controls using ControlValueAccessor
- Typed Forms Validation & Custom Validators
- Handling FormErrors & ErrorStateMatcher
Mastering Reactive Programming using RxJS
- Introduction to RxJS
- Observables, Observers & Use Cases
- Unsubscribing DestroyRef & takeUntilDestroyed
- Imperative vs Declarative Reactivity
- Data- vs Action-Streams
- Mouse & DOM Events as Observables
- Subject Types & Stateful Services
- Base Operators: Mapping, Filtering, Merging,
- Understanding Marble Diagrams & Debugging Observables
- Combination & Transformation Operators
- Retry & Error Handling Strategies
- Implementing & Testing Custom Observable Operators
Mastering Reactivity using Signals
- Introduction to Signals (WritableSignal, Computed, Effects)
- Signals vs Observables
- Signals & Observables Interoperability
- Deep Signals & Linked Signals
- Data Retrieval using resource() and rxResource()
- Nesting Components using Signals, input, output & model
- View Queries: viewChild, -Children, contentChild, -Children
- Creating View Models using Deep Signals
- Communication between Components using Event Bus Pattern
- ngAfterSignalUpdate Lifecycle Hook
State Management using NgRx Classic & NgRx SignalStore
- Overview State Management Patterns
- NgRx Classic vs Signal Store
- Introduction to the Classic NgRx & Redux Pattern
- Implementing NgRx Store, Reducers & Selectors using createFeature
- Actions & createActionGroup
- Effects, Facades, @ngrx/entity & @ngrx/data
- Creating a Signals Store using @ngrx/signals
- NgRx and Signals Interoperability
- Side Effects using rxMethod
- Signals Store, Entity & Custom Data Services
- Implementing and using Custom Store Features
- Tracking State changes
Advanced Routing and App Initialization
- Dependency Injection in Depth: Resolution modifiers and Dependency providers
- Using Constructor vs inject for DI
- App initialization & Interceptors
- Global Error Handling & Http-Error Interceptor with Retry-Patterns
- Using Preloading Strategies & Functional Resolvers
- Functional Route Guards
- Route Redirect Functions
- Binding Router-Params to Component Inputs & routerOutletData
- View Transition Api
- Auxiliary Routes: Common use cases
- Router Animations & Anchor Scrolling
Advanced Testing with Jasmine, Jest, Cypress and NgRx
- Introduction Angular Testing Tools (Jasmine, Karma, Jest & Cypress)
- Testing Classes, Pipes, Directives
- Testing Services using HttpClientTestingModule & HttpTestingController
- Testing Component Interaction (Read, Write, Emit, Inputs)
- Complex Forms Testing & Deferrable Views
- Testing Observables & Signals
- Material Testing using Component Harnesses
- Async Component Testing (done, fakeAsync, waitForAsync)
- Marble-testing RxJS
- Testing NgRx Classic: Mock Store, Mock Selectors, Reducers, Effects, Facades
- Testing Signal Store & Custom Features
- Using Jest for Unit Testing (Setup, Changes in spec, Snapshot Tests)
- Introduction to End-2-End Testing using Cypress
Reusability with Libraries, Nx & Angular Elements
- Angular Building Blocks: Workspace, Apps, Libraries
- Reusable Artifacts using Angular Libraries
- Introduction to Nx Workspaces
- Creating a reusable AI Chat Component using Angular Elements
Real Time Micro-Frontends & Progressive Web Apps
- Introduction to Micro-Frontends
- Real Time connected Micro-Frontend processing Cloud Events
- Introduction to Progressive Web Apps
- HTML 5 APIs
- Understanding and Configuring Service Workers & Manifests
- Installing & Updating Progressive Web Apps
Server Side Rendering (SSR)
- Introduction to Server Side Rendering (SSR)
- Build-time pre-rerendering
- Optimize Components using Platform Specific Code
- Hybrid Rendering
- Introduction to Hydration & Incremental Hydration
Optimizing Applications
- Using Chrome Dev Tools & Lighthouse for Performance Optimization
- Understanding & Using Page Traces & Web Vitals
- Analyzing and Optimizing Bundles & Components
- Build Optimizations using Angular CLI
- Optimizing Images using NgOptimizedImage
- Data-Loading Strategies, Virtual- & Infinite Scrolling,
- Understanding, Profiling & Optimizing Angular Change Detection
- Zoneless Change Detection
- Using @angular/localize
- Accessibility A11y: Best Practices & Linting
- Using Linting and Autoformat with Prettier
- Configuration Management & Containers