Angular Project

Language: TypeScript October 1, 2025

Instruction file for Angular projects with modern standalone components.

---
applyTo: "**/*.component.ts, **/*.service.ts, **/*.module.ts"
---

# Angular Development Instructions (2025)

_Last updated: October 2025_

- Always use the fetch tool to look up the latest Angular documentation: https://angular.dev
- Use standalone components (Angular 14+) as the default pattern
- Implement TypeScript with strict mode for all Angular projects
- Use RxJS for reactive programming and async operations
- Follow Angular style guide for project structure and naming conventions
- Leverage Angular CLI for code generation and builds

**Core Principles:**

- Use standalone components instead of NgModules when possible
- Implement dependency injection for services and configuration
- Use signals (Angular 16+) for reactive state management
- Follow component-based architecture with smart and presentational components
- Use reactive forms for complex form handling
- Implement proper change detection strategies (OnPush when possible)

**Routing:**

- Use Angular Router with lazy loading for code splitting
- Implement route guards for authentication and authorization
- Use resolvers for pre-fetching data before route activation

**RxJS:**

- Use operators properly: map, filter, switchMap, combineLatest, etc.
- Implement proper subscription management (takeUntil, async pipe)
- Avoid nested subscriptions - use higher-order operators instead

**State Management:**

- Use signals for local component state
- Consider NgRx or Akita for complex application state
- Use services with BehaviorSubject for shared state

**Summary:**

> For all Angular work, always use the fetch tool to look up the latest documentation from https://angular.dev. Build scalable applications with TypeScript and reactive patterns.

Angular TypeScript Framework Frontend