NextAuth.js (Auth.js) setup in NextJS - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is NextAuth.js used for in a Next.js application?

NextAuth.js is a library that helps you add user authentication easily to your Next.js app. It manages sign-in, sign-out, and session handling.

beginner

Which file do you create to configure NextAuth.js in a Next.js app?

You create either /pages/api/auth/[...nextauth].js for the Pages Router or /app/api/auth/[...nextauth]/route.js for the App Router to configure NextAuth.js routes and options.

intermediate

How do you add a Google provider to NextAuth.js?

You import GoogleProvider from 'next-auth/providers/google' and add it to the providers array in the NextAuth configuration with your clientId and clientSecret.

intermediate

What is the purpose of the 'callbacks' option in NextAuth.js configuration?

Callbacks let you control what happens during sign-in, session creation, and JWT token handling. For example, you can add extra user info to the session.

beginner

How do you protect a page in Next.js to allow only signed-in users with NextAuth.js?

You use the useSession hook from 'next-auth/react' to check if a user is signed in. If not, you can redirect them or show a sign-in button.

Where should you place the NextAuth.js API route file in a Next.js app using the App Router?

A /app/api/auth/[...nextauth]/route.js

B /pages/api/auth/[...nextauth].js

C /app/auth/[...nextauth]/route.js

D /api/auth/[...nextauth].js

In Next.js App Router, API routes go inside the /app/api folder with a route.js file.

Which hook do you use to get the current user session in a Next.js component with NextAuth.js?

A useUser()

B useAuth()

C useSession()

D useCurrentUser()

useSession() is the official hook from NextAuth.js to access the current user session.

What do you need to provide when adding an OAuth provider like Google to NextAuth.js?

A OAuth token only

B username and password

C API key only

D clientId and clientSecret

OAuth providers require clientId and clientSecret to authenticate your app with the provider.

Which NextAuth.js option allows you to customize the session object sent to the client?

A providers

B callbacks

C pages

D events

The callbacks option lets you modify the session object before it is returned to the client.

How do you sign out a user in a Next.js component using NextAuth.js?

A call signOut() from 'next-auth/react'

B call logout() from 'next-auth/client'

C redirect to /logout page

D clear cookies manually

NextAuth.js provides a signOut() function from 'next-auth/react' to handle user sign-out.

Explain the steps to set up NextAuth.js in a Next.js app using the App Router.

Think about where the API route goes and how to add providers.

Describe how you can protect a page so only signed-in users can access it using NextAuth.js.

Focus on checking session and conditional rendering.