dev-flow

← all skills

state-discipline

Apply React 19 / Next.js 16 state discipline — useState is the last resort, not the default: derive from props/URL/data, key to reset, useMountEffect for one-time external sync, never bare useEffect. Use when the user pastes useState + useEffect + fetch, reaches for useState to mirror a prop, hand-rolls a derived value via useEffect + setState, syncs state with URL via useEffect, or asks "should I add useState here?". Also owns the React 19 concurrent-state APIs — useTransition, useOptimistic, useActionState, <Activity> — including when described rather than named: keeping the UI responsive during a pending update, an optimistic UI, form action state, a hidden subtree that stays mounted. Refuses outside Next.js 16 App Router. Not for: server-data reads (use data-fetching), form field values (use forms), or React Native state patterns.

When it applies

References it ships

Get it

/plugin install dev-flow@dev-flow      # the whole suite
./install.sh --platform claude        # or drop dist/state-discipline.skill into Claude Code

Read state-discipline/SKILL.md on GitHub →