Next.js Course
Next.js
/
Intermediate

Prisma ORM

Definition

A next-generation Object-Relational Mapper (ORM) for Node.js and TypeScript, used heavily in the Next.js ecosystem to interact with databases securely.

Explain Like I'm New

Instead of writing complex, messy raw SQL strings like `SELECT * FROM users WHERE age > 18`, Prisma lets you write clean, auto-completed JavaScript code like `prisma.user.findMany({ where: { age: { gt: 18 } } })`.

Real World Example

Using Prisma to define a `User` model, push that schema to a PostgreSQL database to create the actual tables, and then using the generated Prisma Client inside a Next.js Server Component to fetch the users.

Common Use Cases

  • •Database management
  • •Type-safe SQL queries
  • •Schema migrations

Interactive Example

// 1. schema.prisma (Defines the database)
// model User {
//   id    Int     @id @default(autoincrement())
//   email String  @unique
//   name  String?
// }

// 2. Next.js Server Component (app/users/page.tsx)
import { PrismaClient } from '@prisma/client';
const prisma = new PrismaClient();

export default async function UsersList() {
  // Type-safe, auto-completing database query!
  const users = await prisma.user.findMany({
    where: {
      name: { contains: 'John' }
    }
  });

  return (
    <ul>
      {users.map(u => <li key={u.id}>{u.name} - {u.email}</li>)}
    </ul>
  );
}

Interview Questions

basic

  • What file extension is used for the main Prisma configuration file where you define your database schema?

intermediate

  • Why does Next.js 14 pair incredibly well with Prisma compared to older React architectures?

Flash Cards

Question

File extension?

Click to reveal answer
Answer

`.prisma` (usually named `schema.prisma`).

Question

Why pairs well?

Click to reveal answer
Answer

Because of Server Components. You can literally import the Prisma Client directly into a React component file and query the database right next to your HTML output. No need to build an entire backend API.