Server Actions sind asynchrone Funktionen, die auf dem Server ausgeführt werden, aber direkt von deinen Komponenten (einschließlich Formularen und Event-Handlern) aufgerufen werden können — sodass du Mutationen (Create/Update/Delete) durchführen kannst, ohne manuell einen API-Endpoint zu bauen. Du kennzeichnest sie mit der "use server"-Direktive.
// app/todos/actions.ts
"use server";
import { revalidatePath } from "next/cache";
export async function createTodo(formData: FormData) {
const title = formData.get("title") as string;
await db.todo.create({ data: { title } }); // runs on the server — DB access, secrets
revalidatePath("/todos"); // refresh the cached page with new data
}
// app/todos/page.tsx — wire the action straight to a form
import { createTodo } from "./actions";
export default function Page() {
return (
<form action={createTodo}> {/* no onSubmit, no fetch, no /api route */}
<input name="title" />
<button>Add</button>
</form>
);
}
Das action-Attribut des Formulars verweist auf die Server Action. Bei der Übermittlung sendet Next.js die FormData an den Server, führt die Funktion dort aus und kann betroffene Seiten revalidieren — alles ohne API-Route und ohne Client-seitigen Fetch-Code.
"use client";
import { createTodo } from "./actions";
export function AddButton() {
return <button onClick={() => createTodo(/* ... */)}>Add</button>;
}
route.ts-Handler und Client-Fetches zu schreiben.revalidatePath/revalidateTag aktualisieren gecachte Daten nach der Mutation.⚠️ Server Actions are PUBLIC endpoints under the hood — always validate input and
check authorization inside them, exactly as you would a real API route.
Server Actions vereinfachen den üblichen Mutationsstapel (API-Route + Client-Fetch + State-Handling) zu einer einzelnen Server-Funktion, die du direkt aufrufst — die Antwort des App Routers auf Formulare und Datenänderungen.
Sie reduzieren Boilerplate, ermöglichen progressive Enhancement und integrieren sich mit Caching/Revalidierung, erfordern aber (wie jeder Endpoint) Validierung und Auth-Checks darin.