Introduction

Meet Formhubs.

Formhubs provides the backbone for your web forms. Instead of building custom backends for every project, you simply create an endpoint and send your data to us. We handle the data collection, notifications, and storage.

Quick Start

1

Create a new form in your Dashboard to get your unique Form ID.

2

Add the endpoint to your form's fetch request or SDK configuration.

const endpoint = "https://formhubs.com/api/v1/f/YOUR_ID";

Installation

While you can use raw fetch, our SDKs provide a more streamlined experience with built-in validation and state management.

npm install @formhubs/react

Form Capture

Formhubs accepts JSON payloads via POST requests. Ensure your inputs have descriptive names as they will be preserved in your database.

{
  "name": "Jane Doe",
  "email": "jane@example.com",
  "message": "Hello from my custom UI!"
}

Data Routing

Control where your data flows after it hits our servers. Route submissions to multiple emails, team members, or external storage buckets.

Integrations

Connect your forms to the tools you already use. Supported integrations include:

Discord
Slack
Email
Google Sheets
PostHog
Airtable

Webhooks

For total automation, set up incoming webhooks. We'll send a POST request with the submission payload to your server every time a new form is captured.

SDK Reference

React SDK

Our React SDK provides the `useForm` hook for handling submission state and validation.

import { useForm } from "@formhubs/react";

function Contact() {
  const { state, handleSubmit } = useForm("YOUR_FORM_ID");

  return (
    <form onSubmit={handleSubmit}>
      <input name="email" type="email" required />
      <button disabled={state.submitting}>Submit</button>
    </form>
  );
}

Next.js Integration

Perfect support for Server Actions and API Routes. Forward data server-side to keep your client-side bundle small.

API Reference

Post/v1/f/:form_idGeneric Capture
Get/v1/submissions/:form_idFetch all submissions