Vercel Integration Guide
Complete guide to integrate MyFormConnect with Vercel
Setup time: 5-10 minutes
Difficulty: Easy
Compatible versions: Static sites, Next.js, and other frameworks on Vercel
Deploy a static or Next.js site on Vercel and collect submissions with MyFormConnect. Use a plain HTML form POST, or fetch for SPA-style submissions.
Prerequisites
- A MyFormConnect account - Sign up here
- A form created in your MyFormConnect dashboard with its UUID copied
- A project deployed (or ready to deploy) on Vercel
Integration Methods
HTML Form or Fetch (Recommended)
5 minutes
Easy
Point a form at MyFormConnect in any page you deploy to Vercel. Works for plain HTML and React/Next components.
1
Copy your form UUID
Get your form UUID from the MyFormConnect dashboard.
- Log in to your MyFormConnect dashboard
- Open the form you want to use
- Copy the form UUID (e.g.
550e8400-e29b-41d4-a716-446655440000)
2
Add the form to your page
Use a standard HTML form in a static page, or the same markup inside a Next.js component.
- Replace
YOUR_FORM_UUIDwith your form UUID - Commit and push, or deploy with the Vercel CLI / dashboard
<form action="https://myformconnect.io/f/YOUR_FORM_UUID" method="POST" data-mfc="true">
<label for="name">Name *</label>
<input type="text" id="name" name="name" required>
<label for="email">Email *</label>
<input type="email" id="email" name="email" required>
<label for="message">Message</label>
<textarea id="message" name="message" rows="4"></textarea>
<button type="submit">Send Message</button>
</form>
<script src="https://myformconnect.io/loader.js" data-client-id="YOUR_FORM_UUID"></script>Important Note
loader.js is optional. Without it, the browser does a normal HTML POST.
3
Optional: submit with fetch
For SPAs or custom UI, post FormData (or JSON) to the same endpoint.
<script>
async function submitForm(event) {
event.preventDefault();
const form = event.target;
const res = await fetch('https://myformconnect.io/f/YOUR_FORM_UUID', {
method: 'POST',
body: new FormData(form),
headers: { 'Accept': 'application/json' }
});
if (res.ok) {
form.reset();
alert('Thanks! We received your message.');
} else {
alert('Something went wrong. Please try again.');
}
}
</script>
<form onsubmit="submitForm(event)">
<input type="text" name="name" required>
<input type="email" name="email" required>
<textarea name="message"></textarea>
<button type="submit">Send</button>
</form>Important Note
Replace
YOUR_FORM_UUID. Field names become lead fields in MyFormConnect.
4
Test on your Vercel URL
Verify submissions after deploy.
- Open your Vercel deployment URL
- Submit a test entry
- Check MyFormConnect dashboard under Leads
Related Integrations
References & Official Documentation
Next Steps
Configure MyFormConnect
- Set up your timezone
- Configure lead notifications
- Set up advanced spam detection
- Add team members to your account
Advanced Features
- Use our custom form templates
- Try AI Insights for Leads
- Integrate with your CRM
- Set up automated workflows