Digital Transformation
Server Actions (Next.js)
Server Actions adalah fungsi async di Next.js App Router yang dieksekusi di server, biasanya untuk mutation form tanpa membuat API route terpisah, ditandai dengan direktif use server.
TL;DR: Server Actions adalah fungsi async yang dieksekusi di server pada Next.js App Router, ditandai dengan direktif "use server". Server Actions menggantikan kebutuhan membuat API route terpisah untuk mutation form, sekaligus mengurangi JavaScript yang dikirim ke browser.
Apa itu Server Actions?
Server Actions adalah fitur Next.js yang stabil sejak versi 14 dan menjadi pola default mutation di App Router. Fungsi yang ditandai "use server" akan otomatis diserialisasi dan dipanggil melalui RPC dari komponen client atau server, tanpa developer perlu menulis route handler. Pola ini bekerja dekat dengan [React Server Components](/glosarium/rsc) dan edge runtime, serta cocok dipasangkan dengan partial prerendering untuk halaman hybrid.
Kapan Memakai Server Actions
| Use case | Cocok? | Alasan |
|---|---|---|
| Form submit, mutation database | Ya | Tanpa boilerplate API route |
| Webhook receiver eksternal | Tidak | Pakai Route Handler, lebih eksplisit |
| Streaming response panjang | Tidak | Lebih cocok pakai Route Handler atau API route |
| Optimistic UI dengan revalidate | Ya | Built-in revalidatePath dan revalidateTag |
Kenapa Penting?
Untuk developer Indonesia yang membangun website bisnis dengan Next.js, Server Actions menghemat banyak baris kode boilerplate. Saya memakai pola ini saat membangun fitur admin di vitoatmo.com untuk publish artikel dan glosarium. Hasilnya, satu file komponen menghandle form, validasi, dan mutation tanpa perlu file route terpisah, dengan tetap mendapat type safety penuh. Untuk panduan resmi, lihat dokumentasi Next.js Server Actions.
Pertanyaan Umum
Apakah Server Actions aman dari CSRF?
Next.js melakukan origin check otomatis. Tetap perlu autentikasi user di setiap action sensitif, jangan andalkan origin saja.
Bisakah Server Actions dipakai di Pages Router?
Tidak. Server Actions hanya tersedia di App Router. Pages Router tetap memakai API route.
Istilah Terkait