Adalo External Users Beta + Xano: Part 1: Xano Setup

Hey there! In this guide, we'll walk through the process of authenticating users from Xano in Adalo. Adalo recently announced a beta program called "External Users" that allows you to authenticate users from third-party services like Xano. Let's get started!

Step 1: Sign Up for Adalo's External Users Beta

Before we dive in, make sure you've signed up for Adalo's External Users beta program. You can do this by following their Twitter account or using this link.

Step 2: Enable Developer Mode in Adalo

Once you're accepted into the beta program, open Adalo and follow these steps:

1. Click on your account icon in the top-right corner.
2. Select "Settings" from the dropdown menu.
3. Ensure that "Developer Mode" is enabled.

Step 3: Set Up a Workspace in Xano

Next, let's set up a new workspace in Xano to facilitate the integration with Adalo.

1. Log in to your Xano account and create a new workspace. For this example, we'll name it "Adalo."
2. Choose to start from scratch and create two tables: "User" and "Stuff."
3. Select "Email" as the authentication method for the "User" table.
4. After creating the tables, add some sample data to both tables.

Step 4: Authenticate Users with Xano's APIs

Xano automatically generates APIs for authentication and data access. Let's explore how to use these APIs to authenticate users and access their data.

Logging In

1. Navigate to the "Public APIs" section in your Xano workspace.
2. Locate the "auth" block, which contains the endpoints for login and signup.
3. Use the "login" endpoint to authenticate a user (e.g., Prakash or Sean) with their email and password.
4. Copy the authentication token from the response.

Accessing Data

1. Find the "get stuff" endpoint in the "Public APIs" section.
2. By default, this endpoint is public, meaning anyone can access the data without authentication.
3. To restrict access, click the "Public" button and change the authentication to "User."
4. Now, when you try to run the endpoint without an authentication token, it will require authentication.
5. Paste the authentication token you obtained from the login endpoint to access the data.

Returning User ID with Authentication Token

Adalo needs both the authentication token and the associated user ID for authentication. To return the user ID along with the token:

1. In the "login" endpoint, add a new field to the response by clicking the "+" button.
2. Select "user" from the dropdown, and name the field "user ID."
3. Repeat this process for the "signup" endpoint.

Creating a Custom Endpoint

To retrieve data specific to a user, you can create a custom endpoint in Xano:

1. Add a new endpoint by clicking the "+" button in the "Public APIs" section.
2. Select "CRUD Database Operation" and choose the "Stuff" table.
3. Name the endpoint "stuff of user" and set the operation to "Get."
4. In the "Inputs" section, add a new input by clicking the "+" button.
5. Select "Table Reference" and choose the "User" table to specify the user ID.
6. In the query editor, set a custom query to filter the "Stuff" records where the "user ID" matches the provided input.

Now, when you run this custom endpoint with a specific user ID, it will return only the "Stuff" items associated with that user.

Step 5: Integrate with Adalo

With the setup in Xano complete, you're ready to integrate the authentication and data access functionality into your Adalo application.

1. In Adalo, create a new data source and select "External Users" from the list.
2. Follow the prompts to enter the required information, including the base URL of your Xano workspace and the authentication endpoints.
3. Use the custom "stuff of user" endpoint to retrieve and display data specific to the authenticated user.

And that's it! You've successfully set up authentication and data access in Adalo using Xano as the backend service. With this integration, you can build powerful applications that leverage Xano's no-code capabilities while providing a seamless user experience through Adalo's visual interface.