programming-react

What problem does it solve?

This Skill helps you design and implement React applications that stay maintainable as features and complexity grow, especially when state management, data fetching, and component boundaries start to blur.

Core Features & Use Cases

• Clear state boundaries: separate server state from client state, keep derived data computed during render, and avoid swallowing the app in global stores.
• React architecture best practices: establish component/composition rules, feature-first folder layout, and correct Server/Client Component usage for Next.js/React 19.
• Predictable hooks and data fetching: useEffect discipline, server-state libraries for caching and retries, and pragmatic patterns for forms, performance, and testing.
• Use case: you’re starting a new Next.js (App Router) project and want a robust baseline that avoids common pitfalls like overusing useEffect, prop drilling, and ad-hoc fetch+state patterns.

Quick Start

Activate the programming-react Skill while working in your React project and ask it to refactor your current state/data-fetching approach to match React and Next.js best practices.