What problem does it solve? React codebases often grow into tangled structures where features are scattered across generic folders, imports create hidden coupling, and the app shell becomes an unmaintainable nest of providers. This Skill provides architectural guidance for designing or reviewing a React application's structure so ownership and dependency direction stay clear as the codebase evolves. ## Core Features & Use Cases - Application infrastructure design: Guidance for startup, app shell, providers, routing, configuration validation, authentication bootstrap, API adapters, code splitting, and deployment assumptions. - Feature structure and boundaries: Rules for organizing product code by ownership, exposing narrow public entrypoints, enforcing import direction, and sharing code deliberately. - Incremental migration planning: Proposes a target structure and a step-by-step migration path that keeps the application runnable without simultaneous moves and behavior changes. - Use Case: When joining a React project where components, hooks, and services are scattered across top-level folders, use this Skill to map the current structure, define feature boundaries with public APIs, and plan a safe reorganization. ## Quick Start Use the react-architecture skill to review my React app's folder structure and propose a feature-based organization with clear dependency rules.
