This is a starter project using NextAuth.js as an authentication provider and Prisma as a database ORM for PostgreSQL.
It allows to store user credentials automatically in a database during the authentication process
When you are deploying your application to production, remember to set Homepage URL and Authorization callback URL in your GitHub OAuth App settings in Developer Settings on GitHub.
Do the same for other providers
- Homepage URL:
https://yourdomain.com - Authorization callback URL:
https://yourdomain.com/api/auth/callback/github
- clone this repo and
cdinto it - run
npm install - Add
.envfile to the root of the project with the following content:
# * Prisma
# You can create a PostgreSQL database easly on Supabase
DATABASE_URL="postgresql://YOUR_SUPABASE_URL/postgres"
> Note: After 2023 Supabase migration, we need to copy/paste a new DATABASE_URL from Supabase. This will probably not work
# * NextAuth.js
# You will find these values in your GitHub OAuth App settings in Developer Settings on GitHub (Client ID and client secret), you will need to create a new OAuth App (remember to set Homepage URL and Authorization callback URL to production URL during production)
GITHUB_ID=YOUR_GITHUB_ID
GITHUB_SECRET=YOUR GITHUB SECRET
# ! Your NEXTAUTH_SECRET secret should be at least 32 characters long, not parakeet :)
NEXTAUTH_SECRET=parakeet
# ! Your NEXTAUTH_URL should be the URL of your site, change it in production
NEXTAUTH_URL=http://localhost:3000Note: If you are deploying to Vercel, the
NEXTAUTH_URLenv variable is not necessary
npm run dev- Open http://localhost:3000 with your browser to see the result
Note: NextAuth.js has many providers, you can find them here
- follow the instructions to setup Prisma with NextAuth.js
- run
npx prisma migrate devevery time you change the schema - run
npx prisma studioto if you want to see the database in a GUI
-
run
npm install prisma --save-dev -
run
npm install next-auth @prisma/client @next-auth/prisma-adapter -
run
npx prisma initto initialize the Prisma project
Note: I've created a new database with Supabase which is a firebase-like database service that uses PostgreSQL
Create a new database with Supabase
Go to
Project Settings/Database/Connection string/URIand copy theURIstring
-
Paste the
URIstring in the.envfile (DATABASE_URL) -
run
npx db pullif you already have data in your database and you want to generate the Prisma schema -
add your schema in
schema.prisma -
run
npx prisma migrate dev --name initto create the database schema (runnpx prisma migrate devevery time you change the schema) -
run
npx prisma generateto generate the Prisma Client (run this command every time you change the schema) -
run
npx prisma studioto if you want to see the database in a GUI