angular-developer

An Angular development assistant that generates Angular code and provides architectural guidance across the framework's major areas. It is triggered when creating projects, components, or services, or when guidance is needed on reactivity (signals, linkedSignal, resource), forms, dependency injection, routing, server-side rendering, accessibility (ARIA), animations, styling (component styles, Tailwind CSS), testing, or CLI tooling. A foundational rule is to analyze the project's Angular version first, because best practices and available features vary significantly between versions, and to scaffold with the Angular CLI for consistency. After generating code it runs ng build and fixes any build errors before proceeding, treating the build as a non-skippable correctness check.

Project creation follows strict execution rules for ng new: if the user requests a specific version it uses npx @angular/cli@<version> new; otherwise it runs ng version to detect an existing install and uses ng new when one is found, falling back to npx @angular/cli@latest new when none exists. For new applications it prefers the latest stable Angular and Signals Forms (available in Angular v21 and newer), while older applications or existing forms keep whatever form strategy already matches the codebase.

The skill is organized around topic-specific reference files it consults on demand. Components coverage spans fundamentals and template control flow (@if, @for, @switch), signal-based inputs and outputs, and host elements; reactivity covers signal/computed, linkedSignal for dependent writable state, resource for async data, and effects (including when not to use them); forms compare signal, template-driven, and reactive approaches; dependency injection covers inject(), providers, injection context, and hierarchical injectors; and routing covers route definitions, lazy loading, outlets, guards, resolvers, lifecycle events, rendering strategies (CSR, SSG, SSR with hydration), and view-transition animations. Accessible headless components and Tailwind styling are also addressed, with links to angular.dev for deeper documentation.