Flutter Read data from Firebase Firestore | Firestore Users Collection | Firebase Firestore CRUD

hello guys in the last video uh we are working on authentication I mean email and password authentication with Firebase in flutter now today I'm showing about the flutter firestore database and like iron we I'm going to show you the how you can show your data from the firestore in this video so let's get to connect the files to in our project let's create a project console.google.firevis.com ad project and its name is let's say it flutter .com and have a Google analyzer continue next select account you can create our default accounts create a project so wait for it to complete okay now continue our project as is done now connect to our project we are looking for Android so it's 100 select Android now the Android package name which is go there Android project app and now middle griddle scroll down some you can see the project ID I am an application ID copy this now paste here and restore it okay download the Json file Json file to your I have before I download any so here's two it's nothing better but just for Simplicity I rename it the Google service okay so there is Google minus services.json okay it's done now and go for next here is the important part is first of all you can you have to see that you have Google or move Central in your project already Android okay see there is Google and Central Lotto generated so you don't have to put it just plug the dependencies class path copy it go to the dependency paste here cluster you're done now what about next slides go for there is to plugins don't need the application ID application ID copy the second the com.google.jms Google service copy it go for Android app mailgrill see look for apply plugin here replay plugin copy this line play plugin and paste the IDS here cut it simple for again for the dependency which is implementation copy this line implementation is down here and another is this line copy it and also copy and now there is one thing that don't mention in the page which is I will I am importing the line is the implementation com dot Android 7 multi disk or your app will be crash will not run perfectly I will put in the description this line this line and another line is go to the main SDK version line and paste there the multi disk enable true okay so you are done now run the project and the project you have the metal app and I will have his home page home page is nothing just an app just restart the app let's see our project is running completely fine okay so I think our project is connected with Firestone now check the database the next and continue to console go to the Firestone database for it okay great database so we are testing and select obviously select the test mode before because we are not working professionally and server is you can select any IMD filter notifications okay so our database is created so our creation is done now create a collection so if first path The Collection name is my okay my data or my collection s here so you have to put minimum one document so document has unique ID so you have to Auto generate and field is like name and value is same okay save so our collection is created our document is and there is field same so you can add any field like ID age address blah blah blah okay so our DOT now to connect this database like this as name okay I will build any another field which I called his age age is integer value I mean number and value is like foreign score and another is five Cloud file store so copy that cloud files too paste it here then go for Firebase code copy here and update okay our projected so how to connect so for viewing the file we have to charge sorry second body so we have to Pivot here so this View put it just was children and this is text data like name another list each so Style size make it 35 just copy the line so we have line one as name and the h so basically you want to show the fire restore data like name is name is Sam and age is 15. so so let's create another document let's not let's show you the one like his name is Sam and he's description so here will be showed the same and the age based on our database so so first go to the main Dot put async set widget water binding and shoot initial list okay now now do it while this is not initialized now we're good to go so it was showing in data here first of all we need let's cut the all the so for previewing live data we used to have a stream Builder Builder so it says Acer's stream so and Builder is context and the content snapshot snap purchase foreign what will be to stream okay so basically we have to show data so before showing data let's create a model class which is like the my collection has any ID and which is like name page now you have to put in address okay let's address this ring is USA just be sure so our data has three layers streaming three field okay address name and H so for modding [Music] creation with and and we have to convert it to Json so there is a shortcut for it go for app.quick type.io so our user's name is users okay so our model number is my collections okay users okay um file is Json and select the dot penguise now or ID ID is basically the unique option okay now name and we don't need the username okay username an address mistake okay so pop the full class and create in the leave folder model paste here so I don't know this so we created they just wizard ISS ID and there is ID so ID is actually the Unicode unit so we don't need to record this this ID and this ID is a string and equal is now just just nothing and ID not required so sorry I have to Undo It string ID okay then this ID so and all other things are fine so for the when you call the users it has record three name email address and the IDS not triggered and Factory Json you can just cut the from Dot from Json to static static users now from Json with the problems so dedication make this there are motor class is done so if you have another field like City or email address just put there put another name and go for this another same same four here so I just click same for anything which is string or something so we don't need address also you don't need email we need actually page so basically refactor to pitch and this Edge is not string this Edge is to integral so our ID is string and string name and T so this is the model class you have to carefully put it here single line door is of course some interval so our user model is done now okay there is an another is age which is copy age H H okay this is now good to go so our model is done now showing the data we don't mention ID already so we don't need we have to create we don't need I have this ID okay so basically if we want to show data this use model have to the same types of data in here so in here we have fill another we'll do this ID my string is ID is ready for this also ready okay so let's try to be okay so for showing this ID we have to create a screen Builder which has a list of our users so it has two property which is string another is builder for stream for Builder and the following stream I have to create a math class my epidemically create a method which is a stream copy the list of users call it reducer so basically and the this is where we call our collection I mean the database so it is instance dot collection so what is the collection name our collection name is my collection my collection Dot snapshot dot map event snapshot again the snapshot hit uh copy dot doc Dot map map so which website the users sorry yeah just just users Dot from Json so from Json it will call all the data which is data and to list and just our method is done just call the method in the Stream okay now in Builder this context and we call it snapshot in this snapshot so what will it return before now we have to create else and if any field so for if snapshot as error and that's mean is it it's found no data what will return is written text input we'll see if network has data so it will return something I mean our data so if I create a user playable users which is Snapshot dot data so foreign list view dot Builder I can count these users dot click context index will be stand please tell her title title is text is user index DOT first of all we want to show our view okay oops on the program right there is an error awesome see what is 0.3 the body might compute normally causing null to be returned so if it has zero this says invalid else if if this mean if it has Fine data then user will show the data so what both not work so you have to create an else yes this will return so I mean for loading data we can create a center child Circle indicator after spending same time I don't I don't put return here so is zero now run the application so so see we have lion we have Sam okay just clean restart the app okay so go you have power is alive then Sam so add document outward like name Pokemon [Music] address anyway ID 0 1 0 2 okay an H is number like save so it is the top of this and see my Pokemon here so this is the method you can show your data from virus 2. in the next video we will talking about update and delete thank you

Channel: Flutter With NAS

Views: 2,185

Keywords: flutter with nas, firestore tutorial, firebase firestore, firestore crud, firestore query, read data from firestore flutter, flutter database, flutter firebase firestore, firebase, firebase firestore flutter, flutter firestore crud, firestore flutter 2023, flutter cloud firestore, flutter crud, database, flutter show, flutter tutorial firebase, flutter show database, firestore, flutter firestore, firevase show data flutter, firestore create database, use database in flutter

Id: W0uTcWuRtXs

Length: 23min 44sec (1424 seconds)

Published: Fri Mar 10 2023