Auth0


Introduction

Auth0 is an easy to implement, adaptable authentication and authorization platform. Rapidly integrate authentication and authorization for web, mobile, and legacy applications so you can focus on your core business.

Quick start

Follow these steps if you want to enable Auth0 authentication in your application.

1. Enable AuthProvider

Enable Auth0's AuthProvider in /src/pages/_app.tsx.
import { AuthProvider } from "./contexts/Auth0Context";
        
function App() {
  return (
    <AuthProvider>
      {content}
    </AuthProvider>;
  )
}

2. Enable useAuth hook

Enable Auth0's useAuth hook in /src/hooks/useAuth.ts.
import { AuthContext } from "../contexts/Auth0Context";
        
const useAuth = () => {
  return useContext(AuthContext);
};

How to use

Learn how to use Auth0 authentication. There are multiple examples included, including sign in, sign up and sign out.

Retrieve user info

import useAuth from '../hooks/useAuth';

const App = () => {
  const { displayName } = useAuth();

  return (
    <span>
      {user.displayName}
    </span>
  );
};

Execute actions

import useAuth from '../hooks/useAuth';

const App = () => {
  const { signIn } = useAuth();

  return (
    <button onClick={() => signIn()}>
      Sign in
    </button>
  );
};