Authentication · setup guide
How to add Auth0 to a React app
Direct answer
Use Auth0's official React SDK, @auth0/auth0-react. Create a Single-Page Application in the Auth0 dashboard, wrap your app in <Auth0Provider> with your domain + clientId, and call loginWithRedirect / logout and read user from the useAuth0() hook. The official quickstart (linked) has the copy-paste code — this is the shape and the pitfalls.
Prerequisites
- ·An Auth0 application of type Single Page Application
- ·Its Domain and Client ID
- ·Allowed Callback URLs + Logout URLs set to your app origin (e.g. http://localhost:3000)
Shortest safe path
- ·Install @auth0/auth0-react.
- ·Wrap your root in <Auth0Provider domain=… clientId=… authorizationParams={{ redirect_uri: window.location.origin }}>.
- ·In a component, const { loginWithRedirect, logout, user, isAuthenticated } = useAuth0().
Verify it works
- ·loginWithRedirect() sends you to Auth0 and back
- ·isAuthenticated flips true and user is populated
- ·logout() returns you to the app origin
Common failure points
- ·Callback/Logout URL not in the Allowed lists → redirect error
- ·App configured as Regular Web App instead of SPA
- ·redirect_uri not matching the current origin
This is the setup shape + pitfalls; follow the official quickstart for exact, current code. Fact = the SDK/package; steps are StackSays' summary.
FAQ
Which Auth0 package do I use for React?
The official @auth0/auth0-react SDK — it provides the Auth0Provider component and the useAuth0() hook.
Official sources
- Auth0 — React SPA quickstart (official) · verified 2026-07-18