auth0-test

A minimal app demonstrating Auth0 login using the Authorization Code Flow. It consists of an Express backend and a React (Vite) frontend.

Project structure

backend/   – Express API handling Auth0 login, callback, token exchange, and user info
frontend/  – React app with login/logout UI

Setup

1. Auth0 configuration

Create a Regular Web Application in the Auth0 Dashboard and configure:

• Allowed Callback URLs: http://localhost:3000/callback
• Allowed Logout URLs: http://localhost:5173

2. Backend

cd backend
cp .env.example .env   # then fill in your Auth0 credentials
yarn install
yarn start

Required environment variables in backend/.env:

Variable	Description
AUTH0_DOMAIN	Your Auth0 tenant domain
AUTH0_CLIENT_ID	Application client ID
AUTH0_CLIENT_SECRET	Application client secret
FRONTEND_URL	Frontend URL (default: http://localhost:5173)

3. Frontend

cd frontend
npm install
npm run dev

Opens at http://localhost:5173.

How it works

1. User clicks Log in on the frontend
2. Browser navigates to backend/login, which redirects to Auth0's Universal Login
3. After authentication, Auth0 redirects to backend/callback with an authorization code
4. The backend exchanges the code for tokens via Auth0's /oauth/token endpoint
5. The access token is stored as an httpOnly cookie and the user is redirected back to the frontend
6. The frontend calls backend/me, which uses the access token to fetch user info from Auth0's /userinfo endpoint
7. Log out clears the cookie