FormHandle Examples

Copy-paste form integrations for every stack. Pick yours, ship in minutes.

FormHandle is the simplest serverless form handler on the internet. One POST, one email confirmation, and you're capturing form submissions — no backend, no dashboard, no API keys.

These examples show you exactly how to wire it up in your framework.

Pick Your Stack

HTML — no build tools, no dependencies

Example	What you get
html-minimal	Plain <form action> — zero JavaScript, works everywhere
html-styled	Polished form with AJAX submission and built-in spam protection
html-ajax	Custom fetch() — full control over the request and UX

JavaScript Frameworks

Example	What you get
react-vite	Drop-in React component with status handling
nextjs	TypeScript component for App Router and Pages Router
vue	Vue 3 Composition API component
svelte	Svelte component with reactive state
astro	Astro page — plain HTML or script tag, your choice

Static Site Generators

Example	What you get
eleventy	Nunjucks template with data-driven config
hugo	Hugo partial — reads handler ID from hugo.toml

Server-Side Setup

Example	What you get
flask	Python — auto-provisions endpoint on first run, then serves a static form
sinatra	Ruby — same pattern: server-side setup, client-side submission
node-script	Standalone setup script for build pipelines and automation

CI/CD

Example	What you get
ci-setup	GitHub Actions workflow — provision endpoints during deploy

Quick Start

Every example follows the same three steps:

# 1. Create an endpoint
npx formhandle init

# 2. Verify your email (click the link in your inbox)

# 3. Drop in the code from any example above

Your first 3 submissions are delivered free. After that, submissions are queued (not dropped) for 14 days — activate a plan anytime and everything gets delivered instantly.

How the Integration Works

At its core, FormHandle is just a URL that accepts POST requests:

<!-- This is all you need -->
<form action="https://api.formhandle.dev/submit/YOUR_ID" method="POST">
  <input name="name" required>
  <input name="email" type="email" required>
  <textarea name="message"></textarea>
  <button type="submit">Send</button>
</form>

Want AJAX submission with spam protection? Add the script tag:

<script src="https://api.formhandle.dev/s/YOUR_ID.js"></script>
<form data-formhandle>
  <!-- your fields -->
</form>

Want full control? Use fetch():

await fetch("https://api.formhandle.dev/submit/YOUR_ID", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({ name, email, message })
});

Every example in this repo is a variation on one of these three approaches.

Links

• FormHandle docs
• CLI / SDK — npx formhandle init in any language
• Interactive API explorer
• OpenAPI spec

CodeSociety

Looking for IT services?

CodeSociety is our consulting & contracting arm — specializing in IT architecture, XML authoring systems, FontoXML integration, and TerminusDB consulting. We build structured content platforms and data solutions that power digital publishing.

Let's talk! →