Next.js + Prisma Combo Skill

When to Use

• Setting up Prisma in a new Next.js App Router project
• Reviewing or refactoring data-fetching logic in Server Components
• Debugging Prisma client instantiation issues (hot-reload client explosion)
• Implementing type-safe CRUD operations across Server Actions and API routes

Workflow

1. Singleton Client Setup

Ensure Prisma client is instantiated only once across hot reloads:

Next.js version note: The global cache pattern below is recommended for Next.js 13/14. In Next.js 15 (with React 19), module-level singletons are stable across hot reloads — you can use export const prisma = new PrismaClient(...) directly in lib/prisma.ts.