Next.js & React 19: A Mental Model

React 19 and the Next.js App Router have fundamentally changed the "mental model" of web development. We are moving away from the client-side-heavy patterns of the last decade toward a more unified, server-centric architecture.

The New Building Blocks

1. Server Components (RSC): These are the default. They fetch data securely on the server, reducing the amount of JavaScript sent to the client.
2. Server Actions: These allow you to handle data mutations (like form submissions) with a simple function call that spans the client-server boundary. No more manual fetch('/api/...') calls.
3. The use API: A new React hook that can consume Promises and Context directly in your render function, eliminating the need for complex useEffect data-fetching patterns.

The Flow of Data

In this new model, you fetch data on the server, pass it down to client components only where interactivity is needed, and use Server Actions to send data back. This "full-stack" approach within a single component file dramatically simplifies state management and improves performance.