Quick Start

Installation

Install the runtime packages:

npm install @prisma-next-idb/client-idb @prisma-next/migration-tools

Install the dev tools:

npm install --save-dev prisma-next @prisma-next/contract \
  @prisma-next-idb/family-idb @prisma-next-idb/target-idb \
  @prisma-next-idb/adapter-idb @prisma-next-idb/driver-idb

Schema

Create src/prisma/schema.prisma. No generator block is needed.

model User {
  id    String  @id
  name  String
  email String? @unique
  todos Todo[]
}

model Todo {
  id     String  @id
  title  String
  done   Boolean
  userId String
  user   User    @relation(fields: [userId], references: [id], onDelete: Cascade)
}

Configure

Create prisma-next.config.ts:

import { defineConfig } from "@prisma-next-idb/family-idb/config-types";
import { prismaIdbContract } from "@prisma-next-idb/family-idb/contract-psl";
import idbFamily from "@prisma-next-idb/family-idb/control";
import idbTarget from "@prisma-next-idb/target-idb/control";
import idbAdapter from "@prisma-next-idb/adapter-idb/control";
import idbDriver from "@prisma-next-idb/driver-idb/control";

export default defineConfig({
  family: idbFamily,
  target: idbTarget,
  adapter: idbAdapter,
  driver: idbDriver,
  db: { connection: ":memory:" },
  contract: prismaIdbContract("src/prisma/schema.prisma"),
  migrations: { dir: "migrations" },
});

Scripts

Add these to package.json:

{
  "scripts": {
    "contract:emit": "prisma-next contract emit",
    "migration:baseline": "prisma-next-idb generate-baseline --contract src/prisma/contract.json",
    "migration:generate": "prisma-next-idb generate-migration --contract src/prisma/contract.json",
    "migration:generate-space": "prisma-next-idb generate-contract-space --contract src/prisma/contract.json --out src/prisma/contract-space.generated.ts",
    "migration:preflight": "prisma-next-idb preflight"
  }
}

The IDB CLI defaults to src/lib/prisma/contract.json; these scripts use src/prisma to stay framework-neutral. If you move the files again, update the --contract and --out flags. If you move migrations/, add --migrations-dir <path> to the IDB scripts.

Bootstrap

Run once on a fresh project:

npm run contract:emit
npm run migration:baseline
npm run migration:generate-space
npm run migration:preflight

This writes contract.json, contract.d.ts, contract-space.generated.ts, and the first migration package under migrations/app/. Commit all of them.

Open the client

Create src/db.ts:

import { createAutoMigratingIdbClient } from "@prisma-next-idb/client-idb/client-auto";
import type { IdbClient } from "@prisma-next-idb/client-idb/client-auto";
import type { Contract } from "./prisma/contract";
import { contractSpace } from "./prisma/contract-space.generated";

type Db = IdbClient<Contract>;

let db: Promise<Db> | null = null;

export function getDb(): Promise<Db> {
  return (db ??= createAutoMigratingIdbClient({ contractSpace, dbName: "my-app" }));
}

createAutoMigratingIdbClient applies any pending migrations before resolving. Call getDb() from browser code whenever you need the client.

Installation

Schema

Configure

Scripts

Bootstrap

Open the client

Next

Schema & Config

Migrations

Client

Querying

On this page