Firebase 9 Vs 8: Compare Firestore CRUD Queries
In this short Firebase tutorial, you’re going to see a side by side comparison of Firebase 8 Vs Firebase 9 on making CRUD queries to Cloud Firestore.
- Getting Started With Firebase
- Add Data Cloud Firestore
- Read Data Cloud Firestore
- Update Data Cloud Firestore
- Delete Data Cloud Firestore
Getting Started With Firebase – Version 9
1. Install Firebase
npm install firebase@9.6.11
2. Import Firebase to the project
import { initializeApp } from 'firebase/app';
3. Add Firebase configuration and initialization code
To get the code, you’ll need to create a new Firebase project from the Firebase Console.
const firebaseConfig = {
apiKey: "********",
authDomain: "********",
projectId: "********",
storageBucket: "********",
messagingSenderId: "********",
appId: "********",
measurementId: "********"
};
initializeApp(firebaseConfig);
Getting Started With Firebase Version 8
1. Install Firebase
npm install firebase@8.2.3
2. Import Firebase to the project
import firebase from 'firebase';
3. Add Firebase configuration and initialization code to your project
const firebaseConfig = {
apiKey: "********",
authDomain: "********",
projectId: "********",
storageBucket: "********",
messagingSenderId: "********",
appId: "********",
measurementId: "********"
};
firebase.initializeApp(firebaseConfig);
Add Data To Cloud Firestore – Version 9
1. Import a specific module you would like to use from the Cloud Firestore by destructing it wherever you would like to make a query.
In this case, getFirebase which is the database, collection and addDoc.
import { getFirestore, collection, addDoc } from "firebase/firestore";
Then, create a query to add data to the Cloud Firestore.
const db = getFirestore();
const userRef = collection(db, "users");
addDoc(userRef, {name: "Raja Tamil"});
Add Data To Cloud Firestore – Version 8
1. Import Firebase where you would like to make a query.
import firebase from "firebase";
2. Then, create a query to add data to the Cloud Firestore.
const db = firebase.firestore();
db.collection("users").doc().add({name: "Raja Tamil"});
Read Data From Cloud Firestore – Version 9
import { getFirestore, collection, getDocs } from "firebase/firestore";
const db = getFirestore();
const userRef = collection(db, "users");
getDocs(userRef).then((snap) => {
snap.forEach((doc) => {
console.log(doc.id);
console.log(doc.data());
});
});
Read Data From Cloud Firestore – Version 8
import firebase from "firebase";
const db = firebase.firestore();
db.collection("users")
.get()
.then(snap => {
snap.forEach((doc) => {
console.log(doc.id);
console.log(doc.data());
});
});
},
Update Data To Cloud Firestore – Version 9
import { getFirestore, collection, setDoc, doc } from "firebase/firestore";
const db = getFirestore();
const userRef = doc(db, "users", "ZOnRzcL9rFkX2yRWZYFZ");
setDoc(userRef, { name: "Pagalavan Tamil" }, { merge: true });
Update Data To Cloud Firestore – Version 8
import firebase from "firebase";
const db = firebase.firestore();
db.collection("users")
.doc(id)
.set({
name: "Pagalavan Tamil"
})
.then(() => {
console.log("deleted);
});
},
Delete Data From Cloud Firestore – Version 9
import { getFirestore, deleteDoc, doc } from "firebase/firestore";
const db = getFirestore();
deleteDoc(doc(db, "users", "ZOnRzcL9rFkX2yRWZYFZ")).then(() => {
console.log("deleted");
});
Delete Data From Cloud Firestore – Version 8
import firebase from "firebase";
const db = firebase.firestore();
db.collection("users")
.doc(userId)
.delete()
.then(() => {
console.log("deleted);
});
},
Let me know in the comment below if you would like to add any additional queries in this tutorial.
Happy Coding!