8 MIN READ
Wednesday, August 24, 2022
In this post, we’ll show you how to create different web and mobile apps without coding.
Specifically, you’ll learn how to:
Build web apps with Stacker: no coding required! We’ll walk you through the entire process of building a web app, powered by your data with our no-code web app builder. We’ll also cover examples of Stacker apps built by companies like Segment, Spedal, and more.
Build native mobile apps with two no-code platforms. This section will focus on Thunkable and App Maker — two of the most popular no-code mobile app builders. We’ll explore best practices and features to look out for, like drag-and-drop components, templates, eCommerce capabilities, and more.
You can follow along with the post and build your web app today by starting a free 30-day Stacker trial.
Stacker is our no-code web app builder, which lets you create web app CRMs, client portals, project trackers, internal tools, and much more — all without having to write a line of code.
Here are three real-life examples of Stacker apps built by our customers:
Spedal’s secure portal for customers and delivery riders. Spedal is a courier bike service specializing in zero-waste deliveries. They used to enter their orders in Google Sheets and text the address to riders, which involved a lot of manual work. That’s why they built a Stacker portal where customers can place and track orders and returns. Riders also use the portal to log the start and end of each job using their mobile device, as well as upload photos to confirm deliveries.
Growth Collective’s app that matches clients with pre-vetted freelancers. Growth Collective is a platform that helps clients hire pre-vetted marketing experts. With Stacker, Growth Collective built a portal app for clients to view and schedule time with matches. Freelancers also have a Stacker portal to create and update their profiles. External partners (like the company's accountant) have separate portals that display relevant data to their jobs.
Segment’s app, used by over 15,000 startups. Segment runs a program that supports early-stage startups with software deals, resources, and credits. While they house the data for the app (i.e., the back end) in Airtable, they also needed to ensure a great user experience for startup founders by giving them a way to log in and quickly find relevant information on their deals. With Stacker, Segment built a secure portal that lets startup founders log in, track their deals, and access a resource hub.
In short, Stacker’s versatility allows our clients to build all sorts of apps, powered by their data, without writing a single line of code.
In the following sections, you’ll learn exactly how to build a similar app for your business needs in three simple steps:
Connect to your data sources or bring your data into Stacker.
Customize your app’s user interface (UI).
Set granular user permissions.
Connecting to External Data Sources or Bringing Your Data Into Stacker
The first thing you want to do is get your data into Stacker.
You have three different options available to you:
Sync to Airtable or Google Sheets. When Stacker syncs to these data sources, it automatically builds a new app for you. Any changes made on the app front end are reflected on the back end (in the Airtable base or Google Sheet), so you only need to update one tool. For example, say you use Stacker as a CRM on top of your Airtable base. When a sales rep moves a deal from “Negotiation” to “Closed-won,” that change is automatically reflected in your Airtable base.
Use Stacker as your database. Stacker can house all the data for your app, which means you can use the same tool for your app’s front end and back end. In our CRM example, you can have all the deal data — contacts, organizations, last engagement, etc. — in Stacker, instead of in an Airtable base. This would allow you to use only Stacker as your fully customizable CRM, simplifying your workflow and cutting back on the number of tools (and paid plans) you need.
Bring in data from 60+ different sources. Stacker supports various read-only data sources, including HubSpot, Salesforce, Asana, Jira, MySQL, MongoDB, MariaDB, Square, and much more. You can also import data from an Excel spreadsheet by uploading a CSV file to Stacker. Since these sources are read-only, changes made on the app front end won’t be automatically reflected on the original data source.
After selecting your desired data source, you can customize your app’s UI.
Customizing Your Web App’s UI
With Stacker, you can easily customize your app’s UI (layout) without dealing with aspect ratios, pixels, or any other front end design and development minutiae.
When you first start using our tool, you can choose from different app templates, as shown in the screenshot below.
You can also start from scratch without using a template.
(Quick note: If you’re syncing to Airtable or Google Sheets, Stacker will automatically build a web app based on how your data is organized. You can still customize your app, but you won’t start with a template.)
Regardless of whether you use an app template, you can always tailor the layout to your specific use case.
One way to start the process is by selecting whether the UI should be presented as cards, in rows, as a board, table, inbox, calendar, or one record only.
For example, the screenshot below displays the layout as a calendar.
This next screenshot shows a CRM in a kanban board view, which makes it easy to find and filter specific accounts.
Switching between these or any of the other layout options only takes a few clicks.
Here are a few of the other actions you can take to customize your app:
Add buttons for important functions like “mark as done”, “approve”, “claim lead”, “send update”, “edit”, “save”, etc.
Choose which tables are displayed in your navigation.
Drag-and drop-design elements such as widgets, banners, headers, and pipelines.
Create nested views for your tables to make it easier for users to navigate different pages. For example, you can have All Deals > EMEA Deals > EMEA Enterprise Deals.
Change your app's color, add your logo (or your clients), and much more.
None of these customizations require any coding or design skills.
Setting Granular User Permissions
The final step in creating a useful no-code app is adding users and setting granular permissions for them.
With Stacker, you get complete control over what each user can see and edit in your app.
First, you can add users to your app by:
Entering their email address.
Connecting a user table from your data source.
Using our Open Signup feature to create a link that allows anyone to register and gain access to your app.
Then, you can create specific permission rules, by going to App Settings → Permissions.
From there, you’ll see a list of all the tables in your data source, with an “Add permissions” button under each table name.
Clicking that button lets you create a new permission rule that applies only to that table.
You can also set up User Roles by going to App Settings → Roles → Enable Roles.
Each role’s permissions determine what data a specific user can access and how they can interact with it. Going back to our CRM example, you can have separate roles for sales managers and sales reps, both with different permissions. For example, managers can have the ability to see and edit all deals in the pipeline, while reps only see and edit their deals.
Start your free 30-day Stacker trial and build a fully customizable web app for your businesses without coding.
In this section, we’re going to look at two no-code mobile app builders: Thunkable and App Maker (by Appy Pie).
Before we dive in, note that building apps with each one can be vastly different. In short:
Thunkable allows you to create all sorts of custom apps by starting from scratch and using a drag-and-drop editor and logic blocks.
App Maker also has a drag-and-drop editor but, unlike Thunkable, it offers pre-made templates, as well as features for creating eCommerce apps, converting websites into mobile apps, and other specialized use cases.
Let’s look at the process of building a mobile app with each tool in more detail.
#1. Thunkable
Thunkable is a no-code app development platform for building customizable native apps and deploying them directly to Apple’s App Store (for iOS apps) or Google’s Play Store (for Android apps).
An important part of Thunkable’s philosophy is that ideas should not be confined to pre-built templates. That’s why they don’t offer a list of templates, but instead, allow you to build pretty much anything you want from scratch. They do have several sample projects that you can use for inspiration, though.
Just like with Stacker, the first step of building an app with Thunkable is selecting where the data for your app lives.
You can choose between two external sources — Airtable and Google Sheets — or house your data directly in Thunkable by creating local tables.
After that, Thunkable lets you build your app’s UI using drag-and-drop UI components. These are visible components that users can move, click on, and type in. A few example components are:
Buttons
Sliders
Labels
Text Inputs
PDF Readers
Components can be styled any way you want by changing their size, color, adding a background picture, and more.
Plus, each UI component has its own set of blocks to start or trigger an event and set and change properties.
For example, since the button component is just something users click to perform an action, you have to decide what that action leads to, like navigating to a different screen, playing a sound, or various other outcomes.
The way you decide what happens on a button click is by setting up the correct blocks, as shown in the screenshot below:
Blocks are incredibly versatile, which means that setting them up will likely be the most time-consuming part of the app development process in order to ensure your app performs as expected. For more details, check out Thunkable’s documentation.
Thunkable also offers integrations with tools like AdMob, Firebase, and Cloudinary, as well as a Web API component that can retrieve data from any public or private API service.
Lastly, Thunkable has various tutorials, like the one below, where you can see an example mobile app being built:
#2. App Maker
App Maker by (Appy Pie) is another popular no-code mobile app development platform. Like Thunkable, App Maker lets you build all mobile apps using a visual drag-and-drop editor, without needing any coding knowledge or help from a programmer.
However, unlike Thunkable, App Maker has pre-made templates and themes. Additionally, there’s a bot called Snappy that helps build your app, provided the app fits its pre-suggested categories. Unfortunately, this template approach won’t produce a unique app, but you can always customize it in real-time after it's been created with the drag-and-drop editor.
It’s also worth noting that App Maker has specialized features and templates for creating eCommerce, restaurant, delivery, and other business apps.
In the next sections, we’ll look at two of these features, but the principles of starting with a template app, adding the relevant features, and customizing the layout apply to all App Maker apps.
Create an eCommerce Mobile App
App Maker has a “Store” feature, which you can add to a mobile app to transform it into an eCommerce store. Once this feature is added, you can begin building and organizing your store by:
Creating product categories.
Adding products under each category.
Customizing attributes for each product like color, size, model, price, etc.
Changing the app’s UI using the drag-and-drop editor.
Adding push notifications, social sharing buttons, creating coupons, loyalty pages, and other relevant eCommerce capabilities.
You finish the setup process by selecting different shipping rules and the payment gateways that you wish to accept.
App Maker also has extensive tutorials, so check out the video below for more details on how to build an eCommerce app:
Quick Note: If you already have a Shopify site, Andromo (another popular mobile app builder) lets you quickly convert it into a native mobile app.
Convert a Website into a Mobile App
Converting websites into mobile apps is another widely-used App Maker feature.
The process is straightforward, as you only plug in your site’s URL and App Maker starts creating an app for you.
Then, you can make the following customizations:
Organizing your app’s layout as a list, diamond, fixed matrix, 3D slide, and more.
Choosing a dominant color scheme.
Customizing fonts and colors.
Adding icons, images, and backgrounds.
Incorporating mobile push notifications to engage users effectively.
Again, you can enhance your app’s functionality by adding 200+ features like push notifications, chat support, forms, app purchases, and more.
Learn how to create a mobile app with App Maker in more detail in their 10-step guide on building a no-code app.
Next Steps: Choose the Right No Code App Builder and Get Started
In this post, we looked at two different kinds of no-code app builders: One for web apps, and one geared more towards mobile apps.
For mobile apps, we looked at two popular platforms: Thunkable and App Maker.
For web apps, we took a close look at Stacker. With Stacker, you can build all sorts of web apps, including project management tools, budget trackers, CRMs, client portals, and much more, without needing any design or coding skills.
You can use Stacker to create useful apps for your business by:
Connecting to various data sources for your app’s back end — like Airtable and Google Sheets — or housing your data directly within Stacker.
Customizing your app’s front end by adding buttons, changing views, switching colors, and much more.
Adding users and setting granular permissions for what they can see and edit.
If you’re ready to build your own app with Stacker, sign up for a free 30-day trial (no credit card required).
