React

# React

React is the standard library for building user interfaces. React 19 (2025) introduces a new era with the React Compiler, Server Components, and Actions.

## When to Use

- **Single Page Apps (SPA)**: Rich, interactive dashboards.
- **Complex UI**: Applications with many moving parts and state.
- **Ecosystem**: When you need the largest library of 3rd party components.

## Quick Start (React 19)

```tsx
import { use, Suspense } from "react";

// New: 'use' hook for promises
function Comments({ commentsPromise }) {
  const comments = use(commentsPromise);
  return comments.map((c) => <p key={c.id}>{c.text}</p>);
}

export default function Page({ id }) {
  const commentsPromise = fetchComments(id);

  return (
    <Suspense fallback={<p>Loading...</p>}>
      <Comments commentsPromise={commentsPromise} />
    </Suspense>
  );
}
```

## Core Concepts

### React Compiler

React 19 introduces an auto-memoizing compiler. You no longer need `useMemo` or `useCallback` manually in 99% of cases. The compiler treats code as "memoized by default".

### Server Components (RSC)

Components that run _only_ on the server. They don't send JS to the client.

- **`'use server'`**: Marks a function as a Server Action (callable from client).
- **`'use client'`**: Marks a component as interactive (hydrated on client).

### Actions and `useActionState`

Native support for async form submission.

```tsx