Add E-Signatures to Remix

Quick start

1. Get an API key from signb.ee (free, no credit card)
2. Set SIGNBEE_API_KEY in your environment
3. Add the code below to your app

Remix example

// app/routes/api.send-contract.tsx
import { ActionFunctionArgs, json } from "@remix-run/node";

export async function action({ request }: ActionFunctionArgs) {
  const body = await request.json();
  const res = await fetch("https://signb.ee/api/send", {
    method: "POST",
    headers: {
      Authorization: `Bearer ${process.env.SIGNBEE_API_KEY}`,
      "Content-Type": "application/json",
    },
    body: JSON.stringify(body),
  });
  return json(await res.json());
}

What happens

1. Your app sends markdown or a PDF URL to Signbee
2. Signbee generates a PDF (if markdown) and emails the recipient a signing link
3. Recipient signs — both parties receive the signed PDF with SHA-256 certificate

Also works with AI agents

Install the MCP server to let Claude, Cursor, or Windsurf send documents directly:

npx -y signbee-mcp

Integration details

Remix is a React framework focused on web standards and progressive enhancement. Adding e-signatures uses Remix's action functions, which run exclusively on the server.

Action functions: Remix's action functions (shown above) handle POST requests server-side. The API key in process.env.SIGNBEE_API_KEY is never exposed to the client. Actions are the standard way to handle form submissions and API calls in Remix.

Progressive enhancement: Remix forms work with and without JavaScript. A basic HTML form submitting to your action function sends contracts even if the client's JavaScript fails to load. This is Remix's core philosophy of resilient web applications.

Loader/Action pattern: Use loaders to fetch contract status (GET) and actions to send contracts (POST). This clean separation of read and write operations follows REST principles and makes your code predictable.

Deployment targets: Remix deploys to Node.js, Cloudflare Workers, Deno, Vercel, Netlify, and Fly.io. The action function runs on your chosen server runtime. Set SIGNBEE_API_KEY via your deployment platform's environment configuration.

Fetcher: Use Remix's useFetcher hook for client-side contract sending without full page navigation. The fetcher provides loading states, optimistic UI, and error handling while the action processes on the server.

FAQs