nextjs-build-website-contact-form

Building a Next.js contact form that sends emails requires a POST `/api/contact` route using the Node runtime and Resend integration, paired with shared zod schemas for client and server validation to ensure real delivery.

To add rate limiting and spam protection to a Next.js contact form, implement IP-based rate limiting on the API route to prevent submission floods and include a hidden honeypot field to silently block bot submissions.

Yes, you can use zod for bilingual form validation in Next.js by defining a shared schema that enforces field correctness and maps to bilingual i18n error messages, ensuring consistent validation and accessible error states on both client and server.

The best way to handle contact form accessibility in a bilingual Next.js site is to use inline success and error states with `aria-invalid` and `aria-describedby` attributes, mapping zod validation errors to bilingual i18n keys for screen reader support.

Yes, Resend works with Next.js API routes by sending payloads from a POST `/api/contact` route using the Node runtime, setting the Reply-To header to the user email to ensure direct replies reach your configured destination inbox.

Your Next.js contact form submit stub does not deliver emails because it lacks a server-side API route with real email integration; replacing fake client-side stubs with a Resend-backed POST route ensures actual end-to-end delivery.