2/1/2022

Airtable Adalo

Airtable Adalo

In this tutorial we'll show you how to create an app with Adalo that is powered by live data from Airtable.

What you'll need

  1. In a matter of minutes and without a single line of code, Zapier allows you to automatically send info between Adalo and Airtable. Get started with workflows like: Add new Adalo records to Airtable. Or check out the rest of our guided workflows. Save time with Zapier; it's free to try.
  2. In this tutorial, we'll show you how to create an app with Adalo that is powered by live data from Airtable. What you'll need - Airtable - Adalo Estimated ti.
  3. WebFlow, Zapier, Airtable. Startups, Small Business, Enterprise. A Little Bit About Me. A Little Bit About Us. Helping you create your vision using nocode tools. I work using Adalo and webflow to help you create your future. Things We've Built with Adalo. Things I've Built.
  • Airtable
  • Adalo

Estimated time to complete

Air Table Adalo

  • 40 minutes

For experienced UX designers & product people, pretend that Sketch & Airtable had a baby named Adalo, and that product could create real native apps! For those of you that are new to the no-code space, Adalo makes creating apps as easy as putting together a slide deck. Log in / Sign up. Feature Requests. It would be nice to be able to submit arrays so that Airtable rollup calculations can be done with.

Open Adalo and create a new mobile app. Add a custom list to the Home page. Select the list and change the name of the placeholders. Add a Image component to the Card.

Select the list and add an action, select link and new screen. Choose App Bar. Add an Image and text components to the new screen, rename them, 'Name', 'Website' and 'Bio'. This will be our members profiles.

Now let's connect Airtable.

Select Databases from the left hand menu. Under extreanl collections lcick add collection. Now over to Airtable.

Select Account, Airtable API, scroll down and find the Base. Select List Records and Copy the URL in the EXAMPLE REQUEST on the right side of the screen. Copy up to the end of the word Users and ignore everything after the ?. Paste that into Adalo.

Next under Auth Setup, click Add Item and select Header. Insert 'Authorization' and your API key from Airtable (e.g. Bearer YOU_API_KEY).

Press next. Open Get All and add the word Records into the Results Key field. Select Update and change Put to Patch. Press Done and Next.

Test to see your data. Press Create Collection.

Back in Adalo map the data across by selecting the List and choosing the new database from the What is this a list of? dropdown. Next map each piece of data across on the first list page and the member profile page.

Select 'Current Makerpad Member' and the appropriate field for each screen.

AdaloRecord

Now let's make it so we can update Airtable from the Adalo app.

Add a button to the Member profile screen. Add an action, link to a new screen. Select Form. Select the form and point it to the Makerpad Members collection and we'll want it to Update Member.

Airtable Analysis

Now back over to the form and remove the fields we don't need.

Airtable Add Record Api

Rename the fields if you want.

Next press preview and test it by clicking through the Member, the button, changing a piece of information and pressing Update Makerpad Member.

Check it's changed both inside of Adalo and inside of Airtable.

That's it! You now know how to power an Adalo app with Airtable.

Airtable Add Record

I hope you enjoy this tutorial preview, if you have any questions please reach out on Twitter @tomosman or @makerpad.

Airtable Address San Francisco