skills.rest
Axel-DaMage
Axel-DaMageCOMMUNITY
Explore all skills by this author →
GitHub

angular-architect

Generate Angular 17+ standalone components with routing, NgRx, and RxJS.

2|Updated Jun 29, 2026
Search Tags:#typescript#state management#angular#performance optimization#rxjs#ngrx
One-click install
npx skills add https://github.com/Axel-DaMage/opencode-config --skill angular-architect-axel-damage
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: angular-architect
Source: https://github.com/Axel-DaMage/opencode-config/tree/main/skills/angular-architect
Command: npx skills add https://github.com/Axel-DaMage/opencode-config --skill angular-architect-axel-damage

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @angular/core, @ngrx/store, @ngrx/effects, rxjs, typescript, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill addresses the complexities of building Angular applications, providing tools for component generation, state management, performance tuning, and testing.

Core Features & Use Cases

  • Component Generation: Automatically generates Angular 17+ standalone components.
  • Advanced Routing: Configures advanced routing with lazy loading and guards.
  • State Management: Implements NgRx state management for complex applications.
  • Performance Optimization: Applies RxJS patterns and best practices for optimal performance.
  • Testing: Facilitates Angular testing for enterprise-grade applications.
  • Use Case: For a new Angular project, this Skill can be used to set up the initial component structure, configure the routing, manage the state with NgRx, and ensure performance and test coverage are in place from the start.

Quick Start

Use the angular-architect skill to generate a new Angular component with the following properties: name="UserCard", input="firstName: string, lastName: string".

Frequently Asked Questions about angular-architect

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up NgRx state management in an Angular 17 standalone application?▼

To set up NgRx state management in Angular 17, this Skill generates standalone components and configures the store and effects, providing a structured state management setup for complex enterprise applications.

What's the best way to configure lazy loading and guards for Angular routing?▼

The best way to configure lazy loading and guards is through this Skill, which automatically sets up advanced Angular routing configurations to optimize bundle performance and secure component access.

Can I generate Angular 17 standalone components with predefined TypeScript inputs?▼

Yes, you can generate Angular 17 standalone components with predefined TypeScript inputs. The Skill accepts parameters like component name and input properties to scaffold the structure automatically.

Does this Skill apply RxJS patterns for Angular performance optimization?▼

Yes, this Skill applies RxJS patterns and best practices to optimize bundle performance in Angular applications, ensuring efficient reactive programming and data flow management.

Do I need TypeScript and RxJS to build enterprise Angular applications with this Skill?▼

Yes, you need TypeScript and RxJS. The Skill requires Angular, NgRx, RxJS, and TypeScript environments to generate components, manage state, and tune performance effectively.

How do I ensure test coverage when generating Angular components and state management setups?▼

This Skill facilitates Angular testing for enterprise-grade applications by integrating testing configurations during component generation and state management setup, ensuring test coverage is in place.

Related Skills

Explore More Software Engineering Skills→
shalevaminshalevamin

angular-architect

Generate Angular 17+ standalone components with NgRx state management and routing.

Community
Advanced
fanguyunfanguyun

angular-architect

Generate Angular 17+ standalone components with routing, NgRx, and RxJS.

Community
Advanced
dylantarredylantarre
38

angular

Build token-driven Angular components with signals and standalone components.

Community
Advanced
yuma588yuma588
2

frontend-frameworks

Scaffold projects and generate components for React, Vue, Angular, and Svelte.

Community
Advanced