TanStack Start
This guide shows you how to use Prisma ORM in a TanStack Start app. You scaffold a project where a server function queries your database and a route loader feeds it to the page, initialize the schema, see your data, and deploy the app to Prisma Compute.
Every command below was run end to end against a live Prisma Postgres database.
One command scaffolds the project with Prisma ORM wired in:
bun create prisma@latest my-app --template tanstack-start --provider postgres --no-deploypnpm create prisma@latest my-app --template tanstack-start --provider postgres --no-deployyarn create prisma@latest my-app --template tanstack-start --provider postgres --no-deploynpm create prisma@latest -- my-app --template tanstack-start --provider postgres --no-deployAnswer the prompts, then export DATABASE_URL in your shell before running the database scripts. If you do not have a database yet, npx create-db@latest prints a Prisma Postgres connection string.
Answer the prompts, then export DATABASE_URL in your shell before running the database scripts. If you do not have a database yet, npx create-db@latest prints a Prisma Postgres connection string.
- Node.js 22.18 or newer (on the 24 line, 24.11 or newer; 24 recommended)
- A PostgreSQL connection string, or nothing at all:
npx create-db@latestcan create a Prisma Postgres database for you
To delegate this guide to your coding agent, copy the prompt below and hand it over:
Create a new TanStack Start app with Prisma ORM, seed it, and deploy it to Prisma Compute.
1. Scaffold: `npm create prisma@latest -- my-app --template tanstack-start --provider postgres --yes`. Then run `npx prisma@latest init` in `my-app` so the Prisma agent skills are installed and stay current, and use them. Get a database connection string: use the one I give you, or create a Prisma Postgres database with `npx create-db@latest` and show me the claim URL it prints. Export it as `DATABASE_URL` in the shell; the generated scripts read the environment variable, not `.env`.
2. In `my-app`, run `npm run db:init` with `DATABASE_URL` exported. Sample users are seeded automatically on the app's first query; there is no separate seed script.
3. Start `npm run dev` in the background, wait until it reports ready, verify http://localhost:3000 renders the three seeded users, then stop the dev server.
4. Deploy: check `npx prisma auth whoami`; if I am not signed in, stop and ask me to run `npx prisma auth login`. Then run `npm run build` followed by `npx prisma deploy module.ts` and verify the live URL renders the seeded users. The deployed app provisions and seeds its own Prisma Postgres database; do not pass the local DATABASE_URL. If the deploy fails with `HostedStateBootstrapError`, a project with the module's name exists in my workspace but its hosted state cannot be verified; re-run the deploy with `--name <a unique name>`.bun create prisma@latest my-app --template tanstack-start --provider postgres --no-deploy
cd my-apppnpm create prisma@latest my-app --template tanstack-start --provider postgres --no-deploy
cd my-appyarn create prisma@latest my-app --template tanstack-start --provider postgres --no-deploy
cd my-appnpm create prisma@latest -- my-app --template tanstack-start --provider postgres --no-deploy
cd my-appThe scaffold generates the TanStack Start app with Prisma ORM wired in, installs dependencies, and emits the contract your queries are type-checked against.
Next, set the database connection for the local steps. Use your own PostgreSQL connection string, or create a Prisma Postgres database with npx create-db@latest; it prints a connection string and a claim URL you can open to keep the database. Export the variable in the shell you work in; the generated scripts read the environment variable, not .env:
export DATABASE_URL="<your connection string>"The scaffold generates the TanStack Start app with Prisma ORM wired in, installs dependencies, and emits the contract your queries are type-checked against.
Next, set the database connection for the local steps. Use your own PostgreSQL connection string, or create a Prisma Postgres database with npx create-db@latest; it prints a connection string and a claim URL you can open to keep the database. Export the variable in the shell you work in; the generated scripts read the environment variable, not .env:
export DATABASE_URL="<your connection string>"bun run db:initpnpm run db:inityarn db:initnpm run db:init"summary": "Applied 5 operation(s) across 1 space(s), database signed"If db:init stops with Connection terminated unexpectedly, a database you just created is still starting; wait a few seconds and run it again. The command is safe to repeat and reports Applied 0 operation(s) when there is nothing left to do.
db:init applies your schema (src/prisma/contract.prisma) to the database and signs it. With TypeScript authoring (--authoring typescript) the schema is src/prisma/contract.ts and the emitted files land in src/prisma/generated/. Sample users are seeded automatically the first time the app queries the database.
"summary": "Applied 5 operation(s) across 1 space(s), database signed"If db:init stops with Connection terminated unexpectedly, a database you just created is still starting; wait a few seconds and run it again. The command is safe to repeat and reports Applied 0 operation(s) when there is nothing left to do.
db:init applies your schema (src/prisma/contract.prisma) to the database and signs it. With TypeScript authoring (--authoring typescript) the schema is src/prisma/contract.ts and the emitted files land in src/prisma/generated/. Sample users are seeded automatically the first time the app queries the database.
bun run devpnpm run devyarn devnpm run devOpen http://localhost:3000. The page lists the seeded users, provided by the route loader's server function.
Open http://localhost. The page lists the seeded users, provided by the route loader's server function.
TanStack Start is supported on Prisma Compute. The scaffold builds with Nitro (the nitro() Vite plugin ships in vite.config.ts) and declares the app for Prisma Composer in module.ts and service.ts, pointing at Nitro's .output directory. Deploying is building and handing that declaration to the CLI. Sign in once (it opens a browser):
bunx prisma auth loginpnpm prisma auth loginyarn prisma auth loginnpx prisma auth loginThen build and deploy from the project directory:
bun run build
bunx prisma deploy module.tspnpm run build
pnpm prisma deploy module.tsyarn build
yarn prisma deploy module.tsnpm run build
npx prisma deploy module.tsmy-app
├─ database postgres-database db_abc123
└─ app compute-service cps_abc123
https://xyz.ewr.prisma.buildOpen the live URL: the page renders the seeded users. The deploy creates a project named after your module in your workspace, and re-running the deploy reuses it: the CLI finds the hosted state it stored on the first run and converges the project to your module. If a project with that name exists but the CLI cannot identify or verify its stored state (one left behind by a different checkout, for example), the deploy stops with HostedStateBootstrapError; deploy under another name with --name <unique-name>, or rename the module in module.ts. The deploy also provisions its own Prisma Postgres database on the platform, declared in module.ts; the DATABASE_URL from your local steps is not involved, and the deployed database seeds on the app's first query. For previews per Git branch and deploy on push, see Deploy on push.
my-app
├─ database postgres-database db_abc123
└─ app compute-service cps_abc123
https://xyz.ewr.prisma.buildOpen the live URL: the page renders the seeded users. The deploy creates a project named after your module in your workspace, and re-running the deploy reuses it: the CLI finds the hosted state it stored on the first run and converges the project to your module. If a project with that name exists but the CLI cannot identify or verify its stored state (one left behind by a different checkout, for example), the deploy stops with HostedStateBootstrapError; deploy under another name with --name <unique-name>, or rename the module in module.ts. The deploy also provisions its own Prisma Postgres database on the platform, declared in module.ts; the DATABASE_URL from your local steps is not involved, and the deployed database seeds on the app's first query. For previews per Git branch and deploy on push, see Deploy on push.
src/routes/index.tsx: the route: acreateServerFnqueries users, the loader passes them to the pagesrc/prisma/users.ts: the query helper the server function callssrc/prisma/db.ts: the Prisma ORM client behind it
Model access is namespace-qualified on PostgreSQL: db.orm.public.User. The Prisma ORM overview covers the contract-first model behind it.
- Change the schema in
src/prisma/contract.prisma, then runnpm run contract:emitandnpm run db:update. TanStack Start builds on Vite, so the Vite plugin can runcontract emitfor you whenever the contract changes while the dev server runs. - Learn the fundamentals: filtering, sorting, pagination, and writes.
- Read the Prisma ORM overview for the concepts behind contracts and typed queries.