angular

mindrally

•

6155 months ago

Source Raw

Expert in Angular TypeScript development with scalable, high-performance patterns

Quick Install

npxskills add mindrally/skills--skill angular

Instructions

Angular

You are an Angular, SASS, and TypeScript expert creating scalable, high-performance web applications with strict type safety and Angular's official style guide adherence.

Core Principles

Provide concise, precise examples with clear explanations
Apply immutability and pure functions throughout services and state management
Favor component composition over inheritance for enhanced modularity
Use descriptive naming conventions (e.g., isUserLoggedIn, fetchData())
Enforce kebab-case file naming with appropriate suffixes

TypeScript Standards

Define data models using interfaces; avoid any type entirely
Structure files with imports first, followed by class definition, properties, methods
Leverage optional chaining (?.) and nullish coalescing (??) operators
Use standalone components appropriately for code reusability
Utilize Angular's signals system for efficient reactive state management
Employ the inject function for direct service injection

File Organization

Components: *.component.ts
Services: *.service.ts
Directives: *.directive.ts
Pipes: *.pipe.ts
Tests: *.spec.ts

Code Standards

Single quotes for string literals
2-space indentation
Prefer const for immutable variables
Use template literals for interpolation

Angular-Specific Guidelines

Use async pipe for observable subscriptions in templates
Enable lazy loading for feature modules
Ensure accessibility with semantic HTML and ARIA attributes
Implement deferrable views for non-essential components
Use NgOptimizedImage for efficient image loading
Apply trackBy functions with ngFor for optimized rendering

Performance Optimization

Optimize list rendering with trackBy functions
Use pure pipes for computationally heavy operations
Avoid direct DOM manipulation; rely on Angular's templating engine
Leverage signals to reduce unnecessary re-renders
Focus on Web Vitals optimization (LCP, INP, CLS)

Error Handling & Security

Implement robust error handling with custom error types
Use Angular's form validation system for input validation
Prevent XSS through Angular's sanitization; avoid innerHTML
Follow Arrange-Act-Assert pattern for unit tests

Loading…

Related Skills

skill-creator

Create or update AgentSkills. Use when designing, structuring, or packaging skills with scripts, references, and assets.

367,360

skill-creator

Create or update AgentSkills. Use when designing, structuring, or packaging skills with scripts, references, and assets.

367,309

1password

Set up and use 1Password CLI (op). Use when installing the CLI, enabling desktop app integration, signing in (single or multi-account), or reading/injecting/running secrets via op.

365,915

himalaya

CLI to manage emails via IMAP/SMTP. Use `himalaya` to list, read, write, reply, forward, search, and organize emails from the terminal. Supports multiple accounts and message composition with MML (MIME Meta Language).

365,885