Frontend Patterns

Conventions and best practices for building maintainable, performant React applications.

When to Activate

• Designing component structure or deciding where state should live
• Choosing between local state, Context, Zustand, or Redux Toolkit
• Implementing data fetching, caching, or server state synchronization
• Building forms with validation and submission handling
• Optimizing rendering performance (re-renders, bundle size, lazy loading)
• Setting up routing with protected routes or nested layouts
• Writing tests for React components and hooks

Component Design

Single Responsibility