Application State in Angular

Application State is a chapter of the free Angular tutorial. State is the data your app stores at a moment in time, such as the cart items, the signed-in user or the selected tab. When many screens show the same data, you must decide where it is stored and how it changes, so every screen stays correct.

What each lesson covers:

• Angular Signals: Creating writable signals, reading them with (), changing them with set() and update(), calculating values with computed(), running code on changes with effect(), and when to use signals or RxJS.
• State Management: Component state and shared state, storing state in a service with a BehaviorSubject or with signals, common state patterns, and an overview of NgRx with its store, actions, reducers and selectors.

Every practice block runs real Angular in your browser, in TypeScript or JavaScript. Click the buttons in the output to change the state and see every component update. The exercises check what your page displays after you change the code, so any correct answer passes.

Lessons in this section

1. Angular Signals

   Storing and updating values with signals: writable signals, reading and updating values, computed signals, effects, signals compared with RxJS, and best practices.

2. State Management

   Where to store app data: component state, shared state in services, BehaviorSubject and signal-based state, common patterns, and an overview of NgRx store, actions, reducers and selectors.