Firebase V9 Firestore Get Document Data With Real-Time Updates

Learn how to get document data with real-time updates using the onSnapshot() method from Cloud Firestore in Firebase version 9.

• Get Documents With Real-Time Updates Using onSnapshot() → you’re here
• Get Documents From A Collection Once using getDocs()
• Get Document By ID

The sample Firestore Database has a cities collection that has two documents in it, like in the screenshot below.

Nothing fancy.

Let’s get all the documents of the cities collection using the onSnapshot() method.

To do that we need three Firebase methods:

• getFirestore()
• collection()
• onSnapshot()

Import Firestore Database and de-structure the three methods.

import { getFirestore, collection, onSnapshot } from "https://www.gstatic.com/firebasejs/9.9.3/firebase-firestore.js";

Then create an instance of the Firestore Database by calling the getFirestore() method and assign it to a constant db.

const db = getFirestore();

After that, create a database and collection references by calling the collection() method passing two…