frontend-patterns

Boundary

This skill provides frontend development patterns for React, Next.js, state management, performance optimization, and UI best practices. It focuses on component patterns, custom hooks, state management, and performance optimization. It does NOT cover backend development, database design, or deployment (those have dedicated skills).

When to use

Use this skill when:

• Building React components with proper composition patterns
• Implementing state management (useState, useReducer, Zustand, Context)
• Creating custom hooks for reusable logic
• Optimizing performance (memoization, virtualization, code splitting)
• Working with forms (validation, controlled inputs, Zod schemas)
• Implementing accessibility patterns (keyboard navigation, focus management)
• Adding animations (Framer Motion, CSS transitions)