Angular Study Notes

Anatomy of a Component

A close look at the parts that make up an Angular component — the decorator metadata, class body, template, and styles — and how they fit together.

Angular Interview Questions

A curated set of commonly asked Angular interview questions covering components, change detection, signals, DI, RxJS, and routing, with concise, accurate answe…

Angular Project Structure

A guided tour of the files and folders the Angular CLI generates, and the conventions that keep large Angular codebases navigable.

Angular Quick Reference

A condensed cheat sheet of core Angular syntax—control flow, signals, decorators, CLI commands, and DI patterns—for fast lookup while coding.

Angular Router Basics

Learn how Angular's built-in router maps URL paths to components, enabling single-page applications to feel like multi-page sites without full page reloads.

Building and Deploying an Angular App

Learn how ng build produces an optimized production bundle, what build configurations and budgets control, and common strategies for deploying an Angular app t…

Change Detection and Zone.js

Understand how Angular detects and applies UI updates via Zone.js, how the change detection tree works, and how zoneless change detection with signals changes…

Common Angular Pitfalls

A practical rundown of mistakes Angular developers repeatedly make—memory leaks, signal misuse, change detection surprises, and DI scoping errors—and how to av…

computed() and effect()

Learn how computed() derives memoized reactive values from signals, and how effect() runs side effects automatically whenever the signals it reads change.

Content Projection with ng-content

Learn how ng-content lets components accept and render externally-provided markup, enabling flexible, composable UI patterns like cards, modals, and layouts.

Creating and Injecting Services

Learn how to define an Angular service class, register it with Angular's dependency injection system, and inject it into components and other services.

Dynamic and Nested Form Groups

Build complex forms by nesting FormGroups and using FormArray to add, remove, and validate repeating or conditional sets of controls at runtime.

Form Validation and Custom Validators

Learn how Angular validates reactive forms with built-in validators, synchronous and asynchronous custom validators, and cross-field validation strategies.

Handling Loading and Error States

Learn patterns for representing loading, success, and error states in Angular components using signals and RxJS so templates always reflect the true request st…

Hierarchical Dependency Injection

Understand how Angular's injectors form a tree mirroring the component hierarchy, how token resolution walks up that tree, and how to scope service instances d…

HTTP Interceptors

Understand how Angular's functional HTTP interceptors let you centrally attach headers, log requests, and handle errors for every outgoing request.

HttpClient and Fetching Data

Learn how Angular's HttpClient issues typed, Observable-based HTTP requests, and how to provide it in a standalone application.

Input and Output Decorators

Understand how @Input() and @Output() enable parent-child component communication in Angular, including binding syntax, EventEmitter, and input transforms.

Introduction to Signals

Understand Angular Signals — the reactive primitive that wraps a value and notifies dependents on change, forming the foundation of Angular's modern change-det…

Lazy Loading Feature Routes

Discover how to split an Angular application into smaller JavaScript bundles that load on demand as users navigate, dramatically improving initial load perform…

Property and Event Binding

How Angular's square-bracket property binding and parenthesis event binding connect component state and DOM events to your template.

Reactive Forms Basics

Learn Angular's reactive forms approach, where the form model is constructed explicitly in TypeScript with FormControl, FormGroup, and FormBuilder for more pre…

Route Guards

Learn how functional route guards control navigation access — protecting routes behind authentication, confirming unsaved changes, and pre-fetching data before…

Route Parameters and Query Params

Understand how to pass dynamic data through the URL using required route parameters and optional query parameters, and how to read them reactively in a compone…