Claude-generated alpha starter

Capture More Leads, Own Your Data

A simple, GDPR-compliant lead form that connects directly to your existing Zapier workflows. No expensive subscriptions, no vendor lock-in.

A lightweight, GDPR-compliant lead capture form system for B2B SaaS businesses that collects prospect data and forwards it via webhook to existing automation tools like Zapier.

Start Collecting Leads View project contract

Feature

Smart Lead Form

Clean, mobile-responsive form with configurable fields for company name, email, phone, and custom questions relevant to B2B prospects.

Feature

GDPR Consent Tracking

Explicit consent checkbox with timestamped records, supporting EU compliance requirements for data collection and processing.

Feature

Zapier Webhook Integration

Automatic webhook dispatch on every submission, sending lead data directly to your existing Zapier automation workflows.

Feature

SendGrid Confirmation Emails

Optional confirmation email sent to leads upon submission, confirming receipt and setting expectations.

Feature

Admin Lead Dashboard

Password-protected dashboard showing recent submissions, daily/weekly counts, and submission success rates.

Feature

Data Export & Deletion

Admin endpoints to export all data for a specific lead or delete their record entirely for GDPR subject requests.

Architecture

Next.js 15 App Router application with a public-facing lead capture form and minimal admin dashboard. Form submissions are stored in a Vercel Postgres database with GDPR consent tracking. On successful submission, a webhook fires to the configured Zapier endpoint. SendGrid handles confirmation emails to leads. The app uses Server Actions for form processing and API routes for webhook delivery and admin data access. All EU user data includes explicit consent timestamps and supports data export/deletion requests for GDPR compliance.

Core components

Public lead capture form with customizable fieldsGDPR consent checkbox with timestamp loggingWebhook dispatcher to Zapier on form submissionSendGrid integration for lead confirmation emailsAdmin dashboard showing recent leads and basic statsData export endpoint for GDPR subject access requestsRate limiting middleware to prevent spam submissions

Timeline

Foundation Setup

Initialize Next.js 15 project, configure Vercel Postgres, set up environment variables and basic layout components.

Lead Form Implementation

Build the public lead capture form with validation, GDPR consent field, and Server Action for database storage.

Webhook & Email Integration

Implement Zapier webhook dispatcher and SendGrid confirmation email on successful form submission.

Admin Dashboard

Create protected admin route with lead listing, basic analytics, and data export/delete functionality.

Polish & Deploy

Add rate limiting, error handling, mobile responsiveness testing, and deploy to Vercel production.

API surface

POST /api/leads

Receives form submission, stores lead in database, triggers webhook and confirmation email

GET /api/leads

Admin-only endpoint returning paginated list of captured leads with filters

GET /api/leads/[id]/export

Returns all stored data for a specific lead (GDPR data subject access)

DELETE /api/leads/[id]

Permanently deletes a lead record (GDPR right to erasure)

GET /api/stats

Returns submission counts and success rates for admin dashboard

POST /api/webhook/test

Admin utility to test webhook connectivity to configured Zapier endpoint

Data model

Lead

id: uuidemail: stringcompanyName: stringcontactName: stringphone: string (optional)message: string (optional)gdprConsent: booleangdprConsentTimestamp: datetimeipCountry: string (optional)source: string (optional)webhookDelivered: booleanemailSent: booleancreatedAt: datetime

WebhookLog

id: uuidleadId: uuid (foreign key)endpoint: stringstatusCode: numberresponseBody: string (optional)attemptedAt: datetime

AdminUser

id: uuidemail: stringpasswordHash: stringcreatedAt: datetime

Setup

1. Clone repository and run npm install 2. Create Vercel Postgres database from Vercel dashboard and copy DATABASE_URL 3. Set up SendGrid account, verify sender email, and copy API key 4. Create Zapier webhook trigger and copy the webhook URL 5. Generate admin password hash: node -e "console.log(require('bcryptjs').hashSync('yourpassword', 12))" 6. Create .env.local with all required environment variables 7. Run npx prisma db push to initialize database schema 8. Run npm run dev to test locally 9. Deploy to Vercel and add all environment variables in project settings 10. Test form submission and verify webhook delivery in Zapier

Operator notes

• Deploy to Vercel with Vercel Postgres addon enabled from the dashboard

• Generate ADMIN_PASSWORD_HASH using bcrypt before deployment (cost factor 12 recommended)

• Verify SendGrid sender email before going live to avoid delivery issues

• Test Zapier webhook with /api/webhook/test endpoint before launching publicly

• Consider adding Vercel Edge Config for rate limit settings in production

• Form includes honeypot field for basic bot detection; monitor for spam patterns

• GDPR consent records are immutable; deletion removes lead data but preserves anonymized consent log for compliance audit

Suggested env vars

DATABASE_URL

Vercel Postgres connection string for storing leads and webhook logs

ZAPIER_WEBHOOK_URL

Your Zapier webhook endpoint URL that receives lead data on form submission

SENDGRID_API_KEY

SendGrid API key for sending confirmation emails to leads

SENDGRID_FROM_EMAIL

Verified sender email address for SendGrid confirmation emails

ADMIN_PASSWORD_HASH

Bcrypt hash of admin dashboard password for authentication

ADMIN_EMAIL

Admin user email for dashboard login

NEXT_PUBLIC_SITE_URL

Public URL of deployed site, used in confirmation emails

FAQ

How does the Zapier integration work?

When a lead submits the form, the app immediately sends a POST request to your configured Zapier webhook URL with all lead data as JSON. Your Zap can then route it to your CRM, spreadsheet, or other tools.

Is this GDPR compliant?

The form includes an explicit consent checkbox that must be checked before submission. We store the exact timestamp of consent and provide endpoints to export or delete any individual's data on request.

Can I customize the form fields?

The alpha includes standard B2B fields (company, name, email, phone, message). Field customization can be added in a future iteration based on your specific needs.

What happens if the webhook fails?

Failed webhook attempts are logged with status codes. The lead data is still safely stored in your database, and you can retry or manually export it from the admin dashboard.

How do I access the admin dashboard?

Navigate to /admin and log in with the credentials you set during deployment. The dashboard is password-protected and not publicly accessible.