close icon
Vercel

New Auth0 Integration for Vercel: Available Now

Get started fast with two best-in-class developer platforms: Auth0 and Vercel

July 22, 2024

TL;DR: New Auth0 Integration for Vercel: Available Now. We’ll share why we partnered with Vercel, help guide you through deploying an application, and explain how you can take full advantage of this integration.

Why Should I Choose Auth0?

Auth0 provides an extensible and scalable authentication experience, allowing you to focus on your core product. We’ll ensure your users have the best possible experience and help you maintain a strategic advantage for years to come.

We offer comprehensive out-of-the-box functionalities with cutting-edge technologies and architecture. Our rich features include customizable actions, connections to over 60+ social and Identity providers, broad support for open standards (OIDC, SAML, FIDO, OAuth, and more), multi-cloud encryption architecture, extensive compliance and regulatory requirements, and easily customizable sign-up and login interfaces and flows, to name a few.

What Is Vercel and Why Did We Choose to Partner with Them?

Vercel is a cloud platform designed to simplify the deployment process for web applications, making it easy to deploy and manage your frontend. In the world of web development, efficiency and speed are crucial, as are the safety and security of production environments. Integrating with a third-party platform like Auth0 allows Vercel users hosting their new or existing projects to seamlessly extend Vercel’s capabilities.

Prioritizing who we partner with comes down to selecting organizations who align with our mission and values, including key pillars of cutting-edge developer experiences and a foundation of security. With this in mind, investing in a partnership with Vercel was an obvious choice for our team. This integration allows you to build scalable, secure, and compliant applications with an enhanced user experience by leveraging the strengths of these two best-in-class platforms.

Let’s Start Building with Auth0 and Vercel

Challenge: You’re looking for the most efficient way to integrate Auth0 into your Vercel-powered app.

Solution: Use the new integration to build and customize the Identity flow for your Vercel project. To get your app up and running quickly and securely, this integration will:

  • Set up a production environment in Vercel that integrates with your Auth0 tenant in just a few clicks,
  • Automatically create an Application in your Auth0 tenant that is connected to your Vercel project, and
  • Pre-load your Auth0 application credentials into Vercel, allowing you to skip some of the manual steps in this credentials setup.

To get started, you will need a project in Vercel. You can either import your own project into Vercel or use a Vercel template so you don’t have to start from scratch. For this demo, we’re going to use a simple B2B SaaS app template (learn more here). Before starting, you'll want to make sure to deploy the template in Vercel.

Add the integration to your project

The following steps are based on an example flow. Refer to docs for more information.

  1. Open the Auth0 integration in Vercel.
  2. Select a Vercel team and the Vercel project that this integration will have access to. Note: At this time, the integration is limited to one project per Vercel team.
  3. Click Install.

integration

  1. Log into Auth0 and select the Auth0 tenant you would like to use.

integration

  1. Click Accept.
  2. Select and confirm the Vercel project that you would like to integrate with Auth0. This will create an Application in your Auth0 tenant with the same name, which you can find at Auth0 Dashboard > Applications.

Vercel

It’s that simple! You can confirm by navigating to your project’s “Environment Variables” within Vercel (Select project > Settings > Environment Variables), where you will find your Auth0 application credentials.

If you have any technical questions, refer to our documentation.

NOTE:

As of 7/18/2024, this integration only works with production environment Vercel projects and only supports Next.js apps using the latest version of the Auth0 SDK.


It’s time to start leveraging all of Auth0’s capabilities

Any changes we make to our Application within Auth0 will be reflected in the identity flow of our Vercel project and vice versa. For example, let’s create an Organization in the B2B app we deployed earlier.

Auth0

This Organization automatically appears in our Auth0 tenant, and we can customize its settings and branding within Auth0. Let’s add a logo!

Auth0

Have Questions?

We want to hear from you! Join our AMA on Aug 8, 2024

Deploying your app quickly and securely with Auth0 and Vercel just became easier and faster. This is the first version of this integration, and we’re always looking for ways to improve. Join us for an online Ask Me Anything event in the Auth0 Community on August 8. This is your chance to share your questions, feedback, and ideas of what you’d like to see in the future. Engage with our product experts here.

Happy authenticating!

  • Twitter icon
  • LinkedIn icon
  • Faceboook icon