Next.js Lesson 11: Database with Prisma

▲ Next.js CourseLesson 11 of 12 · 92% complete

Prisma is the modern ORM for TypeScript — type-safe database queries with an auto-generated client. Works perfectly with Next.js.

npm install prisma @prisma/client
npx prisma init
# Sets up prisma/schema.prisma and .env with DATABASE_URL

Schema

// prisma/schema.prisma
datasource db {
  provider = "sqlite"  // or "postgresql", "mysql"
  url      = env("DATABASE_URL")
}

generator client {
  provider = "prisma-client-js"
}

model User {
  id        Int      @id @default(autoincrement())
  email     String   @unique
  name      String?
  posts     Post[]
  createdAt DateTime @default(now())
}

model Post {
  id        Int      @id @default(autoincrement())
  title     String
  content   String?
  published Boolean  @default(false)
  author    User     @relation(fields: [authorId], references: [id])
  authorId  Int
}

Using Prisma

// lib/db.ts
import { PrismaClient } from "@prisma/client";
const db = new PrismaClient();
export default db;

// In Server Components / API routes:
const users = await db.user.findMany({ include: { posts: true } });
const post = await db.post.create({ data: { title, content, authorId } });
const updated = await db.post.update({ where: { id }, data: { published: true } });
await db.user.delete({ where: { id } });

Migrations

# Create and apply migration
npx prisma migrate dev --name init

# Generate client after schema changes
npx prisma generate

# View data in browser
npx prisma studio  # opens at localhost:5555

🏋️ Practice Task

Build a Next.js blog with Prisma. Schema: Post (id, title, content, published, createdAt). API routes: GET /api/posts (all published), POST /api/posts (create). Page: /blog (list posts from DB), /blog/[id] (single post). Use SQLite for simplicity.

💡 Hint: DATABASE_URL=”file:./dev.db” in .env. Run: npx prisma migrate dev –name init

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *