Feature
Smart Form Validation
Real-time client-side validation with server-side verification ensures clean data with proper email formats and required fields.
Claude-generated alpha starter
Capture Quality Leads Without the Bloat
A fast, GDPR-compliant lead form that connects directly to your existing SendGrid and Zapier workflows. No expensive subscriptions, no complexity.
A lightweight, GDPR-compliant lead capture form system for B2B SaaS businesses that collects clean prospect data and forwards submissions to SendGrid and Zapier webhooks.
Feature
GDPR Consent Tracking
Explicit consent checkbox with timestamp recording, plus endpoints for data export and deletion requests.
Feature
SendGrid Contact Sync
New leads are automatically added to your SendGrid contact list for future communications.
Feature
Zapier Webhook Integration
Each submission triggers your Zapier webhook, enabling custom automation workflows.
Feature
Bounce-Resistant Design
Fast-loading, mobile-optimized form with clear CTAs and minimal friction to reduce abandonment.
Feature
Lead Data Export
Admin endpoint to export all leads as JSON or CSV for analysis and CRM import.
Architecture
Next.js 15 App Router application with server-side form handling. The public-facing form renders as a single responsive page with client-side validation. Form submissions POST to an API route that validates input, stores leads in a lightweight database (Vercel Postgres or JSON file for alpha), triggers a SendGrid contact list addition, and fires a Zapier webhook. GDPR compliance is handled via explicit consent checkboxes, data export endpoint, and deletion endpoint. No authentication required for form submission; admin routes are protected by a simple API key for the alpha phase.
Core components
Public lead capture form with real-time validationGDPR consent management with checkbox and timestampAPI route for form submission processingSendGrid integration for contact list syncZapier webhook trigger on new leadAdmin API for lead export and deletionThank-you confirmation page with redirect option
Timeline
Foundation Setup
Initialize Next.js 15 project, configure TypeScript, set up Vercel Postgres connection, establish environment variables.
Form Implementation
Build responsive lead capture form component with client-side validation, consent checkbox, and loading states.
API Development
Create submission endpoint with server validation, database storage, SendGrid integration, and Zapier webhook.
GDPR Compliance
Implement consent recording, data export endpoint, and deletion endpoint for EU user requests.
Admin & Polish
Add protected admin endpoints, thank-you page, error handling, and production deployment to Vercel.
API surface
POST /api/leads
Receives form submissions, validates data, stores lead, syncs to SendGrid, triggers Zapier webhook
GET /api/leads
Admin-protected endpoint to retrieve all leads with optional date filtering
GET /api/leads/export
Admin-protected endpoint to export leads as CSV or JSON format
POST /api/leads/delete
GDPR deletion endpoint to remove a specific lead by email address
GET /api/leads/lookup
GDPR data export endpoint to retrieve all data for a specific email address
GET /api/health
Health check endpoint for monitoring deployment status
Data model
Lead
id: string (uuid)email: stringfullName: stringcompany: stringjobTitle: string (optional)message: string (optional)gdprConsent: booleanconsentTimestamp: datetimeipCountry: string (optional, for EU detection)source: string (utm or referrer)createdAt: datetime
WebhookLog
id: string (uuid)leadId: string (foreign key)destination: string (sendgrid or zapier)status: string (success or failed)responseCode: numbercreatedAt: datetime
Setup
1. Clone repository and run npm install 2. Create Vercel project and enable Vercel Postgres addon 3. Copy .env.example to .env.local and fill in all required variables 4. Create SendGrid contact list and copy the list ID 5. Set up Zapier webhook and copy the URL 6. Run npx prisma db push to initialize database schema 7. Run npm run dev to test locally 8. Deploy to Vercel via git push or vercel deploy 9. Verify health endpoint returns 200 10. Submit test lead and confirm SendGrid and Zapier receive data
Operator notes
• Deploy to Vercel with Vercel Postgres addon enabled for zero-config database
• SendGrid contact list must be created manually before deployment; use the list ID in env vars
• Test Zapier webhook with a sample payload matching the Lead entity structure before going live
• For GDPR compliance, ensure privacy policy link is updated in the form component before EU launch
• Admin endpoints use bearer token auth with ADMIN_API_KEY; rotate this key periodically
• Monitor webhook logs table for failed deliveries; implement retry logic post-alpha if needed
• Form includes honeypot field for basic spam prevention; consider adding rate limiting for production
Suggested env vars
DATABASE_URL
Vercel Postgres connection string for lead storage
SENDGRID_API_KEY
SendGrid API key for adding contacts to your list
SENDGRID_LIST_ID
SendGrid contact list ID where leads are added
ZAPIER_WEBHOOK_URL
Your Zapier webhook URL to trigger on new submissions
ADMIN_API_KEY
Simple API key to protect admin endpoints
NEXT_PUBLIC_FORM_TITLE
Customizable form headline displayed to users
NEXT_PUBLIC_REDIRECT_URL
Optional URL to redirect users after successful submission
FAQ
How does GDPR compliance work?
Every submission requires explicit consent via checkbox. The consent timestamp is recorded. Users can request their data via the lookup endpoint or request deletion via the delete endpoint.
What happens when a lead submits the form?
The data is validated, stored in the database, added to your SendGrid contact list, and sent to your Zapier webhook—all in a single request.
Can I customize the form fields?
The alpha includes standard B2B fields (name, email, company, job title, message). Field customization can be added in future iterations.
How do I access collected leads?
Use the admin API endpoints with your API key to retrieve, export, or manage leads. CSV export is available for CRM import.
What if SendGrid or Zapier is down?
Submissions are always stored locally first. Webhook failures are logged and can be retried manually via the admin interface.