Skip to content
BuildBase

Add usage credits to a Replit app (React and Express, BuildBase sign-in)

One prompt that gives each workspace in a Replit Agent app a credit balance, a Buy credits button and a server-side spend, plus where the secret lives.

Replit can also connect to BuildBase itself while it builds: Use BuildBase in Replit.

Each workspace gets a credit balance, a Buy credits button that opens the credit store, and a spend that runs in an Express route, so a person cannot skip it from the browser. This page assumes the app already signs people in with @buildbase/sdk, as the Replit guide sets up. If it signs people in with something else, such as Supabase or Clerk, read keep your existing sign-in first.

Before you start

Stripe connected and a credit package on sale in the console, under Billing > Credit packages (Credits and usage).

The prompt

Open in Replit

The link opens Replit Agent with the prompt filled in, for a new app; you still send it yourself. For the app you already have, paste the prompt into Agent's chat in that project instead.

This app signs people in with BuildBase (@buildbase/sdk), set up as https://www.buildbase.app/guides/add-login-teams-and-paid-plans-to-a-replit-app shows. If it does not, stop and tell me.
Read https://docs.buildbase.app/credits/overview.md first and do not invent endpoints.
Add usage credits per workspace:
- In the header, show useCreditBalance(currentWorkspace._id).balance?.available, with currentWorkspace from useSaaSWorkspaces(), and a Buy credits button that calls openCreditStore() from useSaaSAuth().
- Spend on the server only: add POST /api/credits/spend to the Express server, mounted before the Vite middleware and any catch-all route. It calls bbFor(req).credits.consume(workspaceId, { amount, description, idempotencyKey }) from server/buildbase.ts before the paid work runs. On the error code INSUFFICIENT_CREDITS answer 402, and open the credit store in the page.
Do not store balances in Replit Database.

Where the secrets go

This job adds no new secret. The spend uses the signed-in person's session cookie, bb-session-id. BUILDBASE_CLIENT_SECRET stays where the guide put it, twice: in the Secrets tool (Tools > Secrets), and under Publishing > Adjust settings > Production app secrets for the published app. Never give it a VITE_ prefix. Your Stripe keys go into the BuildBase console, not into Replit.

The Replit trap

A route mounted after the Vite middleware or Agent's catch-all never runs: /api/credits/spend answers the app's HTML instead of JSON. Move the route above them in server/index.ts, where the guide mounts the sign-in routes.

Agent reads replit.md before every request. If the guide's two lines about BuildBase are missing from it, add them back, or a later request may keep balances in Replit Database.

Full guides