Introduction to Firebase Real-time Database

Today we will learn about the most awesome service that firebase provides which is Firebase Realtime Database. It is a cloud-hosted database that supports 3 different platforms Android, iOS and Web. Firebase Realtime Database offers dynamic, extensible functions, and almost all Realtime data insertions, updates, and deletion. In this tutorial we will how we can store data on firebase realtime database and how we can fetch that data whenever needed.

What is Firebase Realtime Database?

Firebase Realtime Database used JSON format and when the data changes it automatically syncs and relects those changes immedialty on all platforms. Firebase Realtime Database also comes with offline support out of the box. This feature simply come into play when the app is in a not-so-reliable network state like frequent disconnection, etc.

Saving Data to Firebase Realtime Database

Now let’s discuss how we can save data to firebase realtime database before we actually access that. I assume that you’ve already created a firebase account and project. If not then go to firebase and create a firebase account for free.

After you have created the firebase account and firebase project, Go ahead to your Firebase project dashboard and select Dashboard from the side menu, and you will find something like this:

As you can see the firebase realtime database is using JSON format. Remember, in order to do anything with the Firebase client, you will need to have an instance to the functionality required so that we can do something like this.

let db = firebase.database();

In the above code, we have created a reference to the Firebase database. In order to save data in Firebase Realtime database, we have two methods provided by firebase API. we have the set() and push() methods. Let’s explore them:

  db.ref('codemeals/').set({
  name: "Learning Firebase",
  message: "Firebase Realtime DB is Awesome!"
  });

In the above code, we used the database reference that we created and simply navigated to the codemeals route to user codemeals, Now we should be able to see our data on the firebase real-time dashboard.

Recieving Data from Firebase Real-time Database

In order to fetch data from firebase database, like when we load our application, we typically want to grab all the data from firebase and bind it to your app UI like recent messages, notifications, etc. Let’s suppose we want to read the data once like , which means we don’t want it to be updated with each change to the database. The Firebase API has the once() method, which sounds exactly what it does when it comes to functionality. So let’s see how we can make that happen in our apps:

firebase.database().ref('/apps).once('value').then((snapshot)
          => {
    let apps = snapshot.val();
});

So let’s discuss the code above. We started by taking a reference to the apps section of our database then We used once() to grab the data that will be used just once, which means no further update of the apps section will raise an event, and finally we’re returning a snapshot of data. The snapshot will contain all the data that has returned from the firebase realtime database.

Now what about when there is a chance that the data will change over time and we want to continuously sync with the data and update the UI when data has changed, Such functionality is really easy to implement with Firebase, using nothing but the Firebase database API. So let’s see how we can make it happen:

   var firebaseTuts = firebase.database().ref('/firebase');
    adminRef.on('value',(snapshot) => {
    //implement your custom logic here.
    });

So in this tutorial we’ve learned how we can store our data on firebase realtime database and how we can get access to that data whenever we need with just few lines of code.

Best resources to learn firebase

Leave a Reply

Your email address will not be published. Required fields are marked *

Trending