Connect to Airtable

You can connect your application to an Airtable database to display data.

Create an Airtable account

Airtable is a SaaS solution combining spreadsheet, database and project management. Airtable simply allows you to manage a large amount of data in a hybrid way, and not only numbers: phone numbers, dates, barcodes, photos... Its simple, intuitive and often free use makes it an essential tool in the no code ecosystem.

Create a free account on Airtable: https://airtable.com/signup

🔑 To secure access to your account, we strongly recommend that you create a new Airtable user to whom you share read-only access to the database. Then use the URL and API key of this account in your HTTP component (see below).

Structure your base

Create a new database by clicking on Add a base.

Structure your data in a table by adding Fields for each type of data.

Choose the type of field: checkbox, text, date, image etc...

Import your data manually or via a .csv file, Microsoft Excel or Google Sheets:

👉For more information about Airtable, visit the Help Center: https://support.airtable.com/

Connect to Airtable API from your app

Connect your Airtable database to your PandaSuite application using the Airtable API. Connecting to an API is done using the HTTP component.

Click on Components and insert an HTTP component. For your component to be accessible throughout your application, insert it at the Project level. Otherwise insert it in a screen or foreground.

In the properties, add the API parameters.

URL

Go to the HELP menu on API Documentation to get the API URL.

Select your table on the left and click on List Records.

Copy and paste the API URL (everything from the https: to the ? without including the ?. The rest of the information is Query String which will be specified below). Here is an example of an API URL:

https://api.airtable.com/v0/appIGPMYLUbwWCCbZ/Table%201

Your API key

You also need your personal API key. To find your personal API key, go to your Airtable account:

In the Header field click + Add.

Add Authorization as a key and Bearer YOUR_API_KEY as a value. Replace YOUR_API_KEY with your personal API key.

If you want to request data, select the GET method. If you want to send data, choose the POST method.

Cache management

Caching allows you to efficiently reuse previously retrieved or processed API data. Choose from the following options:

No cache: the application will make a network call and will not read the cache
Cache first: the application will look for the result in the cache before making a request to the network.
Network and cache: the application will return the content of the cache but will still make the request to update it. This option allows to have a fast answer.

The Persistent Cache option allows you to keep the cache even after closing the application.

Test request

Now that your API connection is configured, check that everything is working properly and that the data is being sent back.

Double-click the HTTP component in the Objects list.

Click on the Test Request button to launch a request.

The results of your request appear: if the raw data is displayed, the API has been correctly configured. You see how your data is structured and PandaSuite Studio is then able to visually show you your data in the explorer of the data binding window.

This is also where you can configure the pagination. Airtable limits the number of results to 100 per page but you can easily remove this limitation. Learn more about this: API pagination

Display data

Insert a Collection component to display your Airtable data as a list. Create a custom design and connect it to this HTTP component. You can add filters, create bookmarks, search.

💡 Learn how to display a collection from Airtable : Display collection from Airtable

Start request

You now need to automatically launch the request to the API, for example when the screen is displayed.

In this case, select the screen and click on Actions.

Select Current Screen > Interact with a component > HTTP Component > Start request