#Pabal Web Template

Documentation for using the Pabal Web static site template.

#Overview

  • Next.js 16 (App Router) static export
  • Node.js LTS 18+ and Yarn (use the bundled yarn.lock)
  • User-facing data lives in public/; app code rarely needs changes

#Use This Template

  1. Click Use this template on the GitHub repository page.
  2. Name your new repository and create it.
  3. Clone the created repository locally.

#Project Setup

  1. Install dependencies:

    yarn install
    
  2. Copy .env.local.example to .env.local and set values:

    NEXT_PUBLIC_SITE_URL=http://localhost:3000
    GOOGLE_INDEXING_URL=https://labs.quartz.best
    NEXT_PUBLIC_GOOGLE_SITE_VERIFICATION=YOUR_GOOGLE_SITE_VERIFICATION_CODE_HERE
    
  3. Copy example assets:

    cp -r examples/public/* public/
    
    • Update product assets in public/products/[slug]/ (config, locales, screenshots, icons).
    • Update developer/organization info in public/site/.
    • OG images are generated automatically by the web:og-generate script.
  4. Set up MCPs (optional but recommended):

    • Pabal MCP: Follow the Configure Credentials guide; run apps-init if you already have store data.
    • Pabal Web MCP: Run init-project to automatically generate public data.

#Build and Deploy

  • Build a static export to out/:
    yarn build
    
  • Preview the built site locally:
    yarn start
    
  • Deploy to Vercel: ensure yarn build output is out/, set NEXT_PUBLIC_SITE_URL, and add GOOGLE_INDEXING_URL if you need indexing.
  • Deploy to other static hosts (S3/CloudFront, Netlify, etc.) by uploading out/.
  • After deployment, verify routes:
    • /{product}
    • /{product}/privacy-policy
    • /{product}/terms-of-use

#Google Site Verification

  1. Get your verification code from Google Search Console.
  2. Add it to .env.local:
    NEXT_PUBLIC_GOOGLE_SITE_VERIFICATION=your_verification_code_here
    
  3. The seo:index-google script uses this value when submitting URLs.

#Sync With the Template

  1. Add the template repository as upstream (one-time):
    git remote add upstream https://github.com/quartz-labs-dev/pabal-web.git
    
  2. Fetch updates:
    git fetch upstream
    
  3. Merge or rebase:
    git merge upstream/main --allow-unrelated-histories
    # or
    git rebase upstream/main --allow-unrelated-histories
    
  4. Push to your origin:
    git push origin main