Skip to main content
New:Build with AI agents

Make your Windsurf contact form send real submissions.

Let Cascade connect the form to one public endpoint. Form Plume handles email notifications, submission storage, spam protection, webhooks, and integrations.

Free foreverNo credit cardWorks across the framework Cascade finds
Cascade change
// Cascade should preserve the detected framework.
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 full guide

A Cascade workflow that survives deployment.

Discover the stack, constrain the edit, inspect the diff, and verify the same form on its final production origin.

Windsurf Cascade can work across an existing repository, run terminal commands, preview web apps, and create App Deploys. It still needs to discover whether your project is React, Vue, Svelte, Next.js, or something else before it edits the form.

  1. 1
    Create your Form Plume accountStart free and give your Windsurf 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 WindsurfReview Cascade's diff, test the local preview, and repeat the submission from the real production deployment. Send one test submission from the real Windsurf app or preview environment and confirm it reaches Form Plume.

Prompt Cascade with boundaries

Inspect this repository and find its contact form and framework conventions.
Connect the existing form to the public endpoint below:
https://api.formplume.com/f/your-public-slug
 
Keep the current design and validation. Prefer native form submission if hosted result
navigation is acceptable; otherwise send FormData and implement accessible inline pending,
success, and error states that preserve input after failure. Every submitted control needs a
name. Do not add a database, server function, SMTP package, or dependency solely for
this form. The endpoint is public configuration; never put access keys, webhook
secrets, or provider credentials in browser code. Run the repository's existing
formatter, typecheck, tests, and build. Show the diff and verification results.

Cascade's previews make visual checks quick, but a successful-looking preview is not enough. Confirm the network request receives a 2xx response and that the record appears in Form Plume.

Check Cascade's work

Ask Cascade to explain which framework it found and why it chose native submission or fetch. Then inspect the diff for surprise server functions, environment variables exposed through a client prefix, or unrelated generated files.

For a Vite project, verification might be:

pnpm lint
pnpm test
pnpm build
git diff --check

The repository remains the source of truth. Use its actual scripts and package manager. Test an invalid endpoint as well as the happy path so the generated error UI is not dead code.

Public endpoint and private secrets

The public form slug is safe in the rendered app. It is an address, not an authorization credential. Keep protected-form keys, signed-webhook secrets, and deployment credentials server-side. Moving a value into a client-prefixed environment variable only makes it configurable; it does not make it secret.

Windsurf documents App Deploys as a preview-oriented way to share web apps. Use your normal production hosting and release controls for the durable deployment, then test the form again on that final origin.

Preview-to-production checklist

  1. Inspect the diff and run the project's checks.
  2. Submit in the local preview and verify delivery in Form Plume.
  3. Force a rejection. For fetch, confirm accessible inline feedback and retained values. For native POST, confirm navigation reaches the hosted error response.
  4. Deploy through the project's normal production path.
  5. Retest from the final hostname and verify allowed-domain settings.

If Cascade identifies Vue, Svelte, or Next.js, use the corresponding Vue, Svelte, or Next.js guide. Compare Cursor, Claude Code, and Codex for other repository-agent workflows.

Primary sources

FAQ

Windsurf questions
before you deploy.

Yes. Cascade can inspect and edit a repository, run commands, and preview supported web apps. It should first identify the framework and current form conventions.

One line. Zero backend.

The form backend you don’t have to build.

Free foreverNo credit cardSet up in under a minute