Docs
Github OAuth

Github OAuth

ZexaNext uses Auth.js for authentication. To setup Github OAuth in ZexaNext

Creating an OAuth App in GitHub

  1. To get the required credentials from GitHub, we need to create an application in their developer settings.
  2. Go to the GitHub developer settings, also found under Settings → Developers → OAuth Apps, and click “New OAuth App”.
  3. Next, you’ll be presented with a screen to register your application. Fill in all the required fields.
  4. Add Authorization callback URL as
// Local
'http://localhost:3000/api/auth/callback/github'
  1. Once you’ve entered all the required fields, press “Register application”.

  2. After successfully registering your application, GitHub will present us with the required details. We need 2 things from this screen, the Client ID and Client Secret.

  • The Client ID is always visible, it is a public identifier of your OAuth application within GitHub.

  • To get a Client Secret, you have to click on “Generate a new client secret”, which will create your first client secret. You can easily create a new client secret here in case your first one gets leaked, lost, etc.

  1. Now add the Client ID and Client Secret into your .env file.
GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=
  1. Open config/index.ts and set github in OAuthOptions to true to show Github OAuth in the login page.
const OAuthOptions = {
  google: true,
  github: true
}

Deployment

Before you can release your app to production, you’ll need to change a few things.

Unfortunately, GitHub is among the providers which do not let you register multiple callback URLs for one application. Therefore, you’ll need to register a separate application in GitHub’s dashboard as we did previously but set the callback URL to your application’s production domain i.e.

// Production
'https://yoursitename.com/api/auth/callback/github'

You’ll then also have a new Client ID and Client Secret that you need to add to your production environment via your hosting provider’s dashboard (Vercel, Netlify, Cloudflare, etc.) or however you manage environment variables in production.