Docs

Add X/Twitter v2 as a social connection

You will learn the following:

  • Create an X/Twitter application
  • Enable X/Twitter as a social connection
  • Set Clerk's Authorized Redirect URI in your X/Twitter application
  • Set X/Twitter's Client ID and Client Secret in your Clerk Dashboard

Overview

Clerk does not currently support preconfigured shared OAuth credentials for X/Twitter on development instances. This means you will have to provide custom credentials for both development and production instances, which involves generating your own Client ID and Client Secret using your X/Twitter Developer account. This tutorial will walk you through that process in just a few simple steps.

Warning

X/Twitter v2 is currently not providing email addresses of users. The user will have to fill in their email address manually when they return to your application after authenticating with X/Twitter.

Create an X/Twitter application

If you don't have an existing X/Twitter application you've set up for social connection, you need to register a new one at the X/Twitter Developer Portal. Note that the process requires approval from X/Twitter before your new application can be used.

To create a new X/Twitter application:

  1. Navigate to the X/Twitter Developer Portal and go to Projects & Apps.
  2. Select + Add App. After entering a name, you will be presented with your app's credentials. However, for setting up the X/Twitter v2 social connection with Clerk, you won't need these credentials. This is because you will be utilizing the OAuth 2.0 flow, which relies on different authentication details.

Enable X/Twitter as a social connection

To enable X/Twitter as a social connection for your Clerk application:

  1. Navigate to the Clerk Dashboard.
  2. In the top navigation, select Configure. Then in the sidebar, select SSO Connections.
  3. Select the Add connection button, and select For all users.
  4. In the Choose provider dropdown, select X/Twitter.
  5. Toggle on Use custom credentials and copy Authorized redirect URI. Keep this modal and page open.

Set the Authorized Redirect URI in your X/Twitter application

  1. Navigate back to the X/Twitter Developer portal.
  2. On the application settings screen, scroll down to the User authentication settings section and select Set up. You'll be presented with the User authentication settings page.
  3. Under App permissions, you can choose the permissions you want to request from the user. For this tutorial, select the Read permission.
  4. Under Type of App, select Web App, Automated App or Bot.
  5. Under App info, in the Callback URI / Redirect URL input, paste the Authorized Redirect URI value you copied from the Clerk Dashboard.
  6. Fill any other required fields, such as the Website URL, and select Save.

Set the Client ID and Client Secret in your Clerk Dashboard

After setting up your X/Twitter application, you should be able to copy your Client ID and Client Secret.

Go back to the Clerk Dashboard, where the modal should still be open, and paste these values into the respective fields.

Note

If the modal or page is not still open, navigate to the Clerk Dashboard. In the top navigation, select Configure. Then in the sidebar, select SSO Connections. Next to X/Twitter, select the settings cog icon. Under Use custom credentials, you can paste the Client ID and Client Secret into their respective fields.

Test your OAuth

The simplest way to test your OAuth is to visit your Clerk application's Account Portal, which is available for all Clerk applications out-of-the-box.

  1. In the navigation sidebar of the Clerk Dashboard, select Account Portal.
  2. Next to the Sign-in URL, select Visit. The URL should resemble:
  3. On the sign-in page, you should see X/Twitter as an option. Use it to sign in with your X/Twitter account.

Feedback

What did you think of this content?

Last updated on