NextAuth
Set up NextAuth, Prisma and GitHub
1
Set up Prisma
prisma/schema.prisma
datasource db {
provider = "mysql"
url = env("DATABASE_URL")
relationMode = "prisma"
}
generator client {
provider = "prisma-client-js"
}
model User {
id String @id @default(cuid())
name String?
email String? @unique
emailVerified DateTime?
image String?
accounts Account[]
sessions Session[]
createdAt DateTime @default(now())
updatedAt DateTime @updatedAt
}
model Account {
id String @id @default(cuid())
userId String
type String
provider String
providerAccountId String
refresh_token String? @db.Text
access_token String? @db.Text
expires_at Int?
token_type String?
scope String?
id_token String? @db.Text
session_state String?
user User @relation(fields: [userId], references: [id], onDelete: Cascade)
@@unique([provider, providerAccountId])
@@index(userId)
}
model Session {
id String @id @default(cuid())
sessionToken String @unique
userId String
expires DateTime
user User @relation(fields: [userId], references: [id], onDelete: Cascade)
@@index(userId)
}
model VerificationToken {
identifier String
token String @unique
expires DateTime
@@unique([identifier, token])
}
lib/prismaclient
import { PrismaClient } from "@prisma/client";
const globalForPrisma = global as unknown as { prisma: PrismaClient };
export const prisma = globalForPrisma.prisma || new PrismaClient();
if (process.env.NODE_ENV !== "production") globalForPrisma.prisma = prisma;
2
Create two OAuth app in your github account (one for localhost, one for production)
Go to https://github.com/settings/developers. Fill out the "Application name," "Homepage URL," and "Application description" fields with the relevant information for your app. The callback URL should be in the format: https://your-app-domain.com/api/auth/callback/github.
3
Set up next-auth
pages/api/auth/[...nextauth].ts
import NextAuth from "next-auth";
import GithubProvider from "next-auth/providers/github";
import { PrismaAdapter } from "@next-auth/prisma-adapter";
import { prisma } from "#/lib/prismaclient";
export const authOptions = {
callbacks: {
// 'user' represents the user object stored in our database.
// By customizing the session object, we can selectively pass
// the desired user information to the client and throughout
// our API.
async session({ session, token, user }: any) {
session.user.id = user.id;
return session;
},
},
adapter: PrismaAdapter(prisma),
secret: process.env.SECRET,
providers: [
GithubProvider({
clientId: process.env.GITHUB_ID,
clientSecret: process.env.GITHUB_SECRET,
}),
],
};
export default NextAuth(authOptions);