Next.js, Prisma ORM & Supabase: Installation and Configuration
NextJS
Author
Richard Mendes
March 12, 2026 • 5 mins

Next.js, Prisma ORM & Supabase: Installation and Configuration

Connecting Supabase to Prisma in Next.js – Step by Step

Configure Prisma ORM with Next.js and Supabase

Setting up environment variables

In your .env file, put the following code, In place of password Replace it with your Supabase password

# Connection pooling URL
DATABASE_URL="postgresql://postgres:[YOUR-PASSWORD]@aws-1-eu-central-1.pooler.supabase.com:6543/postgres?pgbouncer=true"

# Direct database connection URL (for migrations)
DIRECT_URL="postgresql://postgres:[YOUR-PASSWORD]@aws-1-eu-central-1.pooler.supabase.com:5432/postgres"

Installation commands to install Prisma ORM

Next, Install the dependencies that are needed for Prisma ORM.

# Prisma CLI (dev dependency)
npm install prisma --save-dev

# Prisma Client
npm install @prisma/client

# PostgreSQL adapter and dotenv support
npm install @prisma/adapter-pg pg dotenv
npm install --save-dev @types/pg

Initialize Prisma

# Initialize Prisma project (creates prisma/ folder and .env)
npx prisma init

Prisma Configuration

<pre><code class="language-typescript">
// prisma.config.ts
import "dotenv/config";
import { defineConfig } from "prisma/config";

export default defineConfig({
schema: "prisma/schema.prisma",
migrations: {
path: "prisma/migrations",
},
datasource: {
url: process.env["DIRECT_URL"],
},
});

Prisma Schema

Create your models here, These are the tables that you will create here

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

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

model Transaction {
id BigInt @id @map("id") @default(autoincrement())
createdAt DateTime @map("created_at") @default(now())
amount Float? @map("amount")
type String? @map("typetext")
description String? @map("description")

@@map("transactions") // actual table name in Supabase
}

Push Schema to Supabase

Finally we push the tables to our Supabase db

# Generate Prisma Client from your schema
npx prisma generate

# Push schema to Supabase (sync database without migrations)
npx prisma db push
Popular Posts

Comments (0)

No comments yet. Be the first to comment!

Latest Articles