react-19listed
Install: claude install-skill aiskillstore/marketplace
# React 19
React 19 (stable since Dec 2024) simplifies async operations, improves SSR, and enhances DX with Actions, Server Components, and new hooks.
## When to Use
- Building React 19 applications
- Async form handling with automatic pending/error states
- Server Components for SSR
- Optimistic UI updates
- Migrating from React 18
- Server Actions for full-stack forms
## Installation
```bash
npm install react@19.2.1 react-dom@19.2.1
npm install --save-dev @types/react@19.0.0 @types/react-dom@19.0.0
```
**Required:** Enable modern JSX transform in `tsconfig.json`:
```json
{ "compilerOptions": { "jsx": "react-jsx" } }
```
## Core Concepts
### Execution Boundaries
| Type | Runs | State | Access |
|------|------|-------|--------|
| Server Component | Server | No | DB, FS, Secrets |
| Client Component | Browser | Yes | DOM, Browser APIs |
| Server Action | Server | No | DB, APIs |
### Conventions
- `"use server"` = Server Action
- `"use client"` = Client Component
- No directive = Server Component (in RSC environment)
- `async` component = Auto-suspends
## Essential Patterns
### 1. Forms with useActionState
```javascript
'use client';
import { useActionState } from 'react';
function SignupForm() {
const [state, formAction, isPending] = useActionState(
async (prev, formData) => {
const error = await createUser(formData.get('email'));
return error ? { error } : null;
},
{ error: null }
);
return (
<form action={formAction}>
<