Server Actions en Next.js: mutaciones sin escribir una API route

Durante años, para que un botón en el navegador pudiera "escribir" algo en la base de datos necesitabas crear una API route, exponerla, y llamarla con fetch desde el cliente. Las Server Actions de Next.js eliminan ese paso intermedio: escribís una función que corre en el servidor y la llamás directamente desde un componente, como si fuera una función normal.

¿Por qué importa esto?

• Menos código repetido: no hay que definir una ruta, parsear el body, ni serializar la respuesta a mano.
• Tipado end-to-end: como la función vive en tu mismo proyecto, TypeScript infiere los tipos de entrada y salida sin generar nada extra.
• Funciona desde Server y Client Components: podés invocarla en un <form action={...}> o como una función async normal dentro de un onClick.

Un ejemplo mínimo

1
2
3
4
5
6
7
8
'use server';

export async function likePost(postId: string) {
// Corre 100% en el servidor: acceso directo a la base de datos,
// sin exponer credenciales ni armar un endpoint aparte.
await db.query('UPDATE posts SET likes = likes + 1 WHERE id = $1', [postId]);
return { ok: true };
}

Y así se consume desde un componente cliente:

1
2
3
4
5
6
7
8
9
10
11
'use client';

import { likePost } from '@/lib/actions';

export function LikeButton({ postId }: { postId: string }) {
return (
<button onClick={() => likePost(postId)}>
Me gusta
</button>
);
}

Cosas a tener en cuenta

1. Nunca confíes en el cliente. Aunque la función "se vea" como parte del componente, se ejecuta en el servidor: siempre hay que revalidar sesión/permisos adentro de la propia Server Action, igual que harías en una API route.
2. Son ideales para mutaciones puntuales. Guardar un formulario, dar like, agregar un artículo a una lista — no reemplazan una API pública que vas a consumir desde otro servicio.
3. Se pueden combinar con revalidatePath/revalidateTag para refrescar datos ya renderizados en el servidor sin recargar toda la página.

Si ya usaste fetch contra tus propias API routes solo para mutar datos, migrar esos casos a Server Actions suele significar borrar código, no agregarlo.