Remix

Remix contact form without a mail stack

Use a React form with useFormsReach, or a plain form POST to FormsReach. No custom nodemailer action required for basic contact forms. Deliver submissions by email with spam filtering and to WhatsApp in seconds, metered with monthly credits.

Get Started

Set up FormsReach with Remix

Connect your form in a few steps. No custom backend required.

1
Install @formsreach/react
npm install @formsreach/react and create an API key at FormsReach.
2
Add a client form component
Create a component that uses useFormsReach. Attach submit to the form onSubmit handler and disable the button while submitting.
3
Render it from a route
Import the form into a Remix route module. Deploy and test - email and/or WhatsApp depending on your delivery settings.

React snippet

Copy this into your project, then swap in your FormsReach API key.

          // npm install @formsreach/react
import { useFormsReach } from '@formsreach/react';

function ContactForm() {
  const { submit, submitting } = useFormsReach('YOUR_API_KEY');

  return (
    <form onSubmit={submit}>
      <input type="text" name="name" required />
      <input type="email" name="email" required />
      <textarea name="message" required />
      <button type="submit" disabled={submitting}>Submit Form</button>
    </form>
  );
}

// npm install @formsreach/react
import { useFormsReach } from '@formsreach/react';

function ContactForm() {
  const { submit, submitting } = useFormsReach('YOUR_API_KEY');

  return (
    <form onSubmit={submit}>
      <input type="text" name="name" required />
      <input type="email" name="email" required />
      <textarea name="message" required />
      <button type="submit" disabled={submitting}>Submit Form</button>
    </form>
  );
}

Remix actions are optional for contact forms

Remix makes server actions easy - and easy to overbuild for a single lead form. FormsReach is the form API: keep building routes and UI, not SMTP glue.

Platform notes

Named inputs work with the React hook’s FormData path.
Prefer a shared contact form component imported by marketing routes.
See the React page for hook return values (submit, submitting).

Troubleshooting

submit is not a function: Confirm import from @formsreach/react and that the hook runs in a component.
Empty payload: Ensure inputs have name attributes.
Double submit: Disable the button with submitting.

What you get

Monthly credits for submissions and delivery. Scale when volume grows.

Free

500 credits every month for form submissions, email, webhooks, and workflow rules. Spam filtering included. No credit card required.

Starter, Pro & Agency

Larger monthly credit pools (2,000 / 5,000 / 18,000). WhatsApp via Meta Business API unlocks on Pro and Agency. See pricing.

FAQ

Common questions about FormsReach with Remix.

Do I need a Remix action for contact forms?+

Not for the FormsReach path. useFormsReach posts to our form API from the browser, so you can skip a custom mail action for basic enquiries.

Can I use a plain HTML form instead?+

Yes - use the HTML integration snippet with method POST and a hidden api_key if you prefer zero React hooks.

Free vs Pro delivery?+

Email and WhatsApp via Meta WhatsApp Business API, with spam filtering. Usage is metered in monthly credits.

Does this work with Remix SPA mode?+

Yes - the hook runs on the client. Ensure the form component is only rendered where client JS is available.

More framework guides that use the same FormsReach form API.

Ready to receive form leads?

Create a free API key. Upgrade when you need more monthly credits.

Get started →Docs guide

Set up FormsReach with Remix

Install @formsreach/react

Add a client form component

Render it from a route