Deployment

The boilerplate works out of the box on Vercel: import the repo, set the environment variables from .env.example, and deploy. Any Node host that supports Next.js 14 works too. The store is quote-based by default — Stripe payments, Resend emails, and the SQL backends are all optional and env-gated, so a first deploy needs nothing more than your Firebase web credentials and a sign-in redirect URL.

Deploy to Vercel

NEXT_PUBLIC_EMAIL_SIGNIN_REDIRECT_URL=https://shop.example.com/complete-login

The Stripe webhook needs a service account

Stripe order recording happens server-side with the Firebase Admin SDK, which needs privileged credentials that the browser never sees. On Vercel the convenient option is FIREBASE_SERVICE_ACCOUNT_JSON — paste the service-account key's JSON contents (not a file path) directly into the environment variable:

FIREBASE_SERVICE_ACCOUNT_JSON={"type":"service_account","project_id":"your-project", ... }

The same admin credentials also power the npm run seed demo-data script — see Demo data. Note the SQL backends require FIREBASE_SERVICE_ACCOUNT* too, because Firebase Auth stays the identity provider and its ID tokens are verified server-side.

Configure images for your CDN

Product images (primaryImageURL) render through next/image, so every host they can be served from must be listed in images.remotePatterns in next.config.mjs. The default config already allows Firebase Storage and the demo photography host:

images: {
  remotePatterns: [
    {
      protocol: "https",
      hostname: "firebasestorage.googleapis.com",
    },
    {
      // Editorial/lifestyle photography used by the storefront sections.
      protocol: "https",
      hostname: "picsum.photos",
    },
  ],
},

If you serve product images from your own CDN or storage bucket, add its hostname here before deploying, or next/image will refuse to optimize those URLs. Uploads to Firebase Storage work with no change — firebasestorage.googleapis.com is already allowed.

Continuous integration

A ready-made GitHub Actions workflow lives at docs/ci.example.yml. It runs on pushes to main and on every pull request, and executes lint → typecheck → test → build on Node 20:

- name: Lint
  run: npm run lint

- name: Typecheck
  run: npm run typecheck

- name: Test
  run: npm test

- name: Build
  run: npm run build
  # No env needed: src/lib/firebase/config.ts falls back to demo
  # values so the SDK initializes during prerender without credentials.

Activate it by copying it into the workflows directory (it ships outside .github/workflows/ because automated pushes can't create workflow files without extra permissions):

mkdir -p .github/workflows && cp docs/ci.example.yml .github/workflows/ci.yml

The build step needs no environment variables — the Firebase config's demo-value fallback lets the SDK initialize during prerender. And because the optional SQL packages are external, the default build never requires @prisma/client, pg, or a DATABASE_URL.

Production readiness

Related