Tuto: create an app for your BDE
Developing a mobile application is not for everyone". FALSE!
That was before. In Nocode, anyone can create a mobile application from an idea.
Here's how to create a free app in 10 steps without knowing how to code and how to put it online.
Recently, a member of our team created a smartphone order-taking app for a community café. ☕️ A fun idea made for free, in less than 24 hours and in Nocode thanks to Airtable / Google Sheets and Glide. 📲
💡 This app format could also be adapted to student association tool needs...
Here is a tutorial to create an order-taking application for a BDE that would like to offer self-service products to students at its school.
💰 The idea is tofeed the BDE's budget through the sale of all kinds of products: merchandising with the school's logo (sweatshirt, cap, water bottle, etc.), sale of tickets for events (student parties, happy hours, ski week, integration weekend, etc.) or for a cafeteria stand in the school.
To raise a little money every day and have funds to prepare events or to party. 🥳
💡 The principle of the app is simple: via the app, everyone can help themselves to free access to the BDE shop. All orders are listed in an Airtable document, so that everyone can settle the bill later. In this example, we will consider that the products are drinks but you can customize the types of products/services as you wish!
No technical knowledge is required to follow the tutorial. Everyone is welcome. 👋
All the resources used to make this Nocode mobile app creation tutorial are available for free. 😇
Step 1: Create a database on Airtable
To get started, go to Airtable.
After creating an account, we will make a new database by clicking on " Add a base"on the home screen of the platform.
We will rename our database. Here we will call it " Caisse BDE - Alegria.academy"by clicking on the name of the database.
Step 2: Create product categories
Six columns should then be created for the beverage categories. These will be used to present the offers available for sale.
- A first one called " Product"which will contain the name of our different items (here drinks).
- A second one to include the price of each product. Don't forget to click on the little arrow to the right of the column box, and then click on " Customize field type".
Then click on the tab " price"tab and add the Euro symbol.
- A third column will contain the images of each product.
- And finally a fourth one, which should be called " Description"to explain the composition of the products.
Step 3: Fill in the cells of the Airtable database
You can fill in the boxes as you wish. Here we have added 4 randomly chosen products that will be available for sale: soft drinks, beers, pens, a ready meal, the dessert of the day and a printing service.
It is of course possible to add products of one's choice, such as sportswear, goodies, tickets to events or parties etc.
To add new products to the list, once the application has been created, it will be sufficient to add a new entry in this data table.
Don't forget to add images by clicking on the corresponding box in the column and pressing " Drop file".
Once your database is complete, it should look like this.
Step 4: Create a second table on Airtable
We will create a second table on Airtable. Just click on " Add or Import"and then click on " Create empty table".
Once the table has been created, it must be named as follows: " The new commands".
In this table, three columns of text are required Name", " Address"and " Product ".
Step 5: Create an account on Glide
Now you have to go to the Glide website to turn your database into a mobile application.
Step 6: Create the basis for the application
To create an application, go to the home page and click on " New Project 1".
Next, we have to choose between mobile application and web page. Since we want to create a mobile application, we have to click on " Glide App"and fill in the field corresponding to the name of your application, here " Alegria.academy Caisse BDE".
Then click on " Airtable"to select the source of the data that will feed the app.
And choose your previously created Airtable database.
Step 7: A first preview of your application is available
You can rename the main page of your application by clicking in the " Label ".
You can also choose the style of your application. Here we will keep the default one, namely " List". This means that your products will be arranged, as the name suggests, in a list.
Step 8: Create an order button on each product
To create an automatic e-mail to the BDE cashier's address, click on the small arrow to the right of a product.
Then press the ' + ' in the drop-down menu under the menu bar. And choose ' Form Button ' to bring up a new order taking button.
Then in the settings panel on the right of your screen, you can rename your button as you see fit. Then click on the drop-down panel " Action"and select " Add Row ".
A new window for customising the button appears.
In the field " Sheet"field, you must put the table " The new orders"
Then in the Address box, add " User's email address".
And finally in the product box " Product ".
There is no need to worry about the "Is Favorited?" field in this use case.
Step 9: Create an order button for other products
Once step 8 is complete, simply repeat it on each of the products to finish designing the application.
Step 10: Time to publish your application
Congratulations, you have completed the creation of your application.
To publish it on the media you are interested in, simply click on the " Publish"button and follow the steps suggested by the site.
Each new order will be recorded on Airtable in the " New orders ". All that remains to be done is to automate the sending of an alert email for each new order.
Bonus Step: Be automatically alerted by e-mail of each new order
If you would like to receive an e-mail alert for each new order, please go to Make.
Once logged in, on the home page of the site, click on " Scenario".
Then click on Create a new scenario".
On this new page, a bubble with a huge " + " appears.
You have to press it and look for the Airtable application.
Once Airtable is selected, click on "Watch Records".
In " connection ", you must choose " My Airtable connection "then select the database we are interested in, i.e. " Caisse BDE - Alegria.academy "and finally choose " The new orders "in the field " Table ".
In the settings pop-up, you must now fill in the boxes corresponding to the Trigger part.
In the Trigger field, put " Create Time ".
💡Attention: If Airtable does not automatically build a " Create Time"in your Airtable database, it is imperative that you add one.
Then " Name"in the label field.
Congratulations, you have set up half of the automation.
From now on, Make will perform an action each time a new row is added to the " The new commands "in your database.
Now it's time to add a Gmail event following this trigger on Airtable.
To do this, press the " +" at the bottom right of your screen.
Then select " Send an email" .
Finally, you need to add your email address in the " Connection " field.
Then fill in the ' Subject' and ' Content ' tabs as you see fit.
🙌 Well done, from now on your email address will receive a new message with each new order telling you the user's first name, email address and time.
💡 Going further: this application is not intended to be a professional app for a commercial establishment. However, it is possible to improve it on many points. Starting with the design part which can be modified according to taste. It is also possible toadd a Stripe payment module.
It is also possible to add a dynamic stock management system that allows you to block access to the order of certain products when they are no longer available.
Feel free to use the tool templates provided to create a custom application that meets your needs.
🔥 Resources: you can duplicate our Airtable database if you can't pass a step.
And here is the QR code to download the app or duplicate it. 📲