Server Actions in React 19 and Next.js

Server Actions are async functions that execute on the server, not in the browser. They are marked with the 'use server' directive placed at the top of the file or at the top of the function body, signaling to the framework that this function must never run on the client side.

Because Server Actions run on the server, they have access to the full server context: database connections, environment secrets, session data, and filesystem resources. This is fundamentally different from client components, which can only access what the browser exposes.

When a client component calls a Server Action, Next.js automatically makes an HTTP POST request to a special RSC endpoint. The framework handles all the serialization of arguments and the transport layer, so you never write fetch() calls manually for these mutations.

Server Actions replace the need for API routes in many mutation scenarios. The action itself is the endpoint — you define the logic once as a server function and call it directly from the client component as if it were a local function.

Server Actions were initially a Next.js-specific concept, but React 19 elevates them to a first-class React feature. This means bundlers and frameworks other than Next.js can implement the same pattern following the React specification.

Server Actions are experimental in React 19 RC but have been stable in Next.js 14+ App Router since their introduction. If you are building a production application today with Next.js App Router, Server Actions are a fully supported and recommended pattern.

One of the most important security properties of Server Actions is that secrets never reach the browser. Environment variables like database passwords and API keys used inside a Server Action are never included in the client bundle, because the function body is never sent to the browser.

HTML form elements accept a Server Action directly via the action attribute: <form action={myServerAction}>. React intercepts the form submission and calls the Server Action with the form data, enabling server-side mutation without any client-side JavaScript plumbing.

When a Server Action is triggered, React serializes the action arguments into a POST request body. The server deserializes them, executes the function, serializes the return value, and sends it back. Only serializable values (strings, numbers, arrays, plain objects) can cross the boundary.

You can define a Server Action at the module level in a file with 'use server' at the top, or inline inside a Server Component by placing 'use server' at the top of the async function. Both approaches produce the same result: a server-only callable function.

Client components import and call Server Actions just like regular async functions. The calling syntax is identical to a local async function call, but the execution happens entirely on the server. This abstraction keeps client components clean and free of fetch boilerplate.

Which of the following best describes the security model of Server Actions?

Server Actions are async server-side functions marked with 'use server'. They close over server context like database connections and environment secrets. Next.js handles the HTTP transport automatically, and React 19 makes them a framework-agnostic feature. Forms can use them directly via the action attribute, and secrets inside them never reach the browser.