•98 modules•Frontend

Angular Mastery Course

Angular is Google's framework for building web applications with TypeScript. Learn modern Angular the way it is written today: standalone components, signals, the built-in control flow, zoneless change detection, signal forms and server-side rendering. The course also covers the older patterns you will still meet in real codebases, from NgModules and decorator inputs to reactive forms and RxJS, so you can read and migrate existing projects with confidence.

Your Progress

Track your journey through the Angular course. Complete topics to increase your progress.

Course Completion0 of 98 topics

0/20

Beginner Done

0/42

Intermediate Done

0/25

Advanced Done

0/11

Expert Done

Hours Completed

Your Progress

Beginner Level

What is Angular? Architecture and Ecosystem

TypeScript Essentials for Angular

Angular CLI: Setup and Scaffolding

Project Structure and Configuration Files

Bootstrapping a Standalone Application

Naming Conventions and the Modern Style Guide

Standalone Components and Component Metadata

Templates and Interpolation

Property, Attribute and Class Bindings

Event Binding and Template Statements

Built-in Control Flow: @if, @for and @switch

Legacy Structural Directives: ngIf, ngFor and ngSwitch

Template Variables and @let

Component Styles and View Encapsulation

Signals: signal, computed and effect

Signal Inputs with input()

Outputs with output()

Two-way Binding with model()

Zoneless Change Detection

Built-in Pipes and Formatting

Intermediate Level

Content Projection with ng-content

ng-template, ng-container and TemplateRef

linkedSignal and Derived Writable State

Effects, Cleanup and untracked

Signal Queries: viewChild, viewChildren and contentChild

afterRenderEffect and Render Hooks

Component Lifecycle Hooks

Decorator Inputs and Outputs with EventEmitter

ViewChild and ContentChild Decorators

NgModules and the Legacy Architecture

Migrating from NgModules to Standalone

Dependency Injection and inject()

Constructor Injection and Decorator Modifiers

Providers, Injection Tokens and Scopes

Services and Shared State

Attribute Directives

Structural Directives and Custom Templates

NgClass, NgStyle and Dynamic Styling

Custom Pipes: Pure and Impure

Host Bindings and the host Metadata

Router Setup and Route Configuration

RouterLink, RouterLinkActive and Navigation

Route Parameters and Query Parameters

Nested Routes and Child Outlets

Lazy Loading with loadComponent and loadChildren

Functional Guards and Resolvers

Class-based Guards and Legacy Router Patterns

HttpClient with provideHttpClient

Observables and the async Pipe

Functional HTTP Interceptors

Class-based Interceptors and Migration

Reactive Data Fetching with httpResource

Async Signals: resource and rxResource

HTTP Error Handling and Retries

Signal Forms: form, FormField and Schemas

Signal Forms Validation

Signal Forms: Dynamic and Nested Fields

Custom Controls for Signal Forms

Reactive Forms

Reactive Forms Validation and FormArray

Template-driven Forms

Choosing Between Signal Forms and Reactive Forms

Advanced Level

Custom Form Controls with ControlValueAccessor

RxJS Essentials for Angular

Subjects, Multicasting and Sharing

Signals and RxJS Interop: toSignal and toObservable

NgRx SignalStore

NgRx Store, Effects and Entity

Deferrable Views with @defer

Change Detection Strategies and OnPush

Zone.js and How Change Detection Used to Work

Image Optimisation with NgOptimizedImage

Bundle Analysis and Build Budgets

Server-Side Rendering with Angular SSR

Hydration and Event Replay

Incremental Hydration