Server Actions async functions हुन् जो सर्भरमा चलिन्छन् तर तपाईंको components बाट सीधै कल गर्न सकिन्छ (forms र event handlers बाट पनि) — जसले तपाईंलाई mutations (create/update/delete) गर्न दिन्छ म्यानुएली API endpoint बनाएको बिना। तपाईं तिनीलाई "use server" directive संग चिन्हित गरिन्छ।
;
{ 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>
);
}
फर्मको action Server Action को तर्फ संकेत गरेको छ। submit मा, Next.js ले FormData सर्भरमा पठाउँछ, त्यहाँ function चलाउँछ, र प्रभावित pages को revalidate गर्न सक्छ — सबै API route र client-side fetch code बिना।
"use client";
import { createTodo } from "./actions";
export function AddButton() {
return <button onClick={() => createTodo(/* ... */)}>Add</button>;
}
route.ts handlers र client fetches लेखेको।revalidatePath/revalidateTag mutation पछि cached data रिफ्रेश गर्छ।⚠️ 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 सामान्य mutation stack (API route + client fetch + state handling) लाई एकल server function मा संक्षिप्त गर्छ जुन तपाईं सीधै कल गर्नुहोस् — App Router को forms र data changes को जवाफ।
तिनीहले boilerplate कम गर्छ, progressive enhancement सक्षम गर्छ, र caching/revalidation सँग एकीकृत गर्छ, तर (कुनै पनि endpoint जस्तै) तिनीहरू भित्र validation र auth checks चाहिन्छ।