Next.js

Contact form for Next.js without building a backend.

App Router or Pages Router. Static export or serverful. Just drop in a form action and receive submissions by email and webhook.

Create your first form Book free migration

How it works

Three steps to production forms.

01

Create a form

Generate a FormsFort access key in the dashboard.

02

Add to your page

Paste the HTML form into any Next.js page or component. No API route needed.

03

Deploy

Works with static export, Vercel, Netlify, or any host. Submissions route to email instantly.

Setup

Next.js page with contact form

export default function ContactPage() {
  return (
    <form action="https://api.formsfort.dev/submit" method="POST">
      <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY" />
      <input type="text" name="name" placeholder="Name" required />
      <input type="email" name="email" placeholder="Email" required />
      <textarea name="message" placeholder="Message" required></textarea>
      <input type="checkbox" name="botcheck" style={{ display: "none" }} />
      <button type="submit">Send</button>
    </form>
  );
}
Get your access key

Migration

Migration checklist.

Move an existing form in minutes without rebuilding markup.

01

Create a FormsFort form and copy your access key.

02

Add a <form> element to your Next.js page or component.

03

Set the action to https://api.formsfort.dev/submit.

04

Add name, email, and message fields.

05

Include a botcheck honeypot for spam protection.

06

Build and deploy. No API route required.

FAQ

Common questions.

Does this work with Next.js App Router?

Yes. The form is standard HTML and works in both App Router and Pages Router.

Can I use this with static export?

Yes. FormsFort is an external API endpoint, so it works with output: 'export' without any server functions.

Do I need an API route?

No. The browser posts directly to FormsFort. If you need server-side validation, you can add an API route that proxies to FormsFort.

How do I handle the response?

For JavaScript submissions, fetch the endpoint and read the JSON response. For plain HTML forms, the user is redirected to the success page you configure.

Stop managing form servers.

Create a production form endpoint, migrate your first form free, and scale when you are ready.

Create your first form Book free migration