frontend-architecture - Organize React frontends with modular architecture
Defines a portable architecture for React and React Native apps using feature modules, page directories, separated state origins, barrel-only imports, and co-located styles.
Tags
Updated: 2026-10-16Capabilities
Typical Inputs
Typical Outputs
What this skill does
- Organize feature modules
- Structure page directories
- Separate server and UI state
- Enforce barrel-only imports
- Co-locate page styles
- Promote shared components gradually
Inputs
- React or React Native codebase
- Routing layer
- State management choices
- Styling stack
Outputs
- Feature-module directory structure
- Public module barrel APIs
- Separated server and UI state
- Co-located page files
- Documented module boundaries
Requirements
- React or React Native project