myc0punkz-website/CLOUDFLARE_SETUP.md

Cloudflare Pages Deployment Guide

Static Export Configuration

This project is configured to build as a static export with output: 'export' in next.config.mjs. When you run npm run build, it will generate static files in the /out directory.

Cloudflare Pages Function (Waitlist API)

The waitlist functionality uses a Cloudflare Pages Function located at functions/api/waitlist.ts. This will run serverlessly on Cloudflare's edge network.

Setting up KV Namespace

The waitlist function requires a Cloudflare KV namespace to store emails:

1. In your Cloudflare dashboard, go to Workers & Pages > KV
2. Create a new KV namespace called WAITLIST
3. In your Pages project settings, go to Settings > Functions > KV namespace bindings
4. Add a binding:
   • Variable name: WAITLIST
   • KV namespace: Select the WAITLIST namespace you created

Build Configuration

Cloudflare Pages will automatically detect the Next.js static export. Use these settings:

• Build command: npm run build
• Build output directory: out
• Node version: 18 or higher

Deployment

1. Connect your GitHub repository to Cloudflare Pages
2. Configure the build settings as above
3. Add the KV namespace binding
4. Deploy!

The site will be served statically from the /out directory, and the /api/waitlist endpoint will be handled by the Cloudflare Pages Function.

Alternative: Simple Form Submission

If you prefer not to use Cloudflare KV, you can also use:

• A third-party service like Formspree, Tally, or Airtable
• A simple mailto link or Google Form
• Any webhook service

Simply update the handleSubmit function in components/waitlist-section.tsx to point to your chosen service.