AdFlow

Launch coordinated ad campaigns across SEO, Meta, Google, and YouTube from a single form.

What it does

Take these five inputs:

1. Website URL + short product description
2. Creatives (hosted image / video URLs — swap in Vercel Blob for real uploads)
3. Audience (age, gender, countries, interests)
4. Budget (daily)
5. Duration (days)

AdFlow fans the campaign out to every channel you pick:

Channel	What gets launched
SEO	AI-generated keyword targets, Google Search Console registration, on-page recommendations
Meta Ads	Facebook + Instagram campaign, ad set with audience targeting, creative rotation
Google Ads	Performance Max campaign with daily budget and targeted locations
YouTube Ads	Video ads via Google Ads VIDEO channel (creates video asset from URL)

Stack

• Next.js 16 (App Router) + React 19 + TypeScript
• Tailwind CSS 4 (dark liquid-glass UI)
• Zod for input validation
• Vercel AI Gateway for keyword + ad copy generation
• Server Actions + Fluid Compute for the launch orchestrator

Quick start

npm install
cp .env.example .env.local    # fill in keys you want active
npm run dev                    # http://localhost:3000

You can demo with zero credentials — the store keeps campaigns in memory and every integration gracefully returns "failed": "credentials not configured" until you wire real keys.

Getting real launches

Fill in .env.local progressively — the orchestrator runs whatever is configured and skips the rest:

Meta Ads

1. Create a Meta App at https://developers.facebook.com/apps
2. Generate a long-lived System User Access Token with ads_management scope
3. Set META_ACCESS_TOKEN, META_AD_ACCOUNT_ID (without act_), META_PAGE_ID

Google Ads + YouTube Ads

1. Request a Google Ads developer token (https://ads.google.com/aw/apicenter)
2. Create OAuth2 credentials (Desktop app type)
3. Run the refresh-token script, or use Google's OAuth playground with https://www.googleapis.com/auth/adwords
4. Fill in GOOGLE_ADS_* env vars

Search Console (SEO)

1. Create a Service Account or OAuth2 client with webmasters scope
2. Add the service account email as an owner of the verified property
3. Fill in GSC_* env vars

Vercel AI Gateway (for keyword generation)

1. In the Vercel dashboard → AI → Gateway, create a key
2. Set AI_GATEWAY_API_KEY

Deploy to Vercel

vercel link
vercel env pull .env.local
vercel deploy --prod

Vercel will pick up next.config.ts and run this as a standard Next.js app on Fluid Compute.

Architecture

app/
├── page.tsx                     # Landing
├── campaigns/
│   ├── page.tsx                 # List
│   ├── new/page.tsx             # Create form
│   ├── [id]/page.tsx            # Detail dashboard
│   └── actions.ts               # Server Action (createCampaignAction)
lib/
├── types.ts                     # Campaign / Audience / Creative types
├── store.ts                     # In-memory store (swap for Neon Postgres)
├── orchestrator.ts              # Fan-out launcher (parallel)
└── integrations/
    ├── meta.ts
    ├── google-ads.ts
    ├── youtube-ads.ts
    └── seo.ts

Swap in a real database

The lib/store.ts module is a single file — replace its exports with Neon Postgres (via Vercel Marketplace) or any other database. The rest of the app just calls listCampaigns, getCampaign, saveCampaign, updateCampaign.

Roadmap

• Vercel Blob upload for creatives (drag-and-drop multi-file)
• Vercel Queues for long-running launches (currently fire-and-forget)
• Pause / resume / budget update from the detail page
• Real-time metrics pull from each platform's reporting API
• AI-generated ad copy variants using the Gateway
• Analytics dashboard with ROAS, CPA, and channel breakdown

License

MIT