Angular
Production-grade Angular tutorials — patterns, performance, and the features that move the needle.
Browse all 105 articles ↓All Angular articles
105 articles in this topic.
Angular App Architecture and Angular DevTools in Practice [2026]
Lesson 14.9 of the Angular tutorial — container and presentational components, feature folders, core and shared boundaries, lazy routes and …
Angular Monorepos: CLI Workspaces, Libraries and Nx [2026]
Lesson 14.8 of the Angular tutorial — multi-project CLI workspaces, library structure and public-api.ts, ng-packagr builds, path mappings, s…
Angular Elements: Shipping Components as Web Components [2026]
Lesson 14.7 of the Angular tutorial — turning a standalone component into a custom element with createCustomElement and createApplication, h…
Angular i18n with $localize: Translate, Pluralize and Build per Locale [2026]
Lesson 14.6 of the Angular tutorial — marking text with i18n and $localize, custom IDs, ICU plural and select, ng extract-i18n and translati…
Angular Material and CDK: Setup, Material 3 Theming and Dark Mode [2026]
Lesson 14.5 of the Angular tutorial — installing Angular Material, Material 3 theming with mat.theme(), system tokens and overrides, dark mo…
Custom Form Controls in Angular: ControlValueAccessor and Signal Forms [2026]
Lesson 14.4 of the Angular tutorial — building a star-rating control with ControlValueAccessor and NG_VALUE_ACCESSOR, built-in validation wi…
NgRx Store in Modern Angular: Actions, Reducers, Selectors and Effects [2026]
Lesson 14.3 of the Angular tutorial — classic NgRx Store the standalone way: provideStore, createActionGroup, createReducer, createFeature w…
NgRx Signal Store Deep Dive: State, Methods, Entities and Testing [2026]
Lesson 14.2 of the Angular tutorial — building stores with signalStore, withState, withComputed, withProps, withMethods and withHooks, patch…
Angular State Management in 2026: Signals, Services or NgRx? [2026]
Lesson 14.1 of the Angular tutorial — the four levels of state management (local signals, a service holding signals, NgRx Signal Store, NgRx…
Reusable, Accessible Angular Animations: Reduced Motion, SSR and Performance [2026]
Lesson 13.4 of the Angular tutorial — reusable CSS motion tokens and utilities, prefers-reduced-motion and an in-app setting, disabling anim…
Angular Route Transition Animations with the View Transitions API [2026]
Lesson 13.3 of the Angular tutorial — route animations with withViewTransitions(), styling ::view-transition pseudo-elements, shared element…
Angular Enter, Leave and State Animations with CSS and Signals [2026]
Lesson 13.2 of the Angular tutorial — state animations with classes bound to signals, keyframe effects, runtime enter and leave animations, …
Angular Animations in 2026: animate.enter, animate.leave and CSS [2026]
Lesson 13.1 of the Angular tutorial — the modern animation toolbox: animate.enter and animate.leave with native CSS, why @angular/animations…
Angular E2E Testing in 2026: Playwright vs Cypress vs WebdriverIO [2026]
Lesson 11.5 of the Angular tutorial — how ng e2e works, Playwright, Cypress and WebdriverIO compared for Angular apps, what belongs in E2E v…
Testing Angular Pipes, Directives and Services with HttpTestingController [2026]
Lesson 11.4 of the Angular tutorial — unit testing pure pipes, attribute and structural directives through host components, services that us…
Angular Component Testing with TestBed: Zoneless, OnPush and Harnesses [2026]
Lesson 11.3 of the Angular tutorial — TestBed for standalone components, zoneless change detection in tests, whenStable() vs detectChanges()…
Testing Angular Signals and Effects: TestBed.tick(), Inputs and Resources [2026]
Lesson 11.2 of the Angular tutorial — testing signal, computed and linkedSignal directly, flushing effects with TestBed.tick(), signal input…
Angular Unit Testing with Vitest: ng test, Setup and Migration [2026]
Lesson 11.1 of the Angular tutorial — how the default Vitest setup behind ng test works, the angular.json options that matter, jsdom vs happ…
Debugging Angular Hydration Mismatches: NG0500 Errors and Fixes [2026]
Lesson 10.8 of the Angular tutorial — debugging hydration mismatches: what each NG0500-range error means, a step-by-step routine, the usual …
Why Isn’t My Angular Route Guard Firing? canMatch, canActivate and More [2026]
Lesson 10.7 of the Angular tutorial — why route guards don't run when you expect: canMatch, canActivate, canActivateChild and canDeactivate …
Race Conditions in Angular: switchMap vs mergeMap vs concatMap vs exhaustMap [2026]
Lesson 10.6 of the Angular tutorial — fixing race conditions in async code: a decision table for switchMap, mergeMap, concatMap and exhaustM…
Finding Subscription and Effect Leaks in Angular: A Codebase Audit [2026]
Lesson 10.5 of the Angular tutorial — a code-level leak audit: searches that find risky subscriptions, timers and listeners, retrofitting ta…
Why Does My Angular HTTP Call Fire Twice? Causes and Fixes [2026]
Lesson 10.4 of the Angular tutorial — why HttpClient requests fire twice: cold Observables with multiple subscribers, effects that re-run, S…
Why Isn’t My Angular Component Updating? Zoneless and OnPush Debugging [2026]
Lesson 10.3 of the Angular tutorial — a step-by-step diagnosis for components that don't update in zoneless, OnPush apps: same-reference mut…
Debugging ExpressionChangedAfterItHasBeenChecked (NG0100) in Angular [2026]
Lesson 10.2 of the Angular tutorial — why the ExpressionChangedAfterItHasBeenChecked (NG0100) check exists, the five root causes behind it, …
Angular Runtime Errors Explained: NG0100 to NG0956 Catalog [2026]
Lesson 10.1 of the Angular tutorial — a reference catalog of the most common Angular runtime errors (NG0100, NG0200, NG0201, NG0203, NG0300,…
Angular SSR Caching and Edge Deployment: CDN, Cache-Control and TTFB [2026]
Lesson 9.7 of the Angular tutorial — caching rendered pages and assets with Cache-Control, keeping personal data out of shared caches, runni…
Angular TransferState and the HTTP Transfer Cache: Deep Dive [2026]
Lesson 9.6 of the Angular tutorial — how the HttpClient transfer cache avoids double fetches after SSR, its default rules, withHttpTransferC…
Angular Incremental Hydration with @defer Hydrate Triggers [2026]
Lesson 9.5 of the Angular tutorial — how incremental hydration keeps server-rendered @defer blocks dehydrated until a hydrate trigger fires,…
Angular Event Replay: Handling Clicks Before Hydration [2026]
Lesson 9.4 of the Angular tutorial — the gap between visible and interactive on SSR pages, how event replay captures and replays early click…
Angular Hydration Pitfalls: What Breaks It and How to Fix It [2026]
Lesson 9.3 of the Angular tutorial — how non-destructive hydration with provideClientHydration() reuses server DOM, how to verify it, the pa…
Angular SSR Bootstrap: provideServerRendering, server.ts and Request Tokens [2026]
Lesson 9.2 of the Angular tutorial — what provideServerRendering() and withRoutes() configure, main.server.ts and BootstrapContext, server.t…
Angular SSR vs SSG vs Prerendering: Per-Route Render Modes [2026]
Lesson 9.1 of the Angular tutorial — the three render modes (Server, Prerender, Client), assigning them per route with ServerRoute[] in app.…
Angular Security: XSS, Sanitization, Trusted Types and CSP [2026]
Lesson 8.9 of the Angular tutorial — how Angular sanitizes each security context, using bypassSecurityTrust* safely, the DOM APIs that skip …
Avoiding Unnecessary Re-renders in Angular: A Performance Checklist [2026]
Lesson 8.8 of the Angular tutorial — what actually triggers change detection in a zoneless, OnPush app, how to profile it, and an 8-point ch…
Angular Memory Leaks: Find and Fix Them With Heap Snapshots [2026]
Lesson 8.7 of the Angular tutorial — a practical memory-leak playbook: symptoms, a heap-snapshot comparison workflow, retainer paths, leaks …
Core Web Vitals for Angular SPAs: LCP, INP and CLS Fixes [2026]
Lesson 8.6 of the Angular tutorial — Core Web Vitals for single-page apps: LCP, INP and CLS thresholds, lab vs field data, SPA pitfalls, rea…
Angular Bundle Analysis and Tree-Shaking: Ship Less JavaScript [2026]
Lesson 8.5 of the Angular tutorial — read the build output, map the bundle with --stats-json and source-map-explorer, fix tree-shaking block…
Angular NgOptimizedImage: Faster LCP With One Directive [2026]
Lesson 8.4 of the Angular tutorial — NgOptimizedImage end to end: priority for the LCP image, width/height against layout shift, responsive …
Angular @for and track Explained: Stop Recreating the DOM [2026]
Lesson 8.3 of the Angular tutorial — what @for track really controls, why track item and track $index cause flicker and lost state, choosing…
Angular OnPush Deep Dive: How Change Detection Really Walks the Tree [2026]
Lesson 8.2 of the Angular tutorial — how OnPush change detection really works: dirty marking, markForCheck vs signal-targeted refresh, ngDoC…
Angular 22 OnPush by Default: What Changed and How to Migrate [2026]
Lesson 8.1 of the Angular tutorial — Angular 22 makes OnPush the default and renames Default to Eager. What triggers an OnPush check, why co…
AI-Assisted Angular Development: A Workflow That Works [2026]
Lesson 12.5 of the Angular tutorial — an end-to-end AI-assisted Angular workflow from ticket to pull request: ground, plan, change in slices…
Extend the Angular MCP Server with a Companion MCP Server [2026]
Lesson 12.4 of the Angular tutorial — ng mcp has no plugin API, so build a small companion MCP server with project-specific tools (unused co…
Angular MCP Server vs Generic MCP Servers: What Each One Knows [2026]
Lesson 12.3 of the Angular tutorial — a tool-by-tool tour of the Angular CLI MCP server, compared with filesystem, GitHub and documentation …
Set Up the Angular MCP Server in Claude, Cursor and VS Code [2026]
Lesson 12.2 of the Angular tutorial — connect the Angular CLI MCP server (ng mcp) to Claude Code, Claude Desktop, Cursor and VS Code, choose…
Angular takeUntilDestroyed() and DestroyRef: Modern Cleanup [2026]
Lesson 7.4 of the Angular tutorial — DestroyRef and takeUntilDestroyed(): tie every subscription, listener and timer to the right lifetime, …
Angular RxJS & Signal Interop: toSignal, toObservable, and rxResource [2026]
Lesson 7.3 of the Angular tutorial — how toSignal(), toObservable(), and rxResource() really behave: subscription timing, cleanup, errors, c…
10 Years of Angular: From Angular 2 to Signals and Zoneless
Angular 2.0 shipped on 14 September 2016. Ten years and twenty majors later, Angular is signal-first and zoneless. A walk through the five e…
Angular v22 Is Here: Signal Forms Go Stable, Async Signals Land, Aria Ships [2026]
Angular v22 shipped — Signal Forms, Asynchronous Signals, and Angular Aria are all officially stable. Walk every meaningful change: template…
Angular RxJS in 2026: When Signals Aren’t Enough and Observables Win [2026]
Lesson 7.2 of the Angular tutorial — RxJS in 2026: when signals aren't enough, the 10 operators worth knowing, switchMap/mergeMap/concatMap/…
Angular Server-Sent Events and Streaming HTTP: Live Feeds Without WebSockets [2026]
Lesson 6.6 of the Angular tutorial — server-sent events and streaming HTTP: EventSource basics, named events, auth options, Fetch API stream…
Angular Caching Strategies with httpResource: Stale-While-Revalidate, Invalidation [2026]
Lesson 6.5 of the Angular tutorial — caching strategies: shareReplay, per-key memoization, TTL, stale-while-revalidate, cache invalidation p…
Angular HTTP Error Handling and Retry: Patterns for Resilient Apps [2026]
Lesson 6.4 of the Angular tutorial — HTTP error handling and retry: interceptor normalization, global ErrorHandler, per-resource UI, exponen…
Angular httpResource vs resource: Signal-Shaped Async with Auto-Cancellation [2026]
Lesson 6.3 of the Angular tutorial — httpResource and resource: signal-shaped async with auto-cancellation, loading/error states, manual rel…
Angular Functional Interceptors: Auth Headers, Retry, Logging, Error Normalization [2026]
Lesson 6.2 of the Angular tutorial — functional interceptors: HttpInterceptorFn, auth headers, retries, logging, error normalization, token …
Angular HttpClient Fundamentals: get, post, params, headers, observe Options [2026]
Lesson 6.1 of the Angular tutorial — HttpClient fundamentals: setup with provideHttpClient (Fetch is the v22 default), every HTTP verb, para…
Angular Lazy Loading and @defer: Route-Level and Template-Level Code Splitting [2026]
Lesson 5.6 of the Angular tutorial — lazy loading: route-level (loadComponent, loadChildren), template-level (@defer with on viewport/idle/i…
Angular Route Resolvers and Prefetching: Pre-Load Data Before the Route Activates [2026]
Lesson 5.5 of the Angular tutorial — route resolvers and prefetching: ResolveFn, withComponentInputBinding, multiple resolvers in parallel, …
Angular Router Events: Loading Bars, Scroll Restoration, Analytics in 2026 [2026]
Lesson 5.4 of the Angular tutorial — router events: the 13 navigation events, building loading bars, page-view analytics, scroll restoration…
Angular File Uploads and Progress: Drag-Drop, Multipart, HttpClient Events [2026]
Lesson 4.5 of the Angular tutorial — file uploads: , FormData, HttpClient with reportProgress, multi-file uploaders, drag-drop, client-side …
Angular Complete Route Configuration: Every Route Property Explained [2026]
Lesson 5.2 of the Angular tutorial — complete route configuration: every Route property (path, pathMatch, children, outlet, data, resolve, c…
Angular Functional Route Guards: CanActivateFn, CanDeactivateFn, CanMatchFn, ResolveFn [2026]
Lesson 5.3 of the Angular tutorial — functional route guards: CanActivateFn, CanActivateChildFn, CanDeactivateFn, CanMatchFn, ResolveFn — pa…
Angular Router Essentials: routerLink, RouterOutlet, Params, Query Params [2026]
Lesson 5.1 of the Angular tutorial — router essentials: routes config, RouterOutlet, RouterLink, RouterLinkActive, path/query params, withCo…
Angular Typed Reactive Forms: FormGroup<T>, NonNullableFormBuilder, Strict Mode [2026]
Lesson 4.6 of the Angular tutorial — typed reactive forms: FormGroup typed mode, NonNullableFormBuilder, getRawValue, typed setValue/patchVa…
Angular Template-Driven Forms Cheatsheet: When ngModel Is Still the Right Tool [2026]
Lesson 4.3 of the Angular tutorial — template-driven forms cheatsheet: when ngModel is still the right tool (prototypes, tiny internal forms…
Angular Form Validation Deep Dive: Built-in, Custom, Async, Cross-Field [2026]
Lesson 4.4 of the Angular tutorial — form validation deep dive: built-in validators, custom sync, async (debounced), cross-field, error disp…
Angular Reactive Forms: When They’re Still the Right Tool in 2026 [2026]
Lesson 4.2 of the Angular tutorial — Reactive Forms in 2026: when still relevant (legacy, RxJS orchestration, third-party libs, dynamic form…
Angular Signal Forms Explained: The 2026 Forms API Replacing valueChanges + takeUntil [2026]
Lesson 4.1 of the Angular tutorial — signal forms (Angular 22): the form() API, the FormField directive, validators, async validation, field…
Angular linkedSignal: Writable State That Resets When Its Source Changes [2026]
Lesson 3.8 of the Angular tutorial — linkedSignal(): writable derived state that auto-resets when its source changes. Patterns: form default…
Angular Signal vs Observable: The 2026 Decision Tree for Reactive Primitives [2026]
Lesson 3.7 of the Angular tutorial — the signal-vs-observable decision tree: comparison table, when each is the right primitive, resource() …
Angular Zoneless Change Detection Internals: What Triggers a Render in 2026 [2026]
Lesson 3.6 of the Angular tutorial — zoneless change detection internals: five triggers, dirty marking, LView tree, signal-driven CD, async …
Angular Zoneless: What Changes Now That Zone.js Is Gone [2026]
Lesson 3.5 of the Angular tutorial — zoneless as default (v21+): what Zone.js did, what triggers change detection now, migration patterns, p…
Angular 22 debounced() Signals: Native Rate Limiting Without RxJS [2026]
Lesson 3.4 of the Angular tutorial — the experimental debounced() helper (Angular 22): it returns a Resource, supports custom wait functions…
Angular model(): The Two-Way Binding Primitive, Desugared [2026]
Lesson 3.3 of the Angular tutorial — model() signal: the two-way binding primitive, [(prop)] desugaring, when to use vs input()+output(), re…
Angular effect() vs computed(): When Each Fires, Cleanup, untracked() [2026]
Lesson 3.2 of the Angular tutorial — effect() vs computed() deep dive: timing rules, eager vs lazy, cleanup, signal writes inside effects, c…
Angular Signals: The Producer/Consumer Graph and Glitch-Free Reactivity [2026]
Lesson 3.1 of the Angular tutorial — signals primer: signal/computed/effect, producer-consumer graph, automatic dependency tracking, lazines…
Angular Programmatic Component Creation: ViewContainerRef.createComponent() for Modals, Toasts, Plugins [2026]
Lesson 2.14 of the Angular tutorial — programmatic component creation: ViewContainerRef.createComponent(), setInput, dynamic component selec…
Angular Signal Queries: viewChild, contentChild, viewChildren, contentChildren [2026]
Lesson 2.13 of the Angular tutorial — signal queries: viewChild, viewChildren, contentChild, contentChildren. Required option, read option, …
Angular Host Elements & host: Metadata: Binding to the Wrapping Element [2026]
Lesson 2.12 of the Angular tutorial — host elements: the host: metadata block, static vs dynamic bindings, event listeners, window/document …
Angular Selectorless Components (Preview): Import Classes Directly into Templates [2026]
Lesson 2.3 of the Angular tutorial — a preview of selectorless components: drop the selector, use classes directly, no imports array. In v22…
Angular Content Projection: <ng-content>, Multi-Slot, select, ngProjectAs [2026]
Lesson 2.6 of the Angular tutorial — content projection: , multi-slot select, ngProjectAs, default fallback content, scope rules (parent vs …
Angular Styling and ViewEncapsulation: Emulated, ShadowDom, None, :host, ::ng-deep [2026]
Lesson 2.11 of the Angular tutorial — styling and ViewEncapsulation: Emulated/ShadowDom/None modes, :host and :host-context() selectors, dep…
Angular ng-template and ng-container: Template Fragments, Logical Grouping, ngTemplateOutlet [2026]
Lesson 2.10 of the Angular tutorial — ng-template and ng-container: deferred templates, ngTemplateOutlet, template context, when each is the…
Angular Directives: Attribute, Structural, Custom — Everything You Need [2026]
Lesson 2.9 of the Angular tutorial — directives: the three kinds (component, attribute, structural), built-in NgClass/NgStyle/NgModel, custo…
Angular Pipes: Every Built-in Pipe, Custom Pipes, and Pure vs Impure [2026]
Lesson 2.8 of the Angular tutorial — pipes: every built-in pipe, syntax, arguments, chaining, the async pipe, writing custom pipes, pure vs …
Angular Component Lifecycle Hooks in 2026: Every Hook, effect(), and afterNextRender [2026]
Lesson 2.7 of the Angular tutorial — component lifecycle hooks in 2026: every hook in firing order, modern replacements (effect, afterNextRe…
Angular Output Signals: output(), Event Payloads, and When to Still Use EventEmitter [2026]
Lesson 2.5 of the Angular tutorial — output() signals: the new emitter API, payload types, aliases for two-way binding, RxJS interop via out…
Angular Input Signals Explained: input(), input.required(), Transforms, Aliases [2026]
Lesson 2.4 of the Angular tutorial — input() signals: required vs optional, transforms (booleanAttribute, numberAttribute, custom), aliases,…
Angular Template Syntax Deep Dive: @if @for @switch @let, Bindings, Two-Way [2026]
Lesson 2.2 of the Angular tutorial — every template syntax: interpolation, property/attribute/event/two-way binding, the @if @for @switch @l…
Angular Component Anatomy: @Component, Template, Selector, and Standalone Imports [2026]
Lesson 2.1 of the Angular tutorial — the anatomy of a component: @Component metadata, selector flavors, the imports array, inline vs externa…
The Angular Build Pipeline: esbuild, Vite, AOT, and What ng build Actually Does [2026]
Lesson 1.5 of the Angular tutorial — the build pipeline: what ng build does step by step, esbuild as the bundler, Vite for dev, AOT compilat…
TypeScript Essentials for Angular: Decorators, Generics, Strict Mode, and Template Narrowing [2026]
Lesson 1.4 of the Angular tutorial — the TypeScript slice you actually use every day: decorators, generics for signals and inputs, types vs …
Angular DI Deep Dive: InjectionToken, @Optional, Multi-Providers, and the Resolution Algorithm [2026]
Lesson 1.7 of the Angular tutorial — DI deep dive: InjectionToken, the optional/self/skipSelf/host modifiers, multi-providers, useFactory, t…
Angular Dependency Injection Explained: inject(), Providers, and the Root Injector [2026]
Lesson 1.3 of the Angular tutorial — dependency injection from the consumer side: the inject() function, injection contexts, the hierarchica…
Angular Bootstrap and ApplicationConfig: The provideX() Ecosystem [2026]
Lesson 1.6 of the Angular tutorial — bootstrapApplication(), ApplicationConfig, and the full provideX() ecosystem: provideRouter, provideHtt…
Angular CLI and Project Structure: Every File ng new Creates [2026]
Lesson 1.2 of the Angular tutorial — install the CLI, run ng new, and walk every file the scaffold creates: main.ts, app.config.ts, angular.…
What is Angular and Where it Fits: A 2026 Developer’s Guide
Lesson 1.1 of the Angular tutorial — what Angular actually is (a framework, not a library), what ships in the box, where it sits next to Rea…
Angular MCP Server (ng mcp): What It Actually Does and Why It Matters
A practical introduction to Angular's official MCP server (ng mcp) built into the Angular CLI: what tools it exposes in v22, what flags matt…
Optimizing User Input Handling in Angular: Implementing Debouncing with switchMap
Link copied Optimizing User Input Handling in Angular: Implementing Debouncing with switchMap Angular Tutorial › Module 7: RxJS › Lesson 7.1…
Understanding Unit Testing in Angular: Mocked Service API Calls and Component Rendering
Link copied Understanding Unit Testing in Angular: Mocked Service API Calls and Component Rendering In the realm of Angular development, uni…
Exploring Angular 18: What’s New and Exciting
Link copied Exploring Angular 18: What’s New and Exciting Angular 18 Features # Angular 18 was released on May 22nd, marking a significant m…
Angular’s ng-container and ng-template
Link copied Angular’s ng-container and ng-template Related: For the modern version with @if/@for and ngTemplateOutlet context, see Angular n…
Unicasting vs Multicasting Observables: A Deep Dive into RxJS Techniques
Link copied Unicasting vs Multicasting Observables: A Deep Dive into RxJS Techniques In the world of reactive programming, particularly when…
When Angular is launched ?
Link copied When Angular is launched ? When was Angular launched? # AngularJS, the original framework, was first released in 2010. Angular (…