React Design Principles

Use this skill for higher-level React API decisions: when to extract an abstraction, whether an API is declarative enough, or whether a helper fights React's model.

If the task becomes a specific custom hook implementation or review, pair this with react-hook-writing or react-hook-review.

1. Prefer Declarative Interfaces

React works best when APIs describe desired state, not orchestration steps.

• Prefer abstractions that remove repeated state + effect coordination from components.
• If consumers must manually wire many states, handlers, and effects every time, the abstraction is probably too low-level.
• Favor APIs that read like intent, not procedure.

2. Respect React's Lifecycle

Do not introduce abstractions that fight React's lifecycle model.