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