Free to read ยท Three levels

Angular: reactive components and reliable application boundaries

A complete theory-led course from standalone components and signals to routing, forms, HTTP, lifecycle, testing, architecture, and release safety.

18 lessonsEnglish + ArabicContent reviewed
Start learning

In this course

Eighteen substantial bilingual lessons explain Angular through original local computations, contextual framework examples, troubleshooting records, and worked exercises. The course separates TypeScript checks, template syntax, Angular execution, browser interaction, and deployment evidence.

The pinned verification baseline is Angular 20.3.0, TypeScript 5.9.3, RxJS 7.8.2, and Node.js 22.23.3. Complete local programs use isolated official packages and no real services. Application, browser-runner, routing, HTTP, SSR, and hosting fragments are marked non-runnable with explicit expected observations.

What you will learn

  • Design standalone components with explicit inputs, outputs, signals, and forms.
  • Coordinate route and HTTP data with validation, scope, and cleanup.
  • Test behavior and accessibility at the appropriate verification layer.
  • Review performance, security, SSR, and release assumptions without overstating guarantees.

Your learning path

Three levels

Basic

Build a component model with explicit bindings, signals, identity, composition, and form semantics.

  1. Toolchain and the component model
  2. Templates, binding, and events
  3. Signals and derived state
  4. Control flow and list identity
  5. Inputs, outputs, and composition
  6. Forms and accessible interaction
Explore this level

Intermediate

Coordinate dependency scope, routing, HTTP, streams, lifecycle, and isolated interaction tests.

  1. Dependency injection and service scope
  2. Router navigation and route data
  3. HTTP and runtime validation
  4. RxJS and signal interoperability
  5. Lifecycle and resource cleanup
  6. Component testing and accessibility
Explore this level

Advanced

Design feature ownership, measured rendering, deferred delivery, secure boundaries, and coherent releases.

  1. Feature state and architecture
  2. Rendering performance and OnPush
  3. Deferred loading and route boundaries
  4. Security and trust boundaries
  5. Server rendering and hydration boundaries
  6. Build, deployment, and upgrade strategy
Explore this level

Who this is for

  • Developers with basic TypeScript, HTML, and browser knowledge.
  • Self-study learners building reliable component, state, and service contracts.

Before you start

  • Basic TypeScript functions, objects, unions, promises, and HTML semantics.
  • A compatible local toolchain; complete framework and browser fixtures require their declared application setup.

Related technical solutions

Resolve NG8002 for a standalone form bindingFind the actual template owner and import the directive that implements the binding instead of suppressing an unknown-property error with a broad schema.Resolve NG0203 outside an injection contextIdentify where inject is called, capture the dependency during a supported context, and keep injector lifetime separate from asynchronous callback timing.Repair stale views after object-signal mutationDistinguish value mutation from signal notification, replace changed state coherently, and verify derivations before blaming OnPush or adding manual detection.