Hooks as behavior reuse

Custom hooks extract stateful behavior—data fetching, subscriptions, form logic, media queries—while components focus on rendering. Rules of Hooks require consistent call order and clear ownership of effects and cleanup. Good hooks expose a small return API and hide implementation details.

On interviews: refactor duplicated `useEffect` logic into a hook. Discuss dependency arrays, stale data, and testing with render hooks utilities.

Common pitfalls: hooks that fetch inside every consumer without deduplication; returning unstable objects causing rerenders; hiding side effects callers cannot predict.

The trade-off is flexibility versus complexity—know when the simpler path is enough.

Checklist:

• Hook name starts with `use` and follows Rules of Hooks.
• Effects clean up subscriptions and timers.
• Return stable references where possible.
• Document required providers or context dependencies.