Server Actions olyan aszinkron függvények, amelyek a szerveren futnak, de közvetlenül meghívhatóak az összetevőkből (beleértve az űrlapokból és eseménykezelőkből) — lehetővé teszik a mutációk (létrehozás/frissítés/törlés) manuális API végpont elkészítése nélkül. Jelöléséhez a "use server" direktívát használod.
;
{ 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>
);
}
Az űrlap action attribútuma a Server Actionre mutat. Elküldéskor a Next.js elküldi a FormData-t a szerverre, futtatja az függvényt, és újraérvényesítheti az érintett oldalakat — mindez API útvonal és kliens oldali fetch kód nélkül.
"use client";
import { createTodo } from "./actions";
export function AddButton() {
return <button onClick={() => createTodo(/* ... */)}>Add</button>;
}
route.ts kezelők és kliens fetch-ek nélkül.revalidatePath/revalidateTag frissíti a gyorsítótározott adatokat a mutáció után.⚠️ Server Actions are PUBLIC endpoints under the hood — always validate input and
check authorization inside them, exactly as you would a real API route.
A Server Actions összeomlasztják a szokásos mutáció stacket (API útvonal + kliens fetch + state kezelés) egy olyan szerver függvénybe, amelyet közvetlenül hívhatsz — az App Router válasza az űrlapokra és adatváltozásokra.
Csökkentik a sablonkódot, lehetővé teszik a progresszív fejlesztést, és integrálódnak a gyorsítótárazással/újraérvényesítéssel, de (mint bármely végpont) validációs és auth ellenőrzéseket igényelnek bennük.