Database Integration

Prisma, Drizzle, server components with database, and connection pooling.

Overview

Next.js works seamlessly with databases through ORMs and direct connections.

Key Concepts

• Prisma — Type-safe database ORM
• Drizzle — Lightweight TypeScript ORM
• Server Components — Direct database access
• Connection Pooling — Manage database connections
• Migrations — Version control for database schema

Code Examples

// lib/prisma.js
import { PrismaClient } from '@prisma/client';

const globalForPrisma = globalThis;
export const prisma = globalForPrisma.prisma || new PrismaClient();

if (process.env.NODE_ENV !== 'production') globalForPrisma.prisma = prisma;

// app/products/page.js
import { prisma } from '@/lib/prisma';

async function ProductsPage() {
  const products = await prisma.product.findMany({
    include: { category: true },
    orderBy: { createdAt: 'desc' }
  });

  return (
    <ul>
      {products.map(product => (
        <li key={product.id}>
          {product.name} - {product.category.name}
        </li>
      ))}
    </ul>
  );
}

// Server Action with database
'use server';
import { prisma } from '@/lib/prisma';
import { revalidatePath } from 'next/cache';

export async function createProduct(formData) {
  const name = formData.get('name');
  const price = parseFloat(formData.get('price'));
  
  await prisma.product.create({
    data: { name, price }
  });
  
  revalidatePath('/products');
}

Practice

Build a CRUD app with Prisma, including relations and server actions.