All frameworks
ReactReact

Use NBForms with React

Skip the form-handling boilerplate in your React app. Send a FormData POST to your NBForms endpoint and get instant email alerts, a submissions inbox, and spam protection — without writing a single API route or server function.

Official React docs
React
import { useState } from 'react'

export default function ContactForm() {
  const [status, setStatus] = useState('idle')

  async function handleSubmit(e) {
    e.preventDefault()
    setStatus('sending')
    const res = await fetch('https://api.nbforms.com', {
      method: 'POST',
      body: new FormData(e.target),
    })
    const data = await res.json()
    setStatus(res.ok ? 'success' : 'error')
  }

  if (status === 'success') return <p>Thanks — we'll be in touch!</p>

  return (
    <form onSubmit={handleSubmit}>
      <input type="hidden" name="_token" value="YOUR_TOKEN" />
      <label>Name</label>
      <input type="text" name="name" required />
      <label>Email</label>
      <input type="email" name="email" required />
      <label>Message</label>
      <textarea name="message" required />
      <button type="submit" disabled={status === 'sending'}>
        {status === 'sending' ? 'Sending…' : 'Send'}
      </button>
    </form>
  )
}

Why NBForms?

  • No API routes or server code needed
  • Works with Create React App, Vite, and any React setup
  • Handles loading, success, and error states
  • Compatible with React 18+ and concurrent features

Add to your React app in minutes

Free tier included. No credit card. No backend setup — just copy the snippet above and go.

Get started free