Intermediate

OAuth 2.0 and OpenID Connect

Add "Sign in with…" to an app the correct way — full Authorization Code flow with PKCE against a real OIDC provider, using the current openid-client v6 API.

~5h
0 / 7 steps
🚀
Intro

Before We Start

Prerequisites: completed Session-Based Auth Fundamentals (or an existing session-backed app), a free account with an OIDC provider (Google, or any OpenID-certified provider) to register a test client.

Version note: verified against current documentation as of July 2026. openid-client is on major version 6, which is a full rewrite of the API from v5 — the old new Issuer() / new Client() object-oriented API is gone, replaced by a functional API (client.discovery(), client.buildAuthorizationUrl(), client.authorizationCodeGrant()) with PKCE generated and used by default. If you copy code from an older openid-client tutorial referencing Issuer.discover or new Client(...), treat it as outdated — it will not run against v6. PKCE is applied automatically by this project's code even against providers that don't advertise support for it, which is the library's documented recommended default.

OAuth 2.0 answers "can this app act on my behalf at this API" (authorization); OpenID Connect (OIDC) is a thin identity layer on top of OAuth that answers "who is this user" (authentication) by adding a signed ID token to the exchange. "Sign in with Google/Microsoft/GitHub" buttons are OIDC. This project builds the full Authorization Code flow with PKCE by hand against a real provider, so you understand exactly what a library like openid-client is doing under the hood rather than only knowing which function to call.

🔨

Step 1 — Register a client and discover the provider

🔨

Step 2 — Redirect to the provider with PKCE

🔨

Step 3 — Handle the callback and exchange the code

🔨

Step 4 — Refresh tokens without forcing a new login

🎯
Secret Mission

Secret Mission: support a second provider without duplicating logic

🧹
Wrap Up

Before You Go

Pro

Test what you just learned

Self-testing is one of the best ways to retain new skills. Unlock project quizzes to check your understanding.

Log in to unlock