Skip to content

DEPLOY.md

Latest commit

 

History

History
121 lines (82 loc) · 4.25 KB

DEPLOY.md

File metadata and controls

121 lines (82 loc) · 4.25 KB
Raw

Deploy AnimeVocab (Cloudflare)

Two things live on Cloudflare: the marketing site (Pages) and the Pro API (Worker). Both are free at your scale.

Live URLs

Service URL
Marketing site https://animevocab.pages.dev
Pro API (after Worker deploy) https://avc-api.<your-subdomain>.workers.dev

After buying animevocab.com: Cloudflare dashboard → Pages → animevocab → Custom domains → add the domain.

  1. Buy animevocab.com (Cloudflare Registrar is easiest — domain is on Cloudflare automatically).
  2. Create a Cloudflare account if you don't have one.
  3. If you bought the domain elsewhere, add the site in Cloudflare and point your registrar's nameservers to Cloudflare.

One-time: log in from your machine

npx wrangler login

This opens a browser; approve access. After that, an agent (or you) can deploy from this repo.

1. Marketing site → Cloudflare (Next.js on Workers)

The site lives in web/ (Next.js + OpenNext for Cloudflare).

cd web
npm install
npm run dev          # local dev at http://localhost:3000
npm run preview      # test in Workers runtime locally
npm run deploy       # build + deploy to Cloudflare

Or from repo root: npm run deploy:site

Production URL: https://animevocab.com (custom domain on Worker animevocab)

Custom domain: Cloudflare dashboard → Workers & Pages → animevocab → Custom domains → add animevocab.com and www.animevocab.com.

Legacy static HTML is in site/ (deprecated).

2. Pro API → Cloudflare Worker

cd backend
npm install
npx wrangler kv namespace create AVC_KV    # paste id into backend/wrangler.toml
npx wrangler secret put OPENAI_API_KEY
npx wrangler secret put DODO_API_KEY
npm run deploy

Copy the printed URL (e.g. https://avc-api.<subdomain>.workers.dev) into src/config.ts as BACKEND_URL, then npm run build and reload the extension.

Optional: add a custom route in Cloudflare (e.g. api.animevocab.com) → Worker avc-api.

GitHub auto-deploy (recommended)

Pushes to master run .github/workflows/deploy.yml, which deploys:

Job Target Command
Deploy marketing site Cloudflare Worker animevocab (Next.js via OpenNext) npm run deploy in web/
Deploy Pro API Cloudflare Worker avc-api wrangler deploy from backend/

One-time GitHub setup

  1. Create a Cloudflare API token: dash.cloudflare.com/profile/api-tokens → Create Token → Edit Cloudflare Workers template (or custom token with Account → Workers Scripts → Edit, Workers KV Storage → Edit, Cloudflare Pages → Edit).
  2. Add it to GitHub: repo Settings → Secrets and variables → Actions → New repository secret
    • Name: CLOUDFLARE_API_TOKEN
    • Value: your token
  3. Disable duplicate Cloudflare Git builds (they cause the red “Workers Builds: avc-api” check and wrong root directory):
    • Cloudflare dashboard → Workers & Pages → avc-api → Settings → Builds → disconnect Git / disable automatic builds
    • If Pages is also connected to Git separately, disconnect that too — the GitHub Action handles both deploys.

After the secret is set, merge to master and watch Actions → Deploy.

Manual deploy (fallback)

npm run deploy:site   # marketing site → Pages
npm run deploy:api    # Pro API → Worker avc-api

GitHub auto-deploy (legacy Cloudflare dashboard)

Cloudflare Pages Git integration only (site)

Connect the repo in Cloudflare Pages (Workers & Pages → Create → Connect to Git). Settings:

Setting Value
Build command (empty)
Build output directory site
Root directory /

Prefer the GitHub Action above so the API deploys on the same merge.

Checklist after domain is live

  • https://animevocab.com loads the landing page
  • https://animevocab.com/privacy.html loads (Chrome Web Store needs this URL in the listing)
  • Worker deployed; BACKEND_URL in src/config.ts updated
  • Add og.png (1200×630) to site/ for social previews