claudegoodies
Command

hooks

From davila7

Create or optimize React hooks for $ARGUMENTS following project conventions.

Install

/hooks

Facts

Repository
davila7/claude-code-templates
Status
Actively maintained
Last commit
Source file
cli-tool/templates/javascript-typescript/examples/react-app/.claude/commands/hooks.md

Source preview

The instructions Claude Code reads when this command runs.

# React Hooks

Create or optimize React hooks for $ARGUMENTS following project conventions.

## Task

Analyze the request and create appropriate React hooks:

1. **Examine existing hooks**: Check project for existing custom hooks patterns and conventions
2. **Identify hook type**: Determine if creating new custom hook, optimizing existing hook, or implementing specific hook pattern
3. **Check TypeScript usage**: Verify if project uses TypeScript and follow typing conventions
4. **Implement hook**: Create hook with proper:
   - Naming convention (use prefix)
   - TypeScript types and interfaces
   - Proper dependency arrays
   - Error handling
   - Performance optimizations
5. **Add tests**: Create comprehensive unit tests using project's testing framework
6. **Add documentation**: Include JSDoc comments and usage examples

## Common Hook Patterns

When creating hooks, consider these patterns based on the request:
- **Data fetching**: API calls, loading states, error handling
- **State management**: Local state, derived state, state persistence
- **Side effects**: Event listeners, timers, subscriptions
- **Context consumption**: Theme, auth, app state
- **Form handling**: Input management, validation, submission
- **Performance**: Memoization, debouncing, throttling

## Requirements

- Follow existing project hook conventions
- Use TypeScript if project uses it
- Include proper
View full source on GitHub →

Other slash commands