state-management
starsforks
How to install state-management?
girijashankarj/cursor-handbook/state-management
$npx -y skills add girijashankarj/cursor-handbook --skill state-managementWorkflow for choosing and implementing the right state management approach. Use when the user needs to manage state for a new feature or refactor.
SKILL.md
| 1 | # Skill: Set Up State Management |
| 2 | |
| 3 | ## Trigger |
| 4 | When the user needs to manage state for a new feature or refactor existing state. |
| 5 | |
| 6 | ## Steps |
| 7 | |
| 8 | ### Step 1: Analyze State Requirements |
| 9 | - [ ] What data needs to be managed? |
| 10 | - [ ] Is it UI state or server state? |
| 11 | - [ ] How many components need access? |
| 12 | - [ ] How often does it change? |
| 13 | - [ ] Does it need to persist? |
| 14 | |
| 15 | ### Step 2: Choose Approach |
| 16 | Use this decision tree: |
| 17 | 1. **Single component** → `useState` / `useReducer` |
| 18 | 2. **Parent + 1-2 children** → Lift state up |
| 19 | 3. **Many components, UI state** → Context / Zustand |
| 20 | 4. **Server data** → TanStack Query |
| 21 | 5. **Form data** → React Hook Form |
| 22 | 6. **Complex workflows** → XState |
| 23 | |
| 24 | ### Step 3: Implement Store/Hook |
| 25 | Based on the chosen approach, create: |
| 26 | - [ ] State types/interfaces |
| 27 | - [ ] Store definition or custom hook |
| 28 | - [ ] Actions/mutations |
| 29 | - [ ] Selectors for derived data |
| 30 | |
| 31 | ### Step 4: Connect Components |
| 32 | - [ ] Add provider (if using Context/Redux) |
| 33 | - [ ] Use hooks in components |
| 34 | - [ ] Implement loading states |
| 35 | - [ ] Implement error handling |
| 36 | - [ ] Handle empty states |
| 37 | |
| 38 | ### Step 5: Optimize Performance |
| 39 | - [ ] Memoize selectors |
| 40 | - [ ] Avoid unnecessary re-renders |
| 41 | - [ ] Keep state granular |
| 42 | - [ ] Use React.memo for pure components |
| 43 | |
| 44 | ### Step 6: Test |
| 45 | - [ ] Test store/hook in isolation |
| 46 | - [ ] Test components with mocked state |
| 47 | - [ ] Test state transitions |
| 48 | - [ ] Test error handling |
| 49 | |
| 50 | ## Completion |
| 51 | State management is implemented, connected, optimized, and tested. |
People who liked this also viewed
6 picksType
- hyperframes-cliUse the HyperFrames CLI development loop: init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, present, beats, keyframes, single or batch render, publish, cloud, SkillsJul 2026
- request-refactor-planSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026
- analyze-projectRigor Analyze / Rigor Audit read-only skill for deep learning research repositories. Use when the user wants to read and understand a repository, inspect model structure and training or inference entrSkillsMay 2026
- explore-codeRigor Improve implementation leaf skill for auditable candidate implementation in deep learning research repositories. Use when the researcher explicitly authorizes exploratory work on an isolated braSkillsMay 2026
- ubiquitous-languageSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026
- scaffold-exercisesSkills for Real Engineers. Straight from my .agents directory.SkillsJul 2026
