Create your own mobile app - Glideapps

Hello everyone my name is Cristian and welcome  to NoCode with NetMinds a series to learn   how to put your ideas into motion using tech  without having to write a single line of code   today we're going to learn how to create a mobile   app from a spreadsheet in just  a few minutes let's get started   so this is our first video of the series where we  want to share with you our experience using NoCode   tools which has been amazing for NetMinds I've  been a project manager for many years and I always   imagined the solutions but then i had to explain  that to someone else usually a software developer   to build it over a year ago we discovered no code  and now I can build my own apps automations and   tech i got so excited that i started to spread  the word about it but i discovered something   getting started with it is not that easy because  there are a thousand different NoCode tools out   there and if you don't have any tech background  or knowledge to understand the structure   and logic behind software or applications you  can get turned down by it easily so that's when   we decided to do something about it and from  our own background and experience we created a   framework for any non-tech individual to learn how  to build solutions with tech now how does it work   well we found out that the best way to learn is  by doing so today i'm going to explain to you the   general structure of any mobile app by building  one yeah that's right by the end of this video   you're going to learn the basic structure of any  piece of software but also you will have built   a mobile app by yourself in just five minutes so  before we get started let's take a minute to learn   the first three tech concepts that you need to  know the front end the backend and integration   to explain it let's have a look at the app that  we're gonna create today for this example we're   gonna build an app where users can create  and share information about something they   like it can be about music podcast tv series books  something that you like in my case i'm gonna build   one about blog posts as i really love reading  about new things every day and blogs is one of   the best ways to do it so before we get started  let's take a minute to learn the first three tech   concepts that you need to know the front end the  backend and integration to explain it let's have a   look at the app that we're gonna create today for  this example we're gonna build an app where users   can create and share information about something  they like it can be about music podcast tv series   books something that you like in my case i'm  gonna build one about blog posts as i really   love reading about new things every day and blocks  is one of the best ways to do it so the first part   is the front end which is everything the user  of the app can see and touch so here you can see   that the user can for example see all the articles  that have been posted they can see the individual   article they can open the article event and  add them to the favorite list they can also see   their own profile right they could see their email  and even put a nice picture of their profile then   you have the back end here is where all the logics  and calculations happen this can be the trickiest   part but you will see after building your own app  that is not that hard here you will find the most   important part of any app and this is the database  every app every software that you see online   is all run by data along with all the parameters  and the analysis that needs to be done in the back   everything needs to be structured according to  how the data is being put so that's why we are   starting from our Google Sheets because that's  going to be our initial database so finally   we have the integration which is the way data  connects between the front end and back end and   between different apps for example in this case  when i'm sharing my favorite blog post from last   week in this case this one from Marvel and when  i click send it goes directly to the database and   gets added to the shared directory so you see here  that once i click add i just added a new article   on the blog post and when i go to the database i'm  gonna see this new article added right so that's   because Glide has already done the integration for  us and we're gonna learn a little bit about that   in a few minutes after having the idea of what  you want to build the first thing you need to   create is your database in this case we're gonna  use google sheets we're gonna create a worksheet   with two sheets one to store the users and  another one to store the items users create   you're gonna see that the database is the backbone  of every app you create because tech is run on   data first we're going to create a sheet to store  user's information we're going to call it users   something very important to learn about databases  each record needs to have a unique identifier   in this case it's going to be the email of the  user we're gonna add another field called username   and we're also gonna put one called profile  picture for everyone to have a nice picture of   them on the app and we're gonna create our first  user this is gonna be the test user for our app in   my case i'm going to put it like [e-mail] it  doesn't matter the name that you put there now we   need to create the structure of each item users  can create in our app we're going to create the   fields we want the user to input to create an  item so we're going to create a new sheet we're   going to call it items we're going to add those  fields in my case i want every blog post that   people share to have a title an image related to  that article a category that the user can choose   obviously the link to that article and i want  to ask them why they found it so cool why   is it cool finally always remember to name  the file because this will help you identify   the database when creating the app in my case  i'm going to call it amazing blogposts once   you have all this we're going to go to glide  apps which will do almost all the work for us   it's going to create our backend our frontend  and integration from this simple spreadsheet   now we're going to head to this website  glideapps.com i'm going to create an account   you see this phrase build an app from a google  sheet in five minutes for free we're gonna see   how true that is once you register you're gonna  click here at new app and it's gonna tell you to   select the google sheet from which we want to  create the app it's gonna ask you to create a   link to your google account after you do that  you're gonna be able to select the spreadsheet   that we just created so here you're going to  select the source google sheet click continue   and then you're going to choose the spreadsheet  that you just created amazing blogposts in my case   you can see that the app is almost created but it  doesn't look so nice and it's not working properly   so let's configure it the first thing we're  going to do is that we're going to create   our first integration we're going to tell glide  where you should store user's information and   connect it to google accounts so we're going  to go here on the top the last option here   and we're gonna go here to privacy we're gonna  choose public with email and allow sign in with   google account now to finish we're gonna click on  these three lines click on the little image here   and go back to the option here on the middle here  on top once you're here you can select the source   here we're going to choose where we want glide  apps to take the information from the users   so here we're going to select the  sheet that we created called users   so here you're going to tell glide each field  where it goes now in this case for example the   name is the username the email is the email and  the image is a profile picture now you can test   it out in this case i'm going to upload a nice  picture of me as a profile picture let's take this   one for example you can see here is uploading so  once it finishes you can see that the profile is   already created and if you go back to the database  here is the first option you're going to see that   the profile picture is already stored there now  you can define some general attributes on how you   want the app to look like the colors and the icons  after we do this we're going to shape the front   end and the integrations so you just go back here  this third option and you go to appearance here   you can select which color you want it and how do  you want the interactions to be and in this case   i'm going to just choose for example this little  blue here i'm going to let it with this option   and also if you go here to app info you're gonna  be able to change the name and you can even change   the icon that people will see on their smartphone  for the app so in this case maybe we want to   change it for something more relatable to your  app and i'm gonna search for for example right   i'm gonna leave this one okay now we're gonna  tell Glide how we want the users to see our   app in this case we have already defined the user  profile but now we need to configure how the user   will see their own profile and how they will  see the list of items that have been shared in   our app in my case the blogposts and you can even  configure how they will be able to search, filter   and what detail you want to show them about each  one of those items but before doing that we need   to add the ability for people to create their own  article so that's the first thing that we're going   to do we're going to create a form where people  are going to be able to create a new blog post   so we're going to go back to the option in the  middle here to change our front end i'm going   to click here on inline list and here we're going  to click on add form and select this option allow   users to add items so you're going to see here  that plus is going to appear you're going to   see that when you unclick it it disappears  and you click it it appears so we're gonna   leave it like that we're gonna click on that  plus so once we're there we're gonna see that   glide already created a form for us but it doesn't  have any format it doesn't look so nice so we're   just going to eliminate all those records so here  you can click the x and you're going to eliminate   all those records and we're going to create each  one according to the format that we want so we're   going to start creating one field for each one  of the columns that we have in the database   so if you don't remember which one were those  columns you just go back here to the database   and here in items you're going to see the  five columns that we have so we need to   create one for each one of those so we're  going to start with the title for example   so here you just click on the plus and you  look for an option that's called text entry   so you're going to see that it creates the  field but it also links automatically to the   column that we had on the database now we're going  to do the same with the image for the article   but we're going to choose a different  one so in this case it's image picker you're going to see that the person is going to  be able to click here and go to the directory on   their computer to select the image so the next one  is the category so we want people to have like,   different options to select on that category for  that we need to create a list of those options to   do that we need to create another table so we're  gonna do that inside glide we could have done that   before on the google sheet but this is a good  way to understand also how you can do the same   on glide so to do it we just go back to the  database here on the button on the first button   on the top and you click here and add a new table  and this plus over here so you're gonna create add   new glide table and you're gonna change the  name here we're gonna put the name category   and what we're gonna do is that we're  gonna delete all these fields because   all we need is the name of  those categories so delete so in this case i'm just going to create  four categories for this example so   i'm going to use for example politics  sports video games and let's say lifestyle   and that's it so we're going to go back to our  previous screen here in the middle and we're gonna   add that field here on the plus and the one that  we're gonna choose is choice actually you can see   here that it's taking the title again but we need  to take a different field so in this case the data   is going to be the category here and the values  we're going to take them also actually from the   category this is the source of the values that the  person can select on the field and the values are   going to be the name of each category so you're  going to see here that that list is going to be   populated by the the information that we filled  in before according to the number of selection   you can also choose how you want it to look so for  example in this case you can have it like a list   like in this way here or you can even change  it so when you click here and you click here   you can have all the categories listed and in a  row and always try to make every field required   so people will not let that field empty when  they send the form so let's finish up with the   last two fields uh those are gonna be one is the  link so this is another text entry so remember   always to match the type of information that the  user needs to input to the format of the entry   field that you're going to create here so we're  going to create a text entry and it's going to   automatically take the link so that's okay and  finally the question that i was asking my users   about why is it why that article was cool so it's  the same text entry but there you have it that's   the form so as i was saying before, remember to  check the fields that you need to be required   that they have the option clicked here it  requires i'm going to do that for every field here so we're going to check our form I'm going to  create an entry here that our first enter the   database right so I just have here a blogpost  that I'm gonna create so I'm gonna paste the   title i'm gonna click here on browse to find an  image I already have an image prepared here this   one and it will start uploading then a category,  in this case, is let's say it's about lifestyle   than the link of to that article and then why  is it cool because it's trendy I want to say when you have all of that you click add and  it's going to create that item in our app and   you can also check in the database that the item  is created and it has stored all the information   so now you can format the list of items in your  app so in here when you click here on inline list   you're going to be able to change the format  on how you want everything to look it could   be in a list it could be on tiles i prefer tiles  for example in this case but you can see that it's   not taking the image that we just uploaded right  so we need to change that so here we're gonna tell   glide where the data is coming from right so  you can see here that it's not right the image   is saying that is in the category but that's not  correct so the image we need to put it in image   and it's going to change here right you can see  and it's important to have this option according   to according to your needs right allow text  wrapping because it's gonna be able to accommodate   all the information that you put in all the screen  right and in this case we also need to change your   details i don't want to show any details here  so just leave it empty and there you have it so   we're gonna go down here when it says overlays i'm  gonna select this one called tag and we're gonna   put the category and you're gonna see here that a  little tag has been created with the category of   that article so it looks much nicer so to finish  the test i invite you to create some more items   so our database looks a little more populated i'm  gonna do that and you're gonna do that as well so   now you see there i have created three entries  now what we're gonna do is format how each one   of those articles are gonna look like when i click  on detail so i'm gonna click on one of them you're   gonna see it looks terrible again right so we're  gonna do the same we're gonna delete everything   and we're going to go at everything again so most  NoCode tools have some features where you can add   items that are preformatted in this case we're  going to use one of those features right so you   click here and you select this option called title  right you're going to automatically create the   first part of our blog post so we see that there's  some information missing here so we're going to   add that we're going to click here on plus i'm  going to select action test it's going to put the   questions on that field and also the answer to  that field so for example in this case why is it   cool because it's trendy right so in this case  we're just missing the link so we're gonna use   another feature that is called a button right so  we're gonna click here button and you click button   and select here what is the action that that  button is going to take that where the person   clicked here what you want the app to do right  so in this case what we're going to select   is going to choose open link here and the  target is the link that we have so in that   case whenever one person clicks here on go it's  gonna open the article that was just posted   finally you can change what goes here so  for example here in the title i'm gonna put   go to blogpost so we're going to do something  very cool we're going to allow each user to   have a list of favorite articles that will go  to a personal list so to do it it's very simple   because glide is going to do almost all the work  for us again right so we're going to click on   any of the articles i'm going to click here on  plus we're going to find the option favorite   and it's going to add this little button here  right and now we can format it right we can put   the label here let's for example add to my list  and then on this label could be blog post list so we're going to go back to our database we're  going to create a field that is called row id   right so i'm going to hit on plus and here on  column type we're going to go to row id this is   going to be the identifier of each one of those  titles so what this is going to do is going to   create a stream that is going to identify each one  of those items now we're going to go back here and   when you click here on add to my list i'm going  to see that for example this article is also on my   blogpost list right and if i do the contrary for  example in this case unclick the add to my list   and go back i now see that my blog post list  is empty right so now it's all linked another   thing to take into account is to take  out the information that we don't need   for the users to see right so in this case for  example we only use the information from items to   show it to users right the one for the users we  don't need to show them this so you can just hide   the information here because as you remember we  have here the three lines and the little circle   here they can see their own profile so we don't  need that one and there you go you have your   first mobile app now you can share with all your  friends to do that you just click here on publish   and publish app and after it finishes  the publication you can even change the   name of the link right so in here i'm  going to put in this case amazingblogs and that's the end you can click here copy and  you're gonna get the link to that specific app   right so now you can share it with your  friends where they can download the app   and put it on their smartphone or everyone can  open it on their browser so this is the way that   is going to look like for each person that enters  or they can sign in with a google account or they   can just create it with any email address so there  you go you have just created your first mobile app   with some simple functionalities but that's just  the start that's an amazing start we can then add   some cool stuff like for example integrate it  with other tools to send weekly updates about   the articles that have been added or even chatting  or messaging features for people to talk to each   other is all up to your imagination and the  last thing please stay tuned for the following   videos the easiest way just subscribe to our  youtube channel or follow us on social media bye

Channel: NetMinds

Views: 5,100

Keywords:

Id: lvTagti-ono

Length: 20min 15sec (1215 seconds)

Published: Mon May 17 2021