Frontend Integration
Next.js

Justpass.me can be easily integrated to your Next.js (opens in a new tab) project using the popular NextAuth.js (opens in a new tab) library. Here is a quick tutorial using their excellent example app (opens in a new tab):

  1. Clone the repository and install dependencies
git clone https://github.com/nextauthjs/next-auth-example.git
cd next-auth-example
npm install
  1. modify auth.ts to add justpass.me configuration
import type { OIDCConfig } from "@auth/core/providers"
import type { NextAuthConfig, Profile } from "next-auth"
 
// add this configuration to providers list:
    {
      id: "justpass",
      name: "Justpass.me",
      type: "oidc",
      issuer: "https://{ORGANIZATION_NAME}.accounts.justpass.me/openid",
      clientId: process.env.AUTH_JUSTPASSME_ID,
      clientSecret: process.env.AUTH_JUSTPASSME_SECRET,
    } satisfies OIDCConfig<Profile>
  1. copy .env.local.example to .env.local and add the justpass.me client id and secret variables
AUTH_JUSTPASSME_ID={CLIENT_ID}
AUTH_JUSTPASSME_SECRET={CLIENT_SECRET}
  1. run project
npm run dev

2024 © justpass.me