#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
- Click Use this template on the GitHub repository page.
- Name your new repository and create it.
- Clone the created repository locally.
#Project Setup
-
Install dependencies:
yarn install -
Copy
.env.local.exampleto.env.localand 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 -
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-generatescript.
- Update product assets in
-
Set up MCPs (optional but recommended):
- Pabal MCP: Follow the Configure Credentials guide; run
apps-initif you already have store data. - Pabal Web MCP: Run
init-projectto automatically generate public data.
- Pabal MCP: Follow the Configure Credentials guide; run
#Build and Deploy
- Build a static export to
out/:yarn build - Preview the built site locally:
yarn start - Deploy to Vercel: ensure
yarn buildoutput isout/, setNEXT_PUBLIC_SITE_URL, and addGOOGLE_INDEXING_URLif 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
- Get your verification code from Google Search Console.
- Add it to
.env.local:NEXT_PUBLIC_GOOGLE_SITE_VERIFICATION=your_verification_code_here - The
seo:index-googlescript uses this value when submitting URLs.
#Sync With the Template
- Add the template repository as upstream (one-time):
git remote add upstream https://github.com/quartz-labs-dev/pabal-web.git - Fetch updates:
git fetch upstream - Merge or rebase:
git merge upstream/main --allow-unrelated-histories # or git rebase upstream/main --allow-unrelated-histories - Push to your origin:
git push origin main