Server Actions su async funkcije koje se izvršavaju na serveru, ali se mogu pozivati izravno iz vaših komponenti (uključujući forme i event handlere) — omogućujući vam da izvodite mutacije (create/update/delete) bez ručnog pisanja API endpoint-a. Označavate ih s "use server" direktivom.
;
{ revalidatePath } ;
() {
title = formData.() ;
db..({ : { title } });
();
}
// 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>
);
}
Atribut action forme pokazuje na Server Action. Pri slanju, Next.js šalje FormData na server, izvršava funkciju tamo i može revalidirati zahvaćene stranice — sve bez API rute i bez client-side fetch koda.
"use client";
import { createTodo } from "./actions";
export function AddButton() {
return <button onClick={() => createTodo(/* ... */)}>Add</button>;
}
route.ts handlera i client fetch-eva.revalidatePath/revalidateTag osvježavaju cache-irane podatke nakon mutacije.⚠️ 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 kolapsiraju uobičajeni mutation stack (API ruta + client fetch + state handling) u jednu server funkciju koju pozivate izravno — App Router-ov odgovor na forme i promjene podataka.
Smanjuju boilerplate, omogućuju progressive enhancement i integriraju se s cachiranjem/revalidacijom, ali (kao bilo koji endpoint) zahtijevaju validaciju i provjere autentifikacije unutar njih.