Documentation

React

Browser UI that delegates OAuth to a confidential backend.

Warning

Do not embed YOUR_CLIENT_SECRET in a React SPA. Use a BFF (backend-for-frontend) pattern.

SignInButton.tsx

// Start login from the SPA — backend holds the secret
async function signIn() {
  window.location.href = "/api/auth/login";
}

function SignInButton() {
  return <button onClick={signIn}>Sign in with Radiant Auth</button>;
}

pattern.ts

// Backend (Express/Hono/Workers) still performs:
// 1) PKCE + authorize redirect
// 2) code exchange with YOUR_CLIENT_SECRET
// 3) Set httpOnly session cookie
// The React app only calls /api/auth/login and /api/auth/logout

Next.js

Express