Reading Data from Firestore Database

Why next in our Leyb here, I'm going to create a new directory. Let's call this board fire storm like that, that's going to be our app, and when I click again and create and I would like to recall this UI just to separate everything, as you know by now, util. And we can just add one last one for now, model very good and I'm going to add the actual user interface Sadaat here. I say board app. What's import here material so we can also try to import fire stories as a fire story when we do that. Notice that we don't actually get the fire store plugin as we would expect it. So there's a problem here. This sometimes happens. I did this on purpose. So what do you need to do? Let's go back to our pop specs here. Remember what we did with just a cloud firestorm such and we said Pop gets and hope that it would all go well. It showed that it went well. But unfortunately, we're not getting anything. This is a bug, I would say. But let's start by pulling any to see if we can get any version. OK, so let's save this and save perhaps get see if that works. And it says everything going well, let's see if that's true. Let's go back to our board up here. I'm going to say important firestorm and you can see now we have the Cloud Forest or Dodge Dart and many others as well, Firebase. Remember, Firebase is the umbrella, if you will, of fire storm. So very good. We have our fire storm there and life is good. So we can now start invoking classes and functions to connect to our fire storm database. All right. Let's go ahead and create a stateful widget here call board app. This should be probably community board app, but that's fine. Short for Borup. Should probably community board app because that's what we're going to be building incrementally. But it's OK. I brought up that. That is short and sweet. Very good. Let's make sure that I copy this and add to our main. That's what we're going to be calling. And as you know, let's import that so we have access to our board app. So let's go back to our document so that we can actually add a few things earlier. You notice that we created our collection, call it board, and we added by hand a document, which is what we see here. The cool thing here, you notice there's a lot of flexibility. We can add more document, can add another collection. We can even start another collection inside of a collect collections, have more flexibility, as you see here. One of the things also is that we can add a field on the go, but most importantly, we can also edit the field from here as well. So I'm going to click here and notice it shows this field description, the filename to type, and we can add a value. Let's see description. I'm going to say this is my first item like that. They update all offsite. Notice that now we have updated and the description has that text is do the same for our title. So I did say first. Comment and update. OK, let's go ahead and add our document, we're going to say auto, so the field is going to be title with a string. I'm going to give you a value. Second item, the field description is this is my second item, enter and voila. Now we have two items. OK, two documents, persay. Both of them have both of them have these two fields. Very good. We can add as many as we want. So next we're going to be able to see if we can actually go and fetch this information from our database here. The first thing I'm want to do at the top here, I need to create a variable that will point to our board database knowing that we have installed our cloud firestorm store successfully, we now have access to all those methods that will help us get things done. So so at the top of here, I'm going to say far store DB like this, OK? And I'm going to say fire store classifiers to look at this. You can actually access it like this. When I get an instance of our store and then go to collection. Right. Collection. What collection in this case is going to be this collection here? What is what is the name of this collection is board. Hence we are going to pass the path to that collection. Now the path of that collection is just bought like this. OK, once I get to that collection, I want to get a snapshot of all of the items inside of this collection. So this collection here has a document actually has two documents, could have more than two. But at this point, these are the documents that we have added manually. OK, so again, we need to get a hold of that. How do we need that? Well, just say that and snapshot. Forget the snapshot goes and gets a snapshot of the situation that we have in our board collection internally, what documents we have inside. Now, the thing here you have to understand is that because we're dealing still with futures, we dealing with streaming data from a fire story and all that stuff, it gets a little bit complicated when we want to retrieve or send information to the fire storage database. So flatter, as helpful as this framework is, does have a very handy plug in called Stream Builder that really helps us getting information without having to do a lot of work from our collection, from our fire store. So for now, I'm going to return a scaffold first. Can pass an app bar if you wish to do so. Let's give it a title. I will say community board like that. Very good. And for our body, this is where I'm going to just say stream builder as such. There we go. So the stream builder, just like any other builders we have used before, allows us to pass information that it needs to build the user interface. OK, so in this case here for our builder, we need to parse our context as well as our snapshot, which is the data that we need. And the other thing we need to parse here is the actual stream that we are receiving. Well, where do we get the stream from? Well, this comes from what we've created here first or DB. OK, so just passing like that and it will know how to do with it. So at this point here, the stream builder knows exactly what the data that it needs to stream. So to extract things from it and let us put in a user interface. But as you know, by now, the first time this runs, the snapshot is not going to be there. OK, you may take a little bit for it to be available. So that's why we always want to say if Snapshot doesn't have data, so snapshot that has data, so we negating it, if it doesn't have any data, what we want to do, we're just going to go ahead and return, return a circular, let's say, circular indicator like this to say, hey, we're still thinking we don't know yet. OK, if that's not the case, then everything is good. I'm going to just return here a list view builder and just build a list view, which will then extract all the information and show things. So this will builder when a pass context here and I'm going to pass and index, OK? A very good now, you know, also at this point here for our analysts who that we need to pass the item count, which is going to be a snapshot snapshot. I'd like that that that data, that document documents like that. And I'm going to go ahead and get the length of that document. OK, this has to be documents. So we are looking at the documents in this case has more than one to get a look at the list. We're going to look at the length of that to say how many do we have so that our Loserville knows how to construct itself. And of course, this will have to return something and we're going to just return let's just return text snapshot, because that's what we are getting from our builder here. So data can go to documents and for each document because we know it's a list, we're going to pass our index like that. So it's going to go ahead and get each one of our documents. OK, let's finalize with Sumiko in there. Now, what's going to happen here is that this is going to just get the object of our document, right? Meaning so it's going to get just the whole object of our document. We want to go and get each one of these items right. In this case, let's just go ahead and get a title. Well, in this case here, we're just going to go ahead and probe in and get the title, for instance, like that. OK, all right. So let's save this and see if this works. Hopefully all goes well and we should be able to see at least the title showing up. So when you run and you get this very nasty error here, the best way to solve this problem here is to go to build that gradle. And remember, this has to be the build. So instead of app, you go to build that gradle, OK, not the outside one. And in the Maine instead of Maine as the gay version here, you probably are going to see 16. What do you need to do? You need to change this to twenty one. OK, save this. And I always like to rebuild the entire project just to make sure that things are set up fine. And I'm going to just go ahead and clear all unless we run this. And just like that, we're able to get the second item in the first item from our from our database here. Very good. So if you wanted, of course, to get a description, of course, we can say your description, save in the run again and you can see all the sides. This is my second item. This is my first item, which is which is the description for each one of them. Very good. He went ahead and did that real quick. And this point here that he stop everything because I'm also running on iOS. So let's so we run this on ice real quick, we're going to be able to see that also runs on ice without any issues. All right, now it's all run. And you can see there is this is my second item and it's showing their perfectly.