Best Practices for Instantiating Prisma Client with Next.js

Prisma Config

1. Install Prisma and Dependencies

To set up Prisma in your project, start by installing the necessary dependencies:

pnpm install -D prisma
pnpm install @prisma/client

npx prisma init

This will install Prisma and generate the necessary configuration files, including prisma/schema.prisma and a .env file.

2. Add Environment Variables

In your .env file, add the DATABASE_URL environment variable to point to your database:

// .env
DATABASE_URL=

3. Config datasource in `prisma/schema.prisma`

// /prisma/schema.prisma
generator client {
  provider = "prisma-client-js"
}

datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}

4. Create a Singleton Prisma Client

To avoid creating multiple instances of the Prisma Client, you should use a singleton pattern. This ensures that Prisma is instantiated only once, even during hot-reloading in development:

// src/lib/prismadb.ts
import { PrismaClient } from "@prisma/client";

const prismaClientSingleton = () => {
  return new PrismaClient();
};

declare const globalThis: {
  prismaGlobal: ReturnType<typeof prismaClientSingleton>;
} & typeof global;

const prisma = globalThis.prismaGlobal ?? prismaClientSingleton();

export default prisma;

if (process.env.NODE_ENV !== "production") globalThis.prismaGlobal = prisma;

5. Add a Model

// prisma/schema.prisma

model SomeModel {
  id        String   @id @default(cuid())
  userId    String   @unique
  count     Int      @default(0)
  createdAt DateTime @default(now())
  updatedAt DateTime @updatedAt
}

6. Sync the Schema with the Database

# when you modify prisma schema
npx prisma generate

npx prisma db push

7. Start Prisma Studio

# Prisma Studio is up on http://localhost:5555
npx prisma studio