React Architecture
Architecture decides long-term velocity. Strong boundaries keep apps understandable as teams and features grow.
Feature module structure
src/
features/
billing/
components/
hooks/
services/
model/
index.ts
State architecture
Define ownership by scope: component-local state, feature state, and server state each need distinct patterns.
Dependency boundaries
Keep domain logic framework-light and isolate I/O concerns from presentational components.
Scaling strategy
- Start with feature folders and clear import directions.
- Extract shared modules only when duplication is meaningful.
- Document boundaries and rationale as the codebase evolves.
Practice
Refactor a medium-size app into feature modules and define allowed dependency directions between layers.