Angular Conventions

Assumes Angular 17+; prefer v19/v20 idioms wherever the workspace version allows. The TypeScript/JavaScript language baseline (strict flags, type modeling, modules, async, error handling) lives in personal-typescript - load it alongside this skill; the rules below are Angular-specific only.

Angular component structure

• Standalone components by default (Angular 17+).
• File naming: feature-name.component.ts, feature-name.service.ts, feature-name.directive.ts, feature-name.pipe.ts. Type suffixes are a deliberate house convention kept against the v20 style-guide change - do not "modernize" them away.
• One concern per file. Component, template, and styles co-located in the same folder.
• Component selectors use kebab-case with project prefix: app-order-list, never bare order-list.
• Smart vs presentational split: container components handle data and state; presentational components are pure inputs/outputs.

State management

• Signals (signal, computed, effect) for local component state. Default choice in new code.
• RxJS only where streams genuinely add value: HTTP responses, user input streams, cross-component event flows. Do not wrap synchronous data in observables.
• Convert observables to signals at the component boundary with toSignal() when the consumer is template-only.
• Stores (NgRx, NGXS, or Signals-based store) only for state that genuinely crosses many components.