What version of Angular does this skill target?

This skill is specifically designed for Angular 20 and 21+, focusing on modern features like standalone components by default and signal-based reactivity.

How does it handle CSS and styling?

It implements a Tailwind CSS workflow, utilizing the @apply directive for composite styles and supporting dark mode via .dark: variants.

Does it support traditional Angular decorators?

No, the skill prioritizes modern signal-based functions like input() and output() over legacy decorators to ensure forward compatibility and better performance.

Are accessibility standards included in the code generation?

Yes, all components generated or reviewed by this skill must meet WCAG AA standards and pass AXE accessibility checks.

Can I use this for state management?

Yes, it provides patterns for local and global state management using Angular's signal(), computed(), and effect() primitives.

Modern Angular 21 Patterns

Name: Modern Angular 21 Patterns
Author: alysson-souza

byalysson-souza

デザインツール

Implements cutting-edge Angular 21 development standards focusing on signals, modern control flow, and accessible UI patterns.

概要

This skill provides a comprehensive framework for developing with the latest features of Angular 21. It guides the creation and review of components, services, and templates by enforcing signal-based APIs over legacy decorators, utilizing the modern '@' control flow syntax, and integrating Tailwind CSS for styling. By prioritizing ChangeDetectionStrategy.OnPush and WCAG AA accessibility standards, it ensures that your Angular applications are high-performance, maintainable, and inclusive.

主な機能

0 GitHub stars
Signal-based component architecture using input(), output(), and viewChild()
Performance optimization via OnPush change detection and signal-based state management
Modern control flow implementation using @if, @for, and @switch syntax
Accessibility-first development meeting WCAG AA and AXE check standards
Tailwind CSS integration with dark mode support and @apply directives

ユースケース

Refactoring legacy Angular components to use modern signal-based patterns and standalone architecture
Generating performant and accessible UI components with Tailwind CSS and Angular 21 syntax
Conducting code reviews to ensure adherence to Angular 21 best practices and optimized testing patterns

概要

主な機能

0 GitHub stars
Signal-based component architecture using input(), output(), and viewChild()
Performance optimization via OnPush change detection and signal-based state management
Modern control flow implementation using @if, @for, and @switch syntax
Accessibility-first development meeting WCAG AA and AXE check standards
Tailwind CSS integration with dark mode support and @apply directives

ユースケース

Refactoring legacy Angular components to use modern signal-based patterns and standalone architecture
Generating performant and accessible UI components with Tailwind CSS and Angular 21 syntax
Conducting code reviews to ensure adherence to Angular 21 best practices and optimized testing patterns