Spike - Form Backend for Developers

Modern React has made form handling much simpler. Here are the patterns we recommend.

Controlled vs Uncontrolled

For simple forms, uncontrolled inputs with FormData work great:

tsx

function ContactForm() {
  const handleSubmit = async (e: FormEvent) => {
    e.preventDefault();
    const data = new FormData(e.currentTarget);
    await fetch('/api/contact', { method: 'POST', body: data });
  };
  
  return <form onSubmit={handleSubmit}>...</form>;
}

Server Actions (Next.js)

With Next.js App Router, you can use server actions:

tsx

async function submitForm(formData: FormData) {
  'use server';
  // Handle submission server-side
}

Form Libraries

For complex forms with validation, consider: - React Hook Form - Formik - Conform

With Spike

The simplest approach - just point to our endpoint:

tsx

<form action="https://spike.ac/api/f/ID" method="POST">
  ...
</form>
```