Integration Guide: BlockAuth SDK for React

This guide will help you set up your Block-Auth environment and prepare your applications for integration.

Prerequisites

Before you begin, ensure you meet the following requirements. It is essential to complete the registration process in the Browser Extension and Dashboard quickstart guides before proceeding with this integration.

1. A functional React project with a login system.
2. A BlockAuth account created via the browser extension. You can refer to the registration section of the Browser Extension Quickstart.
3. A company account on the Dashboard. Your tenant workspace is created automatically when you register — you do not need to create or name it manually. Refer to the registration section of the Dashboard Quickstart.
4. Once you have met the above requirements, continue with the steps below to link your application and complete the integration.

---

2. Link your application

With your company account active, link your applications to the Block-Auth ecosystem. Each application represents a unique integration with its own set of rules, permissions, and authentication flows.

2.1 Navigate to the Applications Section

In the dashboard sidebar, locate the Applications tab. This section is where you manage all your project integrations.

2.2 Provide Application Details

Enter the required information for your application, such as the name, domain, and specific configuration settings. Use the fields to define how Block-Auth will interact with your system. Note: The domain must be "clean"—enter only the host name (e.g., example.com) without the https:// protocol or trailing slashes. The application name can be any valid label you want in the dashboard; it does not depend on DNS, verification tokens, or any other technical validation.

Once completed, you will see the following screen:

2.3 Validate and Complete Application Link

To finalize the connection, click on the "Validate your domain" button. This will display the verification process required to confirm ownership of your domain.

Follow the instructions to copy the unique TXT record and add it to your domain's DNS configuration.

2.4 CloudFlare example

Open the Cloudflare dashboard for your domain, then go to DNS in the left sidebar and select Records.

On this screen, find the "Add record" button and click it to add your TXT record.

Create the DNS record as follows:

• Select TXT as the record type.
• In Name, enter your domain as shown in the example below.
• In Content, paste the verification token exactly as copied from the dashboard.

Click the Save button to create the record.

After saving, wait for DNS propagation before verifying the domain (this is a good time to grab a coffee). In most cases this takes 1 to 5 minutes. In some situations it may take longer (up to 1 hour, and in rare cases up to 24 hours).

If you use a different DNS provider, complete the equivalent TXT record process in that platform.

Return to the dashboard to verify your domain.

2.5 Retrieve Application Keys

Once your application is linked and validated, you can access your integration credentials. Locate your application in the list and click on the "Show keys" icon to reveal its unique credentials.

Clicking the icon will open a modal displaying your unique API Key and Secret:

These credentials (API Key and Secret) are essential for configuring the Block-Auth SDK in the following steps.

---

3. Set up Blockauth SDK

Now that your environment is configured and your application is linked, it's time to integrate the SDK into your project. Follow our dedicated guide to install the library and implement the authentication components in your code.