aibook-fun/marketing-site

AIBook.fun Marketing Site

Scaffolded for Framer import and Next.js (Cloudflare Pages / DigitalOcean).

Stack

• React 18 + JSX
• Tailwind CSS (v4 with @import)
• shadcn/ui-ready component structure
• SendGrid (email) + Twilio (optional SMS)
• Hosting: Cloudflare Pages / DigitalOcean

Framer Compatibility

These components are standard React + Tailwind. To use in Framer:

1. Copy any .jsx component file.
2. In Framer, add a new Code Component and paste the file contents.
3. Ensure your Framer project has Tailwind CSS configured in settings if classes don't render.
4. Import globals.css or copy Tailwind directives into Framer's CSS settings.

Note: Framer Sites don't run Next.js natively. For a live site with routing (A/B tests, CMS integrations, analytics events), deploy via Next.js on Cloudflare Pages.

Pages scaffolded

• pages/index.jsx — landing (hero, the book, workflows, tiers, FAQ)
• components/Header.jsx
• components/Hero.jsx
• components/Workflows.jsx
• components/Tiers.jsx
• components/FAQ.jsx
• components/Footer.jsx

Key design references (from PRD / Spec)

• Utility-first pitch: "run a workflow today" (A/B test hook ready)
• 6 verticals listed in Workflows
• 3 sample tiers shown ($10 / $47yr / $4,888)
• No NFT/crypto/Web3 language (Kickstarter compliance scrubbed)
• Event tracking only (not content) — PostHog/Cloudflare Analytics slot available