# Setting up Auth0

Copy as Markdown[View as Markdown](/docs/development/authentication/providers/setting-up-auth0.md)

***

**Added in** `eventcatalog@2.43.1`

i

This feature is available on the

<!-- -->

[Enterprise](/pricing.md)

<!-- -->

[ plan](/pricing.md).

info

This guide takes your through setting up a protected sign-in screen for your docs. Before going through this guide, make sure you've first gone through [Enabling authentication](/docs/development/authentication/enabling-authentication.md).

To setup your EventCatalog site with visitor authentication using [Auth0](https://auth0.com/), the process looks as follows:

1. [Create a new Auth0 application](#create-a-new-auth0-application)
2. [Configure the Auth0 app in EventCatalog](#configure-the-auth0-app-in-eventcatalog)
3. [Test the authentication](#test-the-authentication)

## Create a new Auth0 application[​](#create-a-new-auth0-application "Direct link to Create a new Auth0 application")

First, you will need to create a new Auth0 application in your Auth0 Dashboard.

1. Go to [auth0.com](https://auth0.com) and sign up for a free account or login

2. In the Auth0 Dashboard, navigate to **Applications** → **Applications**

3. Click **Create Application**

4. Fill in the application details:

   <!-- -->

   * **Name:** `EventCatalog`
   * **Application Type:** Select **Regular Web Applications**

5. Click **Create**

6. In your new application's **Settings** tab, configure the following:

   <!-- -->

   * **Allowed Callback URLs:**

     * Production: `{YOUR_EVENTCATALOG_SITE_URL}/api/auth/callback/auth0`
     * Local development: `http://localhost:3000/api/auth/callback/auth0`

   * **Allowed Logout URLs:**

     * Production: `{YOUR_EVENTCATALOG_SITE_URL}`
     * Local development: `http://localhost:3000`

   * **Allowed Web Origins:**

     * Production: `{YOUR_EVENTCATALOG_SITE_URL}`
     * Local development: `http://localhost:3000`

   * **Allowed Origins (CORS):**

     * Production: `{YOUR_EVENTCATALOG_SITE_URL}`
     * Local development: `http://localhost:3000`

7. Leave **Initiate Login URI** empty (not required)

8. Click **Save Changes**

9. Copy the **Domain**, **Client ID**, and **Client Secret** from the app settings

## Configure the Auth0 app in EventCatalog[​](#configure-the-auth0-app-in-eventcatalog "Direct link to Configure the Auth0 app in EventCatalog")

Add your Auth0 Domain, Client ID, and Client Secret to your `.env` file.

.env

```
AUTH_AUTH0_ID={YOUR_AUTH0_CLIENT_ID}
AUTH_AUTH0_SECRET={YOUR_AUTH0_CLIENT_SECRET}
AUTH_AUTH0_ISSUER=https://{YOUR_AUTH0_DOMAIN}
```

Your Auth0 issuer URL should be in the format: <https://your-tenant.auth0.com> (this is the Domain from your Auth0 application settings).

In your eventcatalog.auth.js file, add the following:

eventcatalog.auth.js

```
export default {
  enabled: true,
  providers: {
    auth0: {
      clientId: process.env.AUTH_AUTH0_ID,
      clientSecret: process.env.AUTH_AUTH0_SECRET,
      issuer: process.env.AUTH_AUTH0_ISSUER,
    },
  },
};
```

## Test the authentication[​](#test-the-authentication "Direct link to Test the authentication")

![Okta authentication](/assets/images/auth0-auth-deec02ff9bc2ab11bc6f78bcf4b4403c.png)

Restart your EventCatalog server and test the authentication.

```
npm run dev
```

All pages should now be protected and require an Auth0 account to access.

1. Navigate to your EventCatalog site
2. You should be redirected to the sign-in page
3. Click Sign in with Auth0
4. You'll be redirected to your Auth0 login page
5. Enter your credentials or sign up for a new account
6. After successful authentication, you'll be redirected back to EventCatalog

## Found an issue?[​](#found-an-issue "Direct link to Found an issue?")

Remember to setup the prerequisites for this guide:

* [Enabling authentication](/docs/development/authentication/enabling-authentication.md)

If you still have problems, please [let us know](https://github.com/eventcatalog/eventcatalog/issues/new/choose).
