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.
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: support a second provider without duplicating logic
Before You Go
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 unlock0 / 7 complete
