Agent skill · software engineering · aiskillstore

react-19-patterns

Comprehensive React 19 patterns including all hooks, Server/Client Components, Suspense, streaming, and transitions. Ensures correct React 19 usage with TypeScript.

Why this skill is useful

Provides comprehensive patterns and validation scripts for React 19 that are not widely documented, enhancing the AI's ability to generate correct React code.

What it needs

Requires bash installed locally. About 4k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.

What this skill does

React 19 Patterns - Comprehensive Guide When to Use This Skill Use this skill when: Writing React components (Server or Client) Using React hooks (standard or new React 19 hooks) Implementing forms with Server Actions Working with Suspense and streaming Managing state and transitions Optimistic UI updates Migrating from React 18 to React 19 What This Skill Covers Core Patterns Server vs Client Components - Complete decision tree All React Hooks - Complete reference with TypeScript Suspense Patterns - Boundaries, streaming, error handling Server Components - Data fetching, caching, composition Client Components - Interactivity, state, effects Transitions - useTransition, startTransition, isPending Streaming - Progressive rendering patterns Migration Guide - React 18 → React 19 New in React 19 use() - For async data in components useOptimistic() - For optimistic UI updates useFormStatus() - For form submission state useActionState() - For Server Action state Enhanced useTransition() - Better performance Improved error boundaries Better hydration Quick Reference Server Component Pattern Client Component Pattern New React 19 Hook Pattern File Structure This skill is organized into detailed guides: 1. server-vs-client.md - Decision tree for component type 2. hooks-complete.md - All React hooks with TypeScript 3. suspense-patterns.md - Suspense boundaries and streaming 4. server-components-complete.md - Server Component patterns 5. client-components-complete.md - Client Component patterns 6. transitions.md - useTransition and concurrent features 7. streaming-patterns.md - Progressive rendering 8. migration-guide.md - React 18 → 19 migration 9. …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills aiskillstore/react-19-patterns

View the source on GitHub

Browse the @skills marketplace