NEW cohort course starting Aug 10! Launch a membership-based business in 3 weeks — no coding required.

Creating a component in Adalo

Become a Pro member to access all content

240+ instructional videos led by professionals
Weekly expert workshops and replays
1-1 consultation with the Makerpad team
Over $50k in discounts for tools
Private peer community
Profile for tracking progress and sharing your work
Yearly pricing
$249/year
Start your 7 day free trial*
Get PRO Yearly
Lifetime pricing
$600billed once
Start your 7 day free trial*
Get PRO Lifetime

This tutorial guides you through adding your first component to your app. Components in Adalo are like building blocks. You can easily drag them from the component menu on the left to your app's design on the right, and drag them within your design to re-order. You can also customize any components using the options available.

This tutorial guides you through adding your first component to your app. Components in Adalo are like building blocks. You can easily drag them from the component menu on the left to your app's design on the right, and drag them within your design to re-order. You can also customize any components using the options available.

Once you've created your blank mobile app in Adalo, you're going to see a few out-of-the-box screens like a signup page, a login page, and your first screen, which is classed as a homepage. This is also the first thing that the user is going to see once they either sign up or login.

This tutorial shows you how to drag a component from the menu on the left to your home screen on the right. On the left hand side, you have a component menu. Under 'add component', you can either scroll through the list of options, or search for a component if you know what you're looking for.

For this tutorial we're going to add a 'simple list' component. Click on this component, hold and drag it onto your home screen. Then select a text component, and hold and drag this onto the home screen above the list component you just added.

Notice that when you select your 'list' component on your home screen that a sub menu on the left-hand side appears that asks, "what is this a list of?". Click here and you'll see you can select 'Users'—this option is always available, and is a collection of data automatically created for you by Adalo. You can also click 'new collection'.

Collections are lists that exist on your app. For example, if you were creating a directory site of shops, a collection would be a list of those shops.

Become a Pro member to access all content

240+ instructional videos led by professionals
Weekly expert workshops and replays
1-1 consultation with the Makerpad team
Over $50k in discounts for tools
Private peer community
Profile for tracking progress and sharing your work
Yearly pricing
$249/year
Start your 7 day free trial*
Get PRO Yearly
Lifetime pricing
$600billed once
Start your 7 day free trial*
Get PRO Lifetime

This tutorial guides you through adding your first component to your app. Components in Adalo are like building blocks. You can easily drag them from the component menu on the left to your app's design on the right, and drag them within your design to re-order. You can also customize any components using the options available.

This tutorial guides you through adding your first component to your app. Components in Adalo are like building blocks. You can easily drag them from the component menu on the left to your app's design on the right, and drag them within your design to re-order. You can also customize any components using the options available.

This tutorial guides you through adding your first component to your app. Components in Adalo are like building blocks. You can easily drag them from the component menu on the left to your app's design on the right, and drag them within your design to re-order. You can also customize any components using the options available.

Get help and discuss

Open community forum
Close

Sign up for our weekly updates

Get an update every Sunday with new content, news and a behind-the-scenes of what our community are building.
Join over 18,000 others
You're in 😍- check your email to get started. Tweet me what you want to build to see how to do it without code.
Oops! Something went wrong while submitting the form.

Related Tutorials

view all ⭢
No items found.