Fetching and retrieving data from the Firebase database

Rusty Zone
A free video tutorial from Rusty Zone
Experienced full stack web & mobile developer
4.2 instructor rating • 5 courses • 8,456 students

Learn more from the full course

Build the original Instagram with React Native & Firebase

React Native User Authorisation & Database with Firebase

06:33:27 of on-demand video • Updated December 2018

  • Make an app ready to be published onto app stores
  • Understand how you use Firebase with React Native
  • Upload photos in React Native to Firebase Storage
  • Build apps that require user authorisation
English [Auto] Before we start to look at the security rules we're going to first take a look at how to retrieve and fetch data from our database. Now there are a number of ways to do this. You can either section just a single value or affection time objects at a time which can take slightly longer and take up a bit more bandwidth. But this is only really an issue of scale. So if we have to look at some examples of this. So in this example here we are fetching data once. I'll explain more about this in a moment. So we are actually fetching first base reference here is the name. And then you can add in a child reference. So we're saying Jodra which if we check this in the database you can see we have a ref name then the child Rafter's to say this should fetch our database value. And then what we're basically doing is inside these objects this will take a moment to actually make an age GTP request and then send the return for this into this area just here. So first checking if any data actually exists when this response is made. And then wait. So here we check this data exists and then we're setting add data to the value of this snapshot which is the variable we're setting up here for this function. So in this example with the logging gets to the code so with the just a string here to say single party in a data so it has one way of affection data. Also if firebase you can actually have data update live. So down here in this example we're saying on Valley so this will mean if any new data is added or if data is changed it would actually run this function here for anything at this part. So this can be really useful to have apps that will live update life and show changes on the screen. So let's first just have a quick look at how these both of these commands will look in sight when run inside the app. I will look at the actual console log to see what this data is for turning my case over as we can see here. These are the two types of requests we've made so we have on value which is shown database and single value which is show in database. Now just to emphasize the difference between these between these two options. If we go to Chrome here and change this value right here is the side by side. So if we change this here you can say that this is updating straightaways about the app changing. So any changes made here will be reflected straightaway into this database. Whereas the single file one only runs once which is still useful if you want to maybe have a reload button on your app that can infect this data again. There are a number of other ways you can affect states her live as well. So as you can see in this example we were using to make updates live whenever the battery is changed. Don't hey we're looking look different ways you can check and make live updates as well. So in this example we actually have to make a slight change we can add an event here called on child added. Now what they will do is call this function whenever a new child is added to this reference. So if we remove this lbf name just here what this will do is fire an event just say if a new child is added to this reference thing let's have a look at how this will be reflected in the database. So if we say this and open up the database and just have a look. So here is I of reference just here and we have a number of child elements in here already. So if we run this in our simulator so if we add a new element just say we should see this log to the screen. So let's test this now so we're going to make a new reference and we'll have a special string into this valley so we can see what this is. And then if we add this now you can say this is a page just here now along with this. You can also make a list and for data being removed. So in this example it's exactly the same as we have PE. You can see we're checking this reference on child at it. And then this is why this is appearing here but down here this is saying children moved and it's going to say on the value you've removed. So if we say this like for the OP to pair in a simulator and we have the logging running again here. So if we now remove this reference here you can say this is look to the screen what you need to watch out for when you're using this in a live app is that these on child adult events are actually run with an app fast opens up as well. So you need to make sure that you're not making duplicate requests to the same place. They work really well when you want to add live data into your app.