ShapKit docs

After-purchase playbook

From downloading the signed archive in the dashboard: local boot, first walkthrough, building features, payments, Cloudflare deploy, and pre-commit gates. Runtime baseline is React Router + Cloudflare Workers.

1. Get the source

After checkout and fulfillment we issue a License. Primary delivery is a signed archive from the dashboard — no waiting on a repo invite.

  1. Sign in and open Dashboard → Source delivery.
  2. Pick a release, create a download ticket, and download the signed archive.
  3. Unpack locally, enter the project root, and prepare env files.

2. Run locally

You need Node.js ≥ 22 and pnpm 9 (corepack enable recommended). Local DB defaults to D1.

  1. Install deps: pnpm install.
  2. Copy .env.example → .env.local; Workers secrets go in .dev.vars. Fill at least AUTH_SECRET, NEXT_PUBLIC_APP_URL, DATABASE_PROVIDER=d1.
  3. Preflight and migrate: pnpm doctor, then pnpm db:migrate:d1:local.
  4. Start: pnpm dev and open the local URL (often http://localhost:5173).
pnpm install
cp .env.example .env.local
pnpm doctor
pnpm db:migrate:d1:local
pnpm dev

3. First walkthrough

Confirm auth and the dashboard first. Test payments are optional and should not block local product work.

  1. Register at /en/register (or /zh/register) and land on /dashboard.
  2. Check Billing, Usage, Source delivery, and Organization entry points.
  3. (Optional) Configure Stripe/Creem Test, buy once on /en/pricing, then verify fulfillment on /dashboard/billing.
  4. Platform admins can open /en/admin (seed / platformRole=admin) and check config readiness.

4. Build product features

New product domains default to src/modules/{domain}/. Pages live under Marketing/Admin /:locale or Dashboard /dashboard/*. Prefer Agent Skills over ad-hoc scattered code.

  1. New UI: tell the agent shape screen (shape-screen).
  2. New backend module: shape service (product code → src/modules/).
  3. Schema changes: shape migrate — additive Drizzle sqlite migrations only; never hand-edit production DBs.

5. Wire payments

Primary SKUs are Pro / Duo one-time lifetime. Keep channel secrets and Price mappings in Admin config — do not scatter Stripe SDK calls in product code.

  1. Fill Stripe / Creem / PayPal keys and webhooks in Admin → Config.
  2. Map Pro and Duo Price IDs in commerce mappings and Sync.
  3. Tell the agent shape payments; indie builders can prefer Creem.

6. Deploy to Cloudflare

Default ship path is React Router + wrangler (Workers). Production deploys require your explicit confirmation — agents must not run wrangler deploy on their own.

  1. Say shape ship cf / shape-cloudflare for preflight and build.
  2. Confirm env and D1 / R2 bindings, then approve production deploy.
  3. Review the three Ship reports and use Deploy Diagnostics if needed.
# Only after you explicitly confirm
# pnpm cf:deploy or wrangler deploy

7. Link Skills and run gates

Symlink the official Skill Suite into Cursor / Claude Code, then run gates before every commit.

  1. From the repo root: pnpm skills:link.
  2. Before commit: pnpm run shape:guard.
  3. Before merge/tag: pnpm run shape:release (includes locale). See the Agent Skills page.
pnpm skills:link
pnpm run shape:guard
pnpm run shape:release:locale