Karaoke

Deployment

  1. Push your project to a GitHub repository.

  2. Go to Cloudflare Pages and click “Create a project”, then “Connect to Git”. Select your repository.

  3. Configure build settings:

    • Build command: npm run build
    • Build output directory: dist
    • Node.js version: 22

  4. Add repository secrets. In your GitHub repository, go to Settings → Secrets and variables → Actions, and add:

    • CLOUDFLARE_API_TOKEN — your Cloudflare API token with Pages edit permissions
    • CLOUDFLARE_ACCOUNT_ID — your Cloudflare account ID

  5. Deploy. Click “Save and Deploy”. Cloudflare Pages will build and deploy your site.

After the first deploy, every push to main triggers a rebuild and redeploy automatically.

What happens on each push to main

The included .github/workflows/deploy.yml runs a single job on every push to main:

  1. Install dependencies with pnpm install --frozen-lockfile
  2. Build the site with pnpm build
  3. Run the privacy gate: node scripts/assert-privacy.js dist
  4. Deploy to Cloudflare Pages via wrangler

On pull requests, steps 1–3 run but step 4 is skipped — builds are validated without deploying.

Privacy gate

The assert-privacy step scans every file in dist/ and fails the build if any content without publish: true in its frontmatter made it into the output. This is a hard safety net: if a private note accidentally passes the content filter, CI catches it before the deploy reaches production.

If the privacy check fails, check that the note causing the failure has publish: false or no publish field in its frontmatter, and that your Astro content filter is correctly excluding unpublished entries.

Custom domain

  1. In Cloudflare Pages, go to your project → Custom domains → Add a domain. Follow the DNS setup instructions.

  2. Update site: in astro.config.mjs to match your domain:

export default defineConfig({
  site: 'https://your-domain.com',
  // ...
});

The site value is used by the SEO module for canonical URLs, OG tags, and sitemap generation. Set it before your first production deploy.

Alternative platforms

Any static hosting platform that supports Node.js 22 and a build step will work. The build command and output directory are the same everywhere:

  • Build command: npm run build
  • Output directory: dist/

Netlify: Create a new site from Git, set the build command to npm run build and the publish directory to dist. Set the Node version to 22 in Site settings → Build & deploy → Environment.

Vercel: Import the repository, set the framework preset to “Astro” (or configure manually with the same build command and output directory). Vercel auto-detects the Node version from .nvmrc or package.json engines.

Note: the privacy gate in deploy.yml only runs in GitHub Actions. If you deploy from Netlify or Vercel directly without GitHub Actions, run node scripts/assert-privacy.js dist as part of your build command to keep the privacy check active:

npm run build && node scripts/assert-privacy.js dist