03-ENRICH-architecture

What problem does it solve?

This Skill provides a comprehensive set of frontend architecture standards and conventions to ensure consistency, maintainability, and scalability in domain-based modular projects.

Core Features & Use Cases

• Project Structure Guidance: Defines the ideal directory layout for domains, components, hooks, and services.
• Naming Conventions: Establishes clear naming rules for files, folders, components, and hooks.
• Domain Management: Outlines how to structure self-contained feature modules with domain.json and priority-based boundaries.
• Service & Hook Patterns: Details best practices for data access layers and React hook implementation, including TanStack Query usage.
• Component Hierarchy: Enforces Atomic Design principles for UI components (atoms, molecules, organisms, templates).
• RTL, Accessibility, Performance: Provides strict guidelines for internationalization, user experience, and code optimization.
• Use Case: When starting a new feature, use this skill to ensure the code adheres to established architectural patterns, promoting team collaboration and reducing technical debt.

Quick Start

Use the 03-ENRICH-architecture skill to define the project structure and naming conventions for the new 'user-profile' domain.