What problem does it solve?
Inconsistent React and Next.js coding practices can lead to scattered patterns, reduced maintainability, and missed accessibility opportunities. This skill provides a disciplined set of conventions to unify component structure, performance considerations, and UI patterns across teams and projects.
Core Features & Use Cases
- Component Structure: enforce function components, explicit Props types, and explicit import type usage for React types.
- Performance & Quality: guidelines for server components, code-splitting, and minimizing unnecessary re-renders.
- Accessibility & UI: standardized keyboard navigation, ARIA practices, and consistent styling conventions.
- Use Case: during code reviews or refactors, apply these conventions to align with internal standards and improve long-term maintainability.
Quick Start
Audit a React component for explicit function definitions, typed props, and proper React import typing, then apply the recommended conventions across structure, performance, and accessibility.