Implement CRUD (Create Read Update Delete) in FlutterFlow for your Web and Mobile app projects (NEW)

foreign hello guys uh good evening uh good to have you guys here I can see uh all recipes yeah hello all recipes so basically I will just call you by the name that I see here so please if I told you here just say hi oh hello so that I can I can know who is here and then I will of course greet you back it's good to be here and uh we will start the class like really soon and sorry for being uh slightly behind Shadow really sorry I had some technical issues at my end uh I'm excited that I was able to fix that immediately okay so um yeah welcome uh wisdom yes we are doing good um when I'm welcome uh Joseph welcome great all right so we will start very soon but let's just give some time for other people to jump on the call as well right so it's will be uh as short as yesterday's class we will try to see how we can just like implement this like really fast um uh yes welcome uh Siege Health welcome desire welcome okay so we will start very soon let's just give some time for the people to join and then we can start um okay all right so I think we're going to start like right now uh check out welcome uh okay so while we're waiting for others to join we will just should should hope immediately uh or Demi welcome okay um oh sorry it wasn't chica it was chilaka sorry please welcome okay okay so um uh please if you guys can hear me please just let me know that I can be heard before I start because when I start sharing my screen I want to be able to like see uh the comments again yeah so please if I told you can hear me uh please let me uh no just drop a comment for me so that I can know that you can hear me yes I will start immediately meanwhile today we are going to be learning how to implement a crude okay uh UNAM thank you very much seychell thank you very much okay so um Meanwhile we're going to be trying to uh understand how to Implement crude yeah crude in in Florida flow so uh one of the basic things you need to learn when you when you start uh you know trying to figure out ways to build an application be it a website or a mobile application is to understand crude crude is an acronym for create uh read update and delete so um if you understand how to create how to update and how to delete then um and of course how to read right then you have already gone far in understanding how to use flutter flow that's what we're going to be doing today like we're going to do like like right now um okay so uh let's start right away I'm going to share my screen but let me just set myself up here um and let's go to Firebase so uh meanwhile I hope you have sent in your assignments um every single thing that we do during the class is either doing a live class because I think uh the next three days from now uh the classes will not be live there will be recorded classes so I will just send links for you to watch a particular tutorial and then from there uh there will be labor returns yeah so Laboratories will be live but we will have very few live classes we'll be having more recorded classes pre-recorded classes and uh more of uh more of a Laboratories with the tutors yeah so uh because like like right now um so many of you have some issues right have some issues that can be addressed immediately uh and that can only be made possible in a la in a in a laboratory where the tutors are available so um I'm trying to assess my Firebase so that I can start the application immediately all right so uh let's see let's see okay all right this is okay great all right so I'm going to start sharing the screen right now and I um when I share the screen you uh you might not be able to like I won't be able to see the comments that you dropped so just drop the comment I will respond to the comments when I'm like when I stop sharing my screen yeah because I can see I can see this the comments when I'm sharing my screen because I'm sharing my entire screen because I wanted to really see what is going on yeah so okay so this is photo flow we're going to continue with the login application we started yesterday but I wanted to uh call this like in the next assignment is going to be called crude right so uh what I just wanted to do is Implement crude inside your login application so when you're submitting the second assignment you can still submit the same link like what you submitted before meanwhile uh this is how to Simply get the link to your project uh yesterday I forgot to mention that so you come to settings you come to the settings icon here you have to come to platforms first you come to platforms and turn on the the enables deep linking does this web part turn it on when you finish turning it on you come to web publishing and then hit on the publish button when you hit on the publish button wait for a couple of minutes you'll see a link here all right so I think let me just go ahead and do it so um I didn't want to reserve any domain actually sure but it's okay I just wanted to do this so that you can like see it so uh in case anybody has any problem I would just tell them to refer to the first 20 minutes or 10 minutes or yeah 15 minutes of this particular tutorial so they can see it quickly all right so you just wait for a couple of minutes and then it will finish uh publishing the the the link if you want your stop to be excessively uh unique you can choose to edit this link right but you have only three three slots to edit a particular link yeah so that's like it um all right so uh what else so we'll just wait for a couple of seconds and I think we'll come back to look at it but the idea is when it has finished it's going to show you uh the the URL of the application the web URL all right uh and then you can you see an icon here to click that will open to another place we will come back to it let's just uh go back to the application itself so this is logino and we are going to implement uh that's create read uh update and delete we will try to see how we can make this really fast just try to see how you can pay attention where you don't understand you can always come back to rewatch the tutorial okay so um for us to create uh to start with C the create part all right so create um we are going to uh use a form all right so for creating it's more like creating like a you you provide a particular field and then you can create something and uh create something and put it inside firestore so creating simply means putting something inside firestore all right creating means putting something inside fire so that means you're putting a particular information a data inside fire Firebase right Firebase firestore okay so uh this is Firebase for a project you just come here to firebase.google.com after you've already signed into your Gmail account if you don't have a Gmail account you have to create one right so I'll just click here go to console it'll take me to the console for uh uh my Firebase so I'll see the different projects that I have here and I'll just click on the one that I want which is the lugino here okay then after that what I need to do simply is I will come here to uh fire store database this is the database that I already have which was created by default because of the fact that I turned on authentication and I turned on uh I give a Florida flow ability to create a document inside here so I have one collection here so now we want to be able to create all right so the C stands for create I want to be able to create details and put inside here so how do we do it for you to be able to create you have to have some form of placeholder like some sort of container that you can put something inside and then an action button that you can click to tell it okay the thing that I had put inside that container I wanted to create it I wanted to submit it inside the database let me show you what I mean so um here uh this is the uh the column for our product if you see here on the widget tree I'm selected on the column pad and then uh this part was called portfolio I can just click to minimize it then there's another column here I'll just minimize it I just want them to be like this so I can easily see it all right great so there is an app bar here not really necessary uh but this is it it's okay fine we're good with it all right then uh I'm clicking on the column here I want to put things inside this column so I have to click on the column and um what I'm gonna do now is uh I'm going to just go ahead and add some details inside here so the things I want to add here is just going to be I want to be able to put maybe um a text and uh what should I put a text and uh maybe I'll just put a couple of things right so let's just try to see it Let's uh I'll click on here add a child to widget so this is what I clicked and I'm going to search for text field let me start with text field text field is where I will be able to like type something inside a particular text box and then I can now submit it so I clicked on it this is how it appears it doesn't really have a form right so this is how it looks like so uh this is not how forms look like yeah so um not to worry what you need to just do is you have to scroll down on the right hand side here you see here this is uh the hint text like what is inside here okay but um before we do that let's go ahead and try to give it a width all right so I'm currently using 390x844 right so I will try to see how I can give it a width let me see what width was this 360 yeah so I'll give you the width of 360. let's see if it's going to take that with yes it does so this is it it takes the width 360. I just put the whis here now I want to go ahead and then give it a form like an outline like uh some some some outline around it so that it doesn't look naked you see it looks naked so um but before I do that I will come here to this hint text and say start typing I'll just type start typing right you can write anything that you want to write here okay so then I'll scroll down and then I will um what I want to do is in in this input decoration properties because uh this is the input uh environment right so it has a decoration property so one could be on the line there's outline and there's none so we want outline so with outline it will allow some things to go around it but we still don't see anything yeah it's because we have not given that outline which is the Border I color so you see here the color is not set it's it's it writes here on set so you have to click here and give it a butter color so I I can give it something slightly faint uh something like this uh I believe you can see it but let me just make it a little bit uh let me use a color that is uh more visible uh without stretching stressing it okay so this is it it appears better now yeah okay so I'll click on it and then I need to give uh the the that border some from a radius so I will give it a radius of 14. I click on 14 and uh it now makes it look like this okay beautiful so now there's one more thing I need to do here is the hint text that we change but now we need to put a level text so I want us to just put in uh let's say a name you see name uh what is what it call it name all right so if you can see here it shows here on the screen name you see name all right uh then uh I think this is so far so good we won't really try to do too many things so name uh what else should we put let's I'm going to click on this text field now and click on Ctrl d all right so that's to duplicate it right so this is duplicated I will come here and then add some padding padding is basically what you use in giving spaces around your your a particular widget all right so an element so uh you can give it a cutting on the left padding on the right like padding spaces and then adding on the top so you see here it's it's somehow joined together I don't like the way it is so I'll click on it and give it some padding I will say um eight all right so this gives you some space not so nice I think I would just give it some space and say 16. all right so this looks a little bit better than for these first Parts I will come here and give it spacing and say 40. like yeah something like that so it's better now so name name this one is not supposed to be named I want to put a country okay so I want to put a country let's see uh so let's change this to Country right okay and then uh country what else I think that's okay all right now that we have name and Country uh let's see how we can add some other thing uh that is an input uh widget right so this is an input widget it's a text field so let's try to get more input widgets so I'll click here I'll look for something called drop down all right so drop down just click type and drop then I'll see drop down so this is it I have um a job down here okay so um I will scroll down it doesn't really have uh like so much of things to change but you can just change the width here to 360. okay so we have that then let's give it a padding on top say 16. all right so we have this noun and uh let's see if we can give it some border like border so you come here the Border radius and say 14 so now it has some brother okay so um if you're like me I would like a these do not have a color at all so I will come here and click on the drop down fill color and clear color so there's no color at all uh but I would like it to have a color on its border but uh last time I checked I don't think uh drop downs have borders oh it does okay so Florida is really updating super fast so here I will come here to the Border color and give it this color and that's it all right this is fine now okay so pretty good so we have this now and um what I need us to do now is we're going to go ahead and uh let's see so this is going to be um let's say sex right so or yeah so this is gonna be for like to choose gender sex [Music] um so here uh okay so then we can come here to the option path so this this is a drop down so it has several options and so we will say mail and uh we'll add another one and say female and that's it and uh so the next thing we would need to do is so male and female uh that's it that's for the drop down part okay good now we have done that let's go ahead and click on uh let's add this um let's go ahead and submit like submit these detail inside the database that's where we do creating uh functionality the first part of the crude okay so but but for that to happen we need an action button so I'll click on the add a charter widgets okay so I'm adding all of these widgets inside the column that's why I keep clicking here all right so I will go ahead and then click to add a big button here so the button is going to be 360 I guess and then uh I will give it here 20. and uh I think the blue button is fine we will just change the text from button to create yes I want it to be created I have an idea what I mean so create create here in this scenario simply means submit okay so I will change this border radius to 14 so that everything can just be sync okay good now we have this let's go ahead and do some other extra customization so we have here this is called a text field and the name already is a text field we have another one called text field we might be confused when we are trying to make use of it so let's just click on it and come on the top part here and change it like click on here to change the name so that particular one is for name so we will change it to name that's we are renaming the text field so you see here it changes to name good then here we will say uh country so we'll say Here country and that's it so then for this particular part we will not call it job done we will call it sex okay all right so this is it so we now have this properly done what we now need to do exactly to submit these details like when a user creates let me click on this to preview and show you how it looks like uh this actually this particular one doesn't take time to load basically what I did was I clicked on the preview button here but I won't wait for it to finish loading I will go back to check on it but what we need to do is we need to create a document into the database and the way it's done in photo flow is that you need to go ahead and create a collection like the the folder that these things will be stored inside you have to create it inside a photo flow you have to also click create it inside uh Firebase and they have to have the same spelling and everything so let's do that let's start with photo flow so I'll call these uh data that's called it's a user data okay so user underscore data I will copy that once so why I copy this because it's good practice to create a collection in Florida flow and simultaneously you have to go ahead and create it in uh Firebase so that you don't get to make mistakes in your spellings so I'll just place what I copied here it's just good practice click on Auto ID all right uh I believe you saw what I did let me just cancel this so I clicked on start collection and then I paste this and then I click on next then I click on Auto ID all right and then I will just go ahead and add the fields that I that I need for my product so my product requires what requires name and the name is the data type is going to be string we have different data types number Boolean map array and all timestamp and dew point we will we will you will see them as we use them okay so this is string because it contains all different characters B text numbers uh you know different things okay so here we will say um country country is also going to be a string and then the last one here was uh sex so sex is a string uh yes so it's a string as well and then uh while this is still up here still come here and click start from scratch you want to also set up the schema what we did here is the schema all right this data structure and then we have to do the same thing here so what do we start with we said name is a string the same thing you did the same thing you do here so uh country uh data type is a string as well you click on check and then um RSX is going to be uh uh string as well and that's it so we will come back here and just click and save all right so now everything works out fine uh Firebase will show us the default here so the idea is there has to be default here and you have to set up your structure here as well before you can go ahead and create a document that submits some things inside uh Firebase all right so uh let's go ahead and submit this from information that's to create the first part after we've created we will read then we'll update okay so and we will do all of that in this same page yeah or we can do it in an app page uh yes we will just do it in another page preferably another page okay so I'll click on this to create what I just need to do is I'll click on this button and go to action right so I'll click on the action here and then I'll add an action now what action do I want to add I want to add an action that says that is done under firestore so I'll click on firestore and then you see here we have create document so basically all the things that you need uh the crude is here so this create this update there's delete there's a read read is back-end query I will show you that immediately after this so we will click on create document and then it will ask us what collection do you want to store like do you want to create this document inside what exactly is the document let's come here to Firebase so this is the collection and the things that are inside these collections are called documents so you see here we have ADD document okay so that's what it is all right so we will come here to collection and pick the collection we want to use that data then we need to set the fields like what fields are we collecting from this form so that we can actually create them as a document inside Firebase all right so we will say I will click add field I just always like clicking all the available Fields then for the name you now need to pick where Florida flow will pick the information for the name from and so that's what it says here value source so the value source is not a specific value we want to change it from specific to from variable okay and then because it's going to be a variable it's going to come from somewhere and then we click on onset and we go to widget State and we pick the the text field for name you see how Y is good to to name them otherwise we would have seen something like text field text field you know drop down right so now we just know it's a name okay then we'll click on country and then come to a specific value from a variable click on unset you go to widget State and pick country good then we go to sex and here we will have sex here's gender okay so I think maybe I'll be using more yeah it's the same thing so uh click on a specific value change it from to from variable click on this and say widget State and then we will say sex okay uh okay great now that we have this we're done actually guys so we we have created the document all right um so but let's just go ahead and then add an extra action so what I do is click to open the action flow editor and then I'll add another extra action here basically the snack bar I like to see a snack bar it's more like a successful message kind of thing so show snack bar and say document created okay great all right so we've done the document created and uh we're good okay so this is it now we can test this but uh I want us to implement create and read before testing then from there we will continue like that and do read and delete before testing all right so two before we test because we don't have much time all right so let's click on this and uh quickly uh uh implement the other part so create this was the button for create let me add another button immediately here that says uh preview let's say document I would say preview okay can we do that okay guys I think I will just do everything on the same page I really don't want to make it super complex and bulky alright so let's reduce the time that we want to use suspendedness so we will create the document here and we want to show it here all right so I want to show those details how do we make it show like read I'm reading is basically uh backend query getting information from this we've done that before uh yesterday but in a small version let's go big now so how do we do read uh basically you need to have a particular widget to hold the information you want to read from the database okay so um let's say uh let's say let's go ahead and click on row all right and then add um let's add a text field okay let's add a text field here this text field is going to hold the details for name and uh let me give you some padding here from the left and say 16. okay great Let's uh give you some padding from the top let's say 40. um yeah it's okay so name and um uh let's go ahead and uh what else what else so let's duplicate this so duplicate this name this is going to be for country country um okay and then this is going to be for for sex so all right so um this is it so we can say this name here you see name we will just say let's go ahead and duplicate it Ctrl D to duplicate the name because one will be a placeholder while one will be dynamic from the database so here is just a normal text so we'll put something here and then here will be the normal country let's Ctrl d as well normal country um and then here we'll be of course I get what I mean uh let's say Ctrl d I can read and Ctrl D to duplicate okay so I will just put that here and we're good all right so now we have these informations right we are really good uh What I want us to do now is I would like it to just be a bit orderly yeah so let's say uh 25 [Music] um I just wanted to align somehow okay 27 uh so guys I'm just trying to see how I can make this a line okay so it's like this so let's say this one is going to be 35 40. I'm just giving it some padding so that they can somehow be on the same position it's not necessary but I feel compelled to do it all right so I'll click on this and make it bold I'll come here to normal and say bold I'll come here to text to Country I'll click in here and change it to bold and then here click on this and change it to both good so we have this informations now what we just need to do is uh we need to go ahead and click on like get this information from the database now all right so um something is happening that we need to do uh hold on guys I I would like to do something I would like to put all of these things inside a column right I would like to put all of these details inside a column so I'll come here to the widget tree and uh try to like like I'm gonna right click on this and say wrap widget in a column okay so I'm putting it inside a column I will tell you why I'm doing that because I want to give it to query the column itself so that it can give me details of what is inside I will explain so then for these um okay so I will try to drag this and put inside here uh it didn't enter so close this and drag this inside here it didn't still enter why okay it doesn't have to wait till it's loading Okay so all right so I have uh everything is reversed now let's click on this I'm just basically trying to wrap all of this inside the column um okay so I will just try to this is supposed to go here and then this okay this is I'm just dragging them down to reality them so name uh I think it was sex last [Music] um yeah so like this okay so that's it so we now have all of these things inside a column this is what I wanted to have so noun uh let's give it some padding here 20 again so now we have our date information I'll click on the column and I want to query the column because you can only uh be able to like read information from the database uh what's the simplest way of explaining this so uh if I want to go ahead and get information from the database that can give me details of the name country and sex according to what was submitted here then I need to query the environment I can still just query just the row here but I have to do it multiple times I have to do it for these do it for these and do it for that I don't want to do that for all of that I just want to do it for just one thing okay with time I think you get a hang of this so I'll click on column and then I'll come to this icon here it says backend query this is where we implement the read scenario so I'll click on ADD back and query click on uh on set query collection I'll go to the collections I want to query it's going to be user data I want it to be list of documents well I don't really want it to be list of documents I just want one document so single document yeah but in some scenarios you will need to get a list of documents but in this situation I just want just one document because if I wanted a list of documents I would have put it in this review so I just want one single document so I'll click on confirm and that's it I've created the queried this particular place but now I need to go ahead and steal uh like select the source of these the source of the the input here right so I'll click on this and then click on the small icon here and I'll go to user document use a data document what we have here you can't have these if I told you did not query the screen uh query the column like I did so you have to follow the step just like that I I click on this and then I will say name so it shows your name okay so I click on this come here go to user document and say country good I'll click on this go to um use a document and say sex that's it guys so um I don't intend to uh click this and keep updating it or something so um uh there's something I would like to do else right I would like to do something else which is a little bit good uh so because later on we will need to create um that will now make it a list view scenario I didn't want to do that so let's just leave it like this and not make it complex at all so when we are submitting this form we'll just submit it once we will have other classes where I will show you how to implement uh submitting data in a form multiple time and then making it show in a list view all right so uh but for now this is what we're going to just focus on so we have implemented create and read immediately so I would like us to just run it and see so I'll click to run it um it will take us a couple of minutes to show us what we are supposed to see but uh while waiting for that I will just want us to it's going to take some time so I want us to go ahead and proceed to update and delete so how do we Implement update and delete so we just need another form another screen right we just need another screen where we can put some information and update it so what I will do now is I will go ahead and then first of all duplicate this home screen so right click on it and duplicate the screen uh I'll call these uh I'll come here and update the name no no not that click this and update the name to uh update updates maybe update okay so we had okay let's just say update uh all right so we now have these I will go ahead and then delete uh no I will leave this here yeah I think I'll leave this here uh yeah I'll leave this here and then here is gonna be for my update okay so um good let's go back to the home and then let's give an icon let's just add a button here that says edit something like that so um I'm not really paying attention to design here guys okay so I'll click on this and add a button I will call the button edit okay so um edit and uh I will try to make the the list okay so run mode is finished we will check it out but let's uh with here is gonna be 360. now change the color to I don't know not very fine with colors this is so cool I think at first I thought it wasn't cool but it's cool all right so 14. and then let's give it some padding a safe routine great so we have this now I will click on this I want it to redirect when the user clicks on this it should take the user to the update screen so I'll come to action then click to add an action and I'll go to navigate to update good and then I can make it make the transition to like slide up okay so this is it very good all right so uh we'll come to the update screen and um we'll come to the update screen and uh what we will do now is um what do we do yeah so this is the form we've already set it up for creating so what we will do is I I don't want us to waste so much time so click on this to open the action flow editor and if you see here it was to create I want us to change this from create we'll go back to firestore and say open date document all right so update document it will require us to put the details again okay so click on this and then uh we need to say um select reference to updates okay yeah so we wanted to update uh oh okay so um let's see let's see I see um we need to update uh reference we're supposed to get like um the other details that we can get it because we have not queried the screen okay so guys we will just delete the whole of the um I still need the whole of these yeah we'll start it all from scratch delete action chain yep good so this is still here this is all of this is still here but now what we need to do is [Music] um I am going to do something okay so I think uh let's click here to add uh an AB bar style for let's click this and delete it yeah just click this I want us to be able to take us back so I'll click this and see if it has an action yeah navigate back good so we'll leave it like that uh the reason is because I want to take off this particular column great I'm taking it off and then uh good good good so I'm taking that off this will show this nice then log out uh we don't need these to show here so I will just take this off take this off and take this off as well so I'm just trying to make things a little bit neat okay so um let's see uh okay um foreign uh okay guys uh so sorry about that yeah yeah I noticed uh I I had some technical issues there I dropped it on the group that we will be back in less than three three minutes and we're back sorry about that um okay so I will quickly share my screen again um this is one of the reason why we're going to be having more recorded classes yeah so from the next classes we will have more of recorded classes um let's see this was what we wanted to fix and um I'm just going to uh let me just try to put this in the center R16 or yeah that's okay so we have these uh this is our screen now and so I was trying to just make everything cleaner and neater and I think I have achieved that purpose let's see how we can finish up and create delete and that's all okay so uh we're back with these and uh what did we need to do we need to create we need to be able to update so let's change the name on the button first so that I can get like to really know what I'm doing so update okay so this is update and then here is our Fields good so uh but first update first update we need to query um we don't necessarily need to query we just need to be able to like uh update directly but it needs to have a a source okay so I think the best thing we can do here is uh push data from from here to here but let me see two ways we can do it uh let me see two ways we can do it oh meanwhile let's just first of all take a look at what we did first for crude and uh for create and um read all right so I already have an account so I will just sign in it's just a continuation of what we did the last name okay so I'm just copy it in case um so uh login push this away okay so now we have this okay so it shows me this information right it's a login successful shows me this information and I just need to go ahead and put my name David Rock and then here I'll say Nigeria and then for the sex part I will just click and choose mail and then click and create okay so automatically say document created it fills this place up for me you see it's not coming from the database now good information now we're done with the create and uh create and read right so we created we have read uh okay so let's go back and complete what we're doing here we just want to do update let's say I made a mistake with my name and I want to change it okay so that's what we're trying to do here um for dating click on this or there's something seemingly not looking right so let's see we need to update uh update it says select reference to update I want to actually update not the authenticated user all right I want to actually authenticate some sorry guys uh I blacked out again yeah I think my device is actually overheating I do not know why and uh because it overheats just recently and it goes off really sorry really sorry about that well done for staying staying on uh I think I'm gonna have to like run really fast now um not so fast though okay because I wouldn't like it to repeat again uh okay so this is it and uh this is where we start we uh we need to get um we need to be able to like update an information right so I think at this point I wouldn't like to like waste too much time trying to fix this issue what I rather would want to do is let's update an information from the user authenticated user right so let's say uh it's an email that we want to update right so this is the email right uh let's say we want to change our email for instance so I think we can stick to that for now quickly so um if you want to do that I will just go ahead and then I'll take care of some of these things like this [Music] um again because I want to like be really fast so that I don't have that information that challenge again so let's just update only the email of the user like the email of the user so I will click on this let's change this from a country to email okay so email I want to just it beats the email of the user come on I clicked on that it didn't change why it changed here and didn't change there okay all right so uh here is change okay I have to come here and change it to email all right so I want to just update just the email of the user all right so this okay so I am back again funny enough uh okay so if this happens again guys I will just send you the recorded session instead and uh yeah because of this thing we'll have more of our recorded classes but I really want to finish what I had started right I'm more like a consistent person so let's try to see if it's gonna work out whether whether we will be able to like get it done if not I will send you the record session on WhatsApp okay but if it goes over again I will have to like send my system to an engineer uh okay but I will just go ahead and share my screen again quickly and then we try to see if we can just do it so the the updates pad is what we we wanted to get done and uh so to update it's just email and update and uh so back-end call update document we want to update just the authenticated user so we come here to user reference and then we say confirm and uh I think that's it then we can just click on ADD fields we want to just update the email we go to specific value change it to from variable and come to the widget State and pick the email and that's it so we're good with this right now so uh we can decide to add a snack bar uh yeah so let's say I like to see snack bar even when things are not going fine uh let's say updated who doesn't like a snack okay so this is it and so we have implemented updates now all right uh in subsequent classes I will show you how to do like complex update scenarios okay so the next part is um to delete all right so uh let's let's go ahead and say let's come back to the home part here and then Implement delete let me see what would I like to delete I would like to delete the email that was created but if you delete the email uh that's gonna be a lot of problems right so okay so let's uh let me add an extra field no let's see yeah let's try to see if we can delete the email quickly um so what can we what can we do let's click here all right and then uh this is the profile part and then I want to just go ahead and come to the column here this is okay so I wanted to be in the row I want to just add an icon here that says uh uh let's say icon right so I can it's gonna be icon for delete right so uh Delete it's like a bin okay so I'll pick this so make it red okay and then I will give it some padding here say 150 uh okay so let's say 230 I'm calling this okay so that's it this is the button for delete so I'll just click on these the user can click on this to delete the email oh well this is not practical but I just want to show you a complex part of it we will have Laboratories but I want to like make the tutorial complete okay so we will just come here click on action click on add an action and then uh go to firestore and say delete document select the reference we want to delete the user uh we basically we're going to pick up the reference in the user document all right so that's it so uh with this Nan we can just delete these okay so technically we are done with a crude implementation I will still drop a link to a prerequisite class so that you can see like other things more in detail okay so uh I will just go ahead and just quickly run this and then try to take some questions and then after that we can um we can end the class right because we have had like some some technical issues so far today so we'll wait for a couple of minutes to see the outcome of what we have done and then uh but for now I will stop sharing my screen and take questions okay so lots of persons had already dropped so it's really good for you can also have pressure not to say all right uh yeah I agree I understand it's uh we're not like doing it in real time we're just like it's an experiment okay um okay so uh this particular issue you can try to install free VPN uh add the free VPN on your Chrome just go to Google and search for free VPN add it to your Chrome and uh pick a particular location all right and and try using photo flow again it should work okay so um login problem yes yes the login problem is what I'm talking about right now so if I told you having issues log into photo flow uh the the main challenge might be maybe your IP or something so but what you could just do is uh go to Google uh and and search for free VPN and then just um add it to your Chrome all right so add it to your Chrome it should work properly I will try to see if I can drop some screenshots on the group all right so before my system goes gagger again please let's just go ahead and then take a look at um the result of what we have done so I'll share my screen quickly and then that will be the end of our class so this is the application and uh we have um we have everything working so this is it it has the details here we can log out oh the button is not showing I don't know why did I put the button it's in home okay and this is home I did uh okay so let's try to updates first we will fix the other one later so uh edit let's say I want to change it to uh David something like this I want to just change it to this so I click on update okay so it says updated uh my details are updated so you see here it changes my email to David Rock initially it was no code Africa yeah and uh the cool thing is that it also changes in the in the Firebase so um let's see um the icon for delete was supposed to be here I don't know why I didn't show I don't know why this didn't show up okay so I think maybe we have some challenges there uh just so that my system doesn't like go off I really wouldn't want to have that technical issue again I will try to see how I can get get everything sorted out before our next live class but we will be having more recorded classes okay so I will stop sharing now and um I hope that you have been able to like learn something from the class and sorry for the glitches we've had like three glitches today but resilience I had to just keep trying until we reached the end okay so I will drop the link to the recorded class like the recorded session for this same thing crude so that you can go through it and um and practice it all right if you have questions please just uh drop them in the meet and greets group or send them to me directly and I will see how I can help you out okay see you in tomorrow's class bye for now foreign

Channel: eelspace

Views: 3,315

Keywords: flutterflow tutorial for beginners, flutterflow firebase

Id: 53ZTCMg8WSk

Length: 62min 36sec (3756 seconds)

Published: Thu May 04 2023