CodinGurukul
Published in

CodinGurukul

Firebase For Web: Firebase Realtime Database

In this article, I’m going to show you how to use Firebase Real-time Database.

Firebase Real-time Database is a cloud-hosted NoSQL database that lets you store and sync between your users in real-time.

The Realtime Database is really just one big JSON object that the developers can manage in realtime.

Realtime Database => A Tree of Values

With API, Firebase database provides your app with both the current value of the data and any updates to that data.

Realtime syncing makes it easy for your users to access their data from any device, be it web or mobile. Realtime Database also helps your users collaborate with one another.

Another amazing benefit of Realtime Database is that it ships with mobile and web SDKs, allowing you to build your apps without the need for servers.

When your users go offline, the Realtime Database SDKs use local cache on the device to serve and store changes. When the device comes online, the local data is automatically synchronized.

The Realtime Database can also integrate with Firebase Authentication to provide a simple and intuitive authentication process.

CHECK OUT THE VIDEO HERE

How to implement?

All Firebase Realtime Database data is stored as JSON objects.

First, you need to add Firebase to your project.

Write Operation

For storing a data in Firebase Realtime database, you can use set() method to save the data. set() overwrites data at the specified location, including any child nodes.

<script>
var name="Name";

firebase.database().ref('data').set({name:name});

</script>

Read Operation

For reading a data from the Firebase Realtime database, Firebase has two methods on() and once().

  1. on() method to retrieve data. This method is taking the event type as “value” and then retrieves the snapshot of the data. When we add val() method to the snapshot, we will get the JavaScript representation of the data. It triggers continuously.
  2. once() method to simplify this scenario: it triggers once and then does not trigger again.
<script>  // on() method
firebase.database().ref('data').on('value',(snap)=>{
console.log(snap.val());
});
// once() method
firebase.database().ref('data').on('value',(snap)=>{
console.log(snap.val());
});
</script>

Read List of Data

This logic can be useful when you want to fetch all children of a list in a single operation, rather than listening for additional child added events.

<script>

firebase.database().ref('ReferernceName').once('value', function(snapshot) {
snapshot.forEach(function(childSnapshot) {
var childKey = childSnapshot.key;
var childData = childSnapshot.val();
// ...
});
});

</script>

Count the Number of Nodes

This logic will help you to count to the number of nodes inside data node.

<script>  firebase.database().ref('data').on('value',(snap)=>{
var totalRecord = snap.numChildren();
console.log("Total Record : "+totalRecord);
});
</script>

Delete Operation

The simplest way to delete data is to call remove() on a reference to the location of that data.

You can also delete by specifying null as the value for another write operation such as set() or update(). You can use this technique with update() to delete multiple children in a single API call.

<script>   // Update Operation
firebase.database().ref('data/'+id).update({name:"new_name"});
</script>

CHECK OUT THE VIDEO HEyRE FOR MORE INSIGHTS ABOUR REALTIME DATABASE

Thanks for reading this article, in future we’ll cover each service with demos. and click the 💚 below. Keep watching this page and follow me.

Thanks

Happy Coding!

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store