Project Structure

A walkthrough of every folder and what lives inside it.

Overview

Next.js 14 App Router. Marketing pages, a protected dashboard, API routes, and the scripts that verify all of it.

Directory structure

whirlwind/
├── app/
│   ├── api/
│   │   ├── stripe/        # create-checkout, create-portal
│   │   ├── webhook/       # stripe, mailchimp
│   │   ├── custom/        # the three AI features: chat, generate-content, create-image
│   │   ├── ai/            # generateText, generateImage (simple examples)
│   │   ├── claim/         # resend the post-purchase magic link
│   │   ├── cron/          # lifecycle emails
│   │   └── health/        # uptime check
│   ├── dashboard/         # protected: overview, features, admin
│   ├── docs/              # this documentation
│   ├── blog/              # blog system
│   ├── auth/              # magic-link confirm + callback
│   ├── success/           # post-checkout page
│   └── page.js            # landing page
│
├── components/
│   ├── layout/            # Header, Footer, ClientLayout
│   ├── marketing/         # landing page sections
│   ├── features/          # AIChat, ContentWriter, ImageStudio
│   ├── ui/                # effect components (GradientText, Reveal, ...)
│   └── providers/         # SupabaseAuthProvider
│
├── lib/
│   ├── ai-client.js       # multi-model AI client, server only
│   ├── auth.js            # server-side user verification
│   ├── rateLimit.js       # Upstash Redis, in-memory fallback
│   ├── supabaseClient.js  # browser Supabase client
│   └── supabase/migrations/   # 001 to 007, numbered SQL
│
├── config/
│   ├── site.js            # name, copy, features, pricing, FAQ
│   └── theme.js           # primary colour, vibe preset, DaisyUI theme
├── config.js              # derived app config (email senders, Crisp)
│
├── scripts/               # setup, doctor, audit, deploy, check-docs
├── tests/e2e/             # Playwright: flows, appearance, smoke
├── CLAUDE.md, AGENTS.md   # contract files for coding agents
└── skills/whirlwind/      # the OpenClaw skill

Files you will touch most

config/site.js: every string on the landing page, plus plans and FAQ. config/theme.js: the look. One vibe key, one primary colour. lib/ai-client.js: the AIClient class. Claude, OpenAI and Gemini behind one interface. app/api/webhook/stripe/route.js: records purchases, sends the claim link, handles refunds and subscription changes. components/features/: copy one of the three AI features to build your own.