nextjs-build-website-contact-form

What problem does it solve?

Provides a working contact form workflow that actually delivers emails instead of using fake client-side submit stubs.

Core Features & Use Cases

• Zod-validated payload (client + server): Shared schema enforces field correctness and consistent error codes with bilingual messages.
• Real POST email delivery via Next.js API route: Sends to configured destination using Resend (or compatible SendGrid flow) with Reply-To set to the user email.
• Abuse-resistant UX and security: IP rate limiting plus honeypot field prevents spam floods and silently blocks bot submissions.
• Accessible bilingual UI: Inline success/error states with aria-invalid and aria-describedby for screen readers.
• Use case: Build the “Contact” section for a Next.js site, ensuring submissions reach your inbox and that retries get rate-limited correctly.

Quick Start

Add this skill to your Next.js build and run it during your 07-write-code contact-form step so the API route, React component, schema, i18n keys, and email delivery are generated together.