Skip to main content
New:Build with AI agents

Turn your Bolt form into a working contact form.

Add one endpoint to the form Bolt generated. Form Plume handles email notifications, submission storage, spam protection, integrations, and webhooks.

Free foreverNo credit cardNo database required for public intake
ContactForm.tsx
const response = await fetch(FORM_ENDPOINT, {
  method: "POST",
  headers: { Accept: "application/json" },
  body: new FormData(form),
});
if (!response.ok) throw new Error("Submission failed");

The full guide

A narrow prompt for a capable builder.

Prevent infrastructure creep, keep private credentials server-side, and verify preview and production.

Bolt Cloud includes hosting, databases, server functions, secrets, and backend capabilities. Bolt can build a complete form workflow without Form Plume. The direct endpoint path is for a narrower decision: standard public intake that should not require a new database schema, function, and transactional-email setup.

  1. 1
    Create your Form Plume accountStart free and give your Bolt.new form a hosted endpoint for email, submissions, spam filtering, uploads, integrations, and webhooks.Start free
  2. 2
    Create the form and copy the endpointCopy the endpoint URL from Form Plume. It looks like https://api.formplume.com/f/your-slug
  3. 3
    Connect it inside Bolt.newReview Bolt's file changes, submit in preview, and retest after the app is published on its final origin. Send one test submission from the real Bolt.new app or preview environment and confirm it reaches Form Plume.

Tell Bolt not to invent infrastructure

Keep the existing contact form and design. Connect it directly to this public endpoint:
https://api.formplume.com/f/your-public-slug
 
Use FormData and Accept: application/json. Add accessible sending, sent, and error
states. Reset only after a 2xx response and preserve values after failure. Ensure every
submitted control has a name. Do not provision a Bolt database, server function,
secret, or email integration solely for this contact form. Never expose private API
keys, protected-form keys, or webhook signing secrets in browser code. List changed
files and test the success and error paths in preview.

The small implementation

const response = await fetch("https://api.formplume.com/f/your-public-slug", {
  method: "POST",
  headers: { Accept: "application/json" },
  body: new FormData(form),
});
if (!response.ok) throw new Error("Submission failed");

The slug is intentionally public. Bolt secrets and backend credentials must never be interpolated into client output. Use Bolt's server functions when the request genuinely needs a secret or custom authorization.

Bolt can make broad project changes from a short prompt. Inspect the file list for surprise schema, package, or server-function additions before accepting a form-only change.

When Bolt Cloud is the better architecture

Choose native data and server functions when submissions are queryable application records, linked to signed-in users, or part of a custom transactional workflow. Choose the portable endpoint when the requirement is an operational inbox with email, spam handling, integrations, and webhooks.

Preview and production checks

  1. Confirm Bolt preserved the existing framework and form styles.
  2. Check name attributes and non-2xx handling.
  3. Submit from preview and verify the Form Plume record.
  4. Test a deliberately invalid slug.
  5. Publish and repeat from the final hostname, including allowed-domain checks.

Use the framework guide Bolt discovers, such as React or Vite. Compare Lovable, v0, Replit, and Base44.

Primary sources

FAQ

Bolt questions
before you accept the build.

Yes. Bolt Cloud includes hosting, databases, server functions, secrets, and backend capabilities. Form Plume is a smaller option for standard public intake.

One line. Zero backend.

The form backend you don’t have to build.

Free foreverNo credit cardSet up in under a minute