NextJS Guru

How to install and use Prisma with Next.js 15

Written by

The Guru

in

Prisma ORM has become pretty much standard for ORM for Next.js and it’s the most popular solution to handle your backend data.

In this article I’m describing how to quickly set it up for Next.js 15 and start querying your database in minutes!

Prisma installation in Next.js

Tu use Prisma ORM with Next.js complete the following steps:

  1. Enter your Next.js installation folder
  2. Run:

    npm install prisma @prisma/client

  3. Initialize basic Prisma schema and database settings by running:

    npx prisma init

    Amazing, you’ve just initialized Prisma schema! You should see output similar to this:
✔ Your Prisma schema was created at prisma/schema.prisma
  You can now open it in your favorite editor.

4. Now, edit the prisma/schema.prisma file to configure your models and to set the DATABASE_URL variable in the .env file to point to your database server.

At this point you can set your database provider selecting from postgresql, mysql, sqlite, sqlserver, mongodb or cockroachdb.

For a simple website I recommend sqlite – I’ve created a separate article on nextjsguru.com explaining how to can setup sqlite with Next.js so if you’re looking for an easy-to-setup solution make sure to check it out.

5. If you have an existing database you can pull its schema by running: 

npx prisma db pull


6. If you don’t have any previously created databases, move on to edit your schema file to work on the models you want.

This short tutorial only explains how to do the installation and basic configuration of Prisma ORM to make it up and running, so I won’t go into too much detail about how to shape your models, so if you’re not familiar with Prisma make sure to learn Prisma first.

Now, after you’ve set up your Prisma models, do the migration (and generate Prisma client and the same time) by running:

npx prisma migrate dev --name "Initial migration"

This command will generate any required db bindings and Prisma client with TypeScript definitions based on your configured models so using the client with immediately give you TypeScript intellisense suggestions without any extra configuration in Next.js!

How to use Prisma client and models in Next.js

Now you’ve successfully installed Prisma in Next.js, defined your models, ran the initial migration to the database and generated the client with TypeScript types you can start using it!

Since Next.js is serverless we need to create a singleton function to share Prisma client across app invocations without re-establishing connections to the database.

In order do this I recommend creating a reusable singleton function in src/lib/prisma folder:

import { PrismaClient } from '@prisma/client'

declare global {
  var prisma: PrismaClient | undefined
}

const prisma = global.prisma || new PrismaClient()

if (process.env.NODE_ENV !== 'production') {
  global.prisma = prisma
}

export default prisma

This way the Prisma instance will be registered in the global Node environment and connection will be reused across serverless function invocations.

Import Prisma client and start using it!

Now simply import the Prisma client from the lib file we’ve created and you will have all the models available to work with!

import prisma from '@/lib/prisma'

/** Create user */
export async function POST(req: NextRequest) {
  try {
    const body = await req.json()
    const UserCreateSchema = z.object({
      email: EmailSchema,
      password: PasswordSchema,
      firstName: NameSchema,
      lastName: NameSchema,
    })

    const { email, password, firstName, lastName } =
      UserCreateSchema.parse(body)

    const slug = slugify(`${firstName} ${lastName}`)
    const prismaRes = await prisma.user.create({
      data: {
        email,
        password,
        firstName,
        lastName,
        slug,
      },
    })

    return Response.json(prismaRes, { status: 201 })
  } catch (err: any) {
    return Response.json(err, { status: 500 })
  }
}

That’s it! Happy coding! 😊🎉💻

More posts