claude

react-19

React 19 patterns, hooks, and best practices

0 on GitHubby Daniel Jankowskiv1.0.0MITupdated 11 months agoframework
/

Plugin react-19 from marketplace claude-configs in djankies/claude-configs. Commands read from the repo's manifest — 1 month ago.

This plugin runs code on your machine — its hooks fire automatically on events like tool use. The exact commands are listed below; read them before installing.

What it installs

Skills (26)

  • composing-components

    Teaches component composition patterns in React 19 including children prop, compound components, and render props. Use when designing component APIs, creating reusable components, or avoiding prop drilling.

  • following-the-rules-of-hooks

    Fix React Rules of Hooks violations - conditional calls, hooks in loops/callbacks/classes

  • implementing-code-splitting

    Teaches code splitting with lazy() and Suspense in React 19 for reducing initial bundle size. Use when implementing lazy loading, route-based splitting, or optimizing performance.

  • implementing-optimistic-updates

    Teaches useOptimistic hook for immediate UI updates during async operations in React 19. Use when implementing optimistic UI patterns, instant feedback, or reducing perceived latency.

  • implementing-server-actions

    Teaches Server Actions in React 19 for form handling and data mutations. Use when implementing forms, mutations, or server-side logic. Server Actions are async functions marked with 'use server'.

  • managing-local-vs-global-state

    Teaches when to use local state vs global state (Context) in React 19. Use when deciding state management strategy, avoiding prop drilling, or architecting component state.

  • managing-server-vs-client-boundaries

    Teaches when to use Server Components vs Client Components in React 19, including the 'use client' directive and boundary patterns. Use when architecting components, choosing component types, or working with Server Components.

  • migrating-from-forwardref

    Teaches migration from forwardRef to ref-as-prop pattern in React 19. Use when seeing forwardRef usage, upgrading React components, or when refs are mentioned. forwardRef is deprecated in React 19.

  • optimizing-with-react-compiler

    Teaches what React Compiler handles automatically in React 19, reducing need for manual memoization. Use when optimizing performance or deciding when to use useMemo/useCallback.

  • preloading-resources

    Teaches resource preloading APIs in React 19 including prefetchDNS, preconnect, preload, and preinit. Use when optimizing initial load or navigation performance.

  • reviewing-component-architecture

    Review component architecture for React 19 best practices including size, composition, Server/Client boundaries, and anti-patterns. Use when reviewing component design.

  • reviewing-hook-patterns

    Review React hook usage for React 19 compliance and best practices

  • reviewing-performance-patterns

    Review React 19 performance patterns including memoization, re-renders, and bundle size. Use when reviewing performance or optimization.

  • reviewing-server-actions

    Review Server Actions for security, validation, and best practices in React 19. Use when reviewing forms, mutations, or server-side logic.

  • reviewing-state-management

    Review state management patterns for React 19 best practices. Use when reviewing component state, Context usage, or state architecture.

  • reviewing-test-quality

    Review React 19 test quality including coverage, patterns, and React 19 API testing. Use when reviewing tests or test coverage.

  • supporting-custom-elements

    Teaches Web Components (Custom Elements) support in React 19, including property vs attribute handling and custom events. Use when integrating Web Components or working with custom HTML elements.

  • testing-components

    Teaches React Testing Library patterns for React 19 components. Use when writing component tests, testing interactions, or testing with Server Actions.

  • testing-hooks

    Teaches testing custom hooks in React 19 using renderHook from React Testing Library. Use when testing custom hooks or hook behavior.

  • testing-server-actions

    Teaches testing Server Actions in isolation in React 19. Use when testing Server Actions, form handling, or server-side logic.

  • tracking-form-status

    Teaches useFormStatus hook for tracking form submission state in React 19. Use when implementing submit buttons, form loading states, or pending indicators.

  • using-action-state

    Teaches useActionState hook for managing form state with Server Actions in React 19. Use when implementing forms, handling form submissions, tracking pending states, or working with Server Functions.

  • using-context-api

    Teaches Context API patterns in React 19 including use() hook for conditional context access. Use when implementing Context, avoiding prop drilling, or managing global state.

  • using-reducers

    Teaches useReducer for complex state logic in React 19. Use when state updates depend on previous state, multiple related state values, or complex update logic.

  • using-the-use-hook

    React 19's use() API for reading Promises/Context conditionally. For async data fetching, Suspense, conditional context access, useContext migration.

  • validating-forms

    Teaches client and server-side form validation patterns in React 19 with Server Actions. Use when implementing form validation, input checking, or error handling.

Hooks (2)

  • PostToolUse

    ${CLAUDE_PLUGIN_ROOT}/scripts/validate-react-19.sh

  • SessionStart

    ${CLAUDE_PLUGIN_ROOT}/scripts/check-react-version.sh

View source on GitHub

More from djankies/claude-configs

All 9 plugins →

prisma-6

claude

Prisma 6 ORM patterns and best practices

19 skills · hooks

0

TypeScript 5.9 type safety and best practices

15 skills · 1 command · hooks

0

nextjs-16

claude

Next.js 16 breaking changes and security patterns

9 skills · 1 MCP server · hooks

0

Brief plugin description

5 skills · 1 command · 1 agent · 3 MCP servers · hooks

0

zod-4

claude

Zod v4 schema validation and best practices

9 skills · hooks

0

Tailwind CSS v4 patterns and configuration

7 skills · hooks

0

Similar plugins

Comprehensive toolkit for developing Claude Code plugins. Includes 7 expert skills covering hooks, MCP integration, commands, agents, and best practices. AI-assisted plugin creation and validation.

7 skills · 1 command · 3 agents

anthropics/claude-code 155,476

Professional UI/UX design intelligence for AI coding assistants. Includes searchable databases of styles, colors, typography, charts, and UX guidelines for React, Next.js, Astro, Vue, Nuxt.js, Nuxt UI, Svelte, SwiftUI, React Native, Flutter, Tailwind, shadcn/ui, Jetpack Compose, Angular, Laravel, JavaFX, and Three.js.

7 skills

nextlevelbuilder/ui-ux-pro-max-skill 148,759

nextjs

claude

Official Next.js skills: adopt and optimize Cache Components, adopt Partial Prefetching, and verify runtime behavior against a running dev server.

6 skills

vercel/next.js 143,495

CMEM Pro

claude

CMEM Pro for the Claude app - hooks stream tool use to cmem.ai and inject observations into new sessions and agents

3 skills · 1 MCP server · hooks

thedotmack/claude-mem 116,618

mempalace

claudecodex

AI memory system — mine projects and conversations into a searchable palace. 47 MCP tools, auto-save hooks, guided setup.

3 skills · 6 commands · 1 MCP server · hooks

MemPalace/mempalace 60,536

pensyve

claude

Universal memory runtime for Claude Code with cross-session memory, entity-aware recall, lifecycle hooks, skills, commands, and memory-curator agents

7 skills · 7 commands · 2 agents · hooks

wshobson/agents 42,461

Maintain react-19?

This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.

claude & codex plugins9 plugins