advanced
Server actions where applicable
Understand when form submission can cross a server boundary and how pending, validation, and security fit.
Server Actions (in frameworks like Next.js) let forms post to async functions on the server from client components. They serialize arguments, handle progressive enhancement, and integrate with revalidation. Treat them like RPC endpoints: validate input, authorize, and return structured errors.
Use pending UI with `useFormStatus` or transition state. Do not expose secrets in action payloads. Pair with client validation for UX, not security.
On interviews, explain the concept with a concrete example and name the behavior interviewers probe.
Common pitfalls include hiding data flow, over-splitting components, and putting side effects in render.
The trade-off is often clarity versus reuse or explicit props versus convenience.
Checklist:
- Validate and authorize on server.
- Structured field errors back to UI.
- Pending and error states for submits.