prisma/nextjs-prisma-postgres-demo

README

Next.js + Prisma Postgres Example

This example demonstrates how to build a full-stack web application using Next.js, Prisma Client, and Prisma Postgres.

TL;DR: Prisma Postgres is a new kind of Postgres database that's optimized for developer productivity. It offers instant provisioning, built-in connection pooling, edge caching, and seamless integration with Prisma ORM.

Learn more about Prisma Postgres →

Getting started

1. Fill out .env file

If you just want to run the app locally, rename .env.example to .env and fill in the values.

1.1 Create a Prisma Postgres instance

Go to the Console and create a new Prisma Postgres instance. Use the DATABASE_URL value from the new instance to fill out the .env file.

1.2 Create a GitHub OAuth app

Go to the GitHub Developer Settings and create a new OAuth app.

For the required fields:

Application name and homepage URL can be whatever you want.
Authorization callback URL should be http://localhost:3000/api/auth/callback/github

After creating the app, you'll be redirected to the app's page. Copy the Client ID and Client Secret values and use them to fill out AUTH_GITHUB_ID and AUTH_GITHUB_SECRET in the .env file.

1.3 Fill out Auth.js secrets

Run npx auth secret --copy to generate a new AUTH_SECRET value. Fill out the .env file with the new value.

2. Install dependencies

Install npm dependencies:

npm install

3. Create and seed the database

Run the following command to create your database. This also creates the needed tables that are defined in prisma/schema.prisma:

npx prisma migrate dev --name init

When npx prisma migrate dev is executed against a newly created database, seeding is also triggered. The seed file in prisma/seed.ts will be executed and your database will be populated with the sample data.

If you switched to Prisma Postgres in the previous step, you need to trigger seeding manually (because Prisma Postgres already created an empty database instance for you, so seeding isn't triggered):

npx prisma db seed

4. Start the Next.js server

npm run dev

The server is now running on http://localhost:3000.

📸 Expand for a tour of the app

Homepage

Logged out view:

Logged in view:

User Profile

Creating Posts

View your posts and drafts

Next Steps

Here are some ways to learn more and expand upon this example:

🚀 Deploy your app to Vercel in just a few clicks
📚 Learn more about Prisma ORM and database workflows.
🔍 Explore the Prisma Client API to add more database features.
⭐ Check out more Prisma examples for inspiration.

Join our community!