No surprises

The setup, in full.

This is every step between buying and taking payments — the same guide that ships inside the download. This page runs on the code you'd be buying.

You'll need

A Stripe account (free, takes a few minutes to open)
A Vercel account (free tier is plenty)
Node.js 22 — only if you want to test locally before deploying

1. Buy and download

Checkout takes under a minute. Your payment is verified with Stripe and the download unlocks immediately — start here.

2. Unzip and install

unzip pagemage-starter.zip && cd pagemage-starter
npm install

3. Create your product in Stripe

In the Stripe dashboard, open Product catalog and create a product with a one-time price — or a recurring price if you'd rather sell a subscription (the checkout detects it automatically). Copy the Price ID; it looks like price_.... Payments go straight to your account.

4. Add your keys

For deployment, add these in Vercel → your project → Settings → Environment Variables. For local testing, put the same values in a .env.local file.

Variable	Required	What it does
STRIPE_RESTRICTED_KEY	Yes (or secret key)	Restricted live key with Prices read + Checkout Sessions write
STRIPE_PRICE_ID	Yes	The price you're selling
SITE_URL	Yes	Your domain — used for checkout redirects
STRIPE_PRICE_ID_PRO	Optional	Adds a second tier to the pricing section automatically

5. Test locally (optional)

npx vercel dev

Visit localhost:3000, press the checkout button, and pay with Stripe's test card 4242 4242 4242 4242 — any future expiry, any CVC. You'll land on the download page with the verified-delivery flow running for real.

6. Deploy

npx vercel --prod

That's the whole deployment. Security headers are already configured in vercel.json, and the product archive ships inside the delivery function, so it's never publicly downloadable.

7. Go-live checklist

Swap test keys for live keys in Vercel and redeploy
Set SITE_URL to your real domain
Make one real purchase on your own card and refund yourself — you just tested your entire funnel
Save your download page link; it always serves the latest version

Troubleshooting

"Checkout is not configured yet." — the environment variables are missing, mistyped, or you haven't redeployed since adding them. Check the exact names: STRIPE_RESTRICTED_KEY (or STRIPE_SECRET_KEY), STRIPE_PRICE_ID, SITE_URL.
Pricing shows "See checkout" instead of an amount. — the key lacks Prices read permission or the price is inactive; the pricing endpoint returns an empty list and the page falls back gracefully.
"Payment for this session hasn't completed." — the checkout session and the API keys come from different Stripe modes (test vs live). Use matching keys.
404 on /api/… locally. — serve through npx vercel dev, not a plain static server, so the functions run.

Stuck?

Email hello@pagemage.tech — setup questions usually get a same-day answer.

Get Pagemage