Gathering detailed insights and metrics for @auth0/auth0-react
Gathering detailed insights and metrics for @auth0/auth0-react
Gathering detailed insights and metrics for @auth0/auth0-react
Gathering detailed insights and metrics for @auth0/auth0-react
Auth0 SDK for React Single Page Applications (SPA)
npm install @auth0/auth0-react
Typescript
Module System
Node Version
NPM Version
93.6
Supply Chain
94.4
Quality
84.3
Maintenance
100
Vulnerability
100
License
TypeScript (87.67%)
JavaScript (7.07%)
HTML (5.17%)
Shell (0.09%)
Total Downloads
83,161,334
Last Day
18,295
Last Week
525,150
Last Month
2,264,426
Last Year
24,265,900
MIT License
953 Stars
512 Commits
281 Forks
27 Watchers
30 Branches
69 Contributors
Updated on Jun 29, 2025
Minified
Minified + Gzipped
Latest Version
2.3.0
Package Id
@auth0/auth0-react@2.3.0
Unpacked Size
849.88 kB
Size
209.25 kB
File Count
41
NPM Version
10.7.0
Node Version
18.20.4
Published on
Jan 23, 2025
Cumulative downloads
Total Downloads
Last Day
10.6%
18,295
Compared to previous day
Last Week
-8.3%
525,150
Compared to previous week
Last Month
-0.9%
2,264,426
Compared to previous month
Last Year
20.3%
24,265,900
Compared to previous year
1
38
📚 Documentation - 🚀 Getting Started - 💻 API Reference - 💬 Feedback
Using npm
1npm install @auth0/auth0-react
Using yarn
1yarn add @auth0/auth0-react
Create a Single Page Application in the Auth0 Dashboard.
If you're using an existing application, verify that you have configured the following settings in your Single Page Application:
- Click on the "Settings" tab of your application's page.
- Scroll down and click on the "Show Advanced Settings" link.
- Under "Advanced Settings", click on the "OAuth" tab.
- Ensure that "JsonWebToken Signature Algorithm" is set to
RS256
and that "OIDC Conformant" is enabled.
Next, configure the following URLs for your application under the "Application URIs" section of the "Settings" page:
http://localhost:3000
http://localhost:3000
http://localhost:3000
These URLs should reflect the origins that your application is running on. Allowed Callback URLs may also include a path, depending on where you're handling the callback.
Take note of the Client ID and Domain values under the "Basic Information" section. You'll need these values in the next step.
Configure the SDK by wrapping your application in Auth0Provider
:
1// src/index.js 2import React from 'react'; 3import { createRoot } from 'react-dom/client'; 4import { Auth0Provider } from '@auth0/auth0-react'; 5import App from './App'; 6 7const root = createRoot(document.getElementById('app')); 8 9root.render( 10 <Auth0Provider 11 domain="YOUR_AUTH0_DOMAIN" 12 clientId="YOUR_AUTH0_CLIENT_ID" 13 authorizationParams={{ 14 redirect_uri: window.location.origin, 15 }} 16 > 17 <App /> 18 </Auth0Provider> 19);
1// src/index.js 2import React from 'react'; 3import ReactDOM from 'react-dom'; 4import { Auth0Provider } from '@auth0/auth0-react'; 5import App from './App'; 6 7ReactDOM.render( 8 <Auth0Provider 9 domain="YOUR_AUTH0_DOMAIN" 10 clientId="YOUR_AUTH0_CLIENT_ID" 11 authorizationParams={{ 12 redirect_uri: window.location.origin, 13 }} 14 > 15 <App /> 16 </Auth0Provider>, 17 document.getElementById('app') 18);
Use the useAuth0
hook in your components to access authentication state (isLoading
, isAuthenticated
and user
) and authentication methods (loginWithRedirect
and logout
):
1// src/App.js 2import React from 'react'; 3import { useAuth0 } from '@auth0/auth0-react'; 4 5function App() { 6 const { isLoading, isAuthenticated, error, user, loginWithRedirect, logout } = 7 useAuth0(); 8 9 if (isLoading) { 10 return <div>Loading...</div>; 11 } 12 if (error) { 13 return <div>Oops... {error.message}</div>; 14 } 15 16 if (isAuthenticated) { 17 return ( 18 <div> 19 Hello {user.name}{' '} 20 <button onClick={() => logout({ logoutParams: { returnTo: window.location.origin } })}> 21 Log out 22 </button> 23 </div> 24 ); 25 } else { 26 return <button onClick={() => loginWithRedirect()}>Log in</button>; 27 } 28} 29 30export default App;
For more code samples on how to integrate auth0-react SDK in your React application, have a look at our examples.
Explore public API's available in auth0-react.
We appreciate feedback and contribution to this repo! Before you get started, please see the following:
To provide feedback or report a bug, please raise an issue on our issue tracker.
Please do not report security vulnerabilities on the public GitHub issue tracker. The Responsible Disclosure Program details the procedure for disclosing security issues.
Auth0 is an easy to implement, adaptable authentication and authorization platform. To learn more checkout Why Auth0?
This project is licensed under the MIT license. See the LICENSE file for more info.
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
all changesets reviewed
Reason
no dangerous workflow patterns detected
Reason
license file detected
Details
Reason
security policy file detected
Details
Reason
SAST tool detected
Details
Reason
dependency not pinned by hash detected -- score normalized to 5
Details
Reason
2 commit(s) and 1 issue activity found in the last 90 days -- score normalized to 2
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
detected GitHub workflow tokens with excessive permissions
Details
Reason
project is not fuzzed
Details
Reason
Project has not signed or included provenance with any releases.
Details
Reason
12 existing vulnerabilities detected
Details
Score
Last Scanned on 2025-06-23
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More