Combine Queries in Firebase Cloud Firestore for JavaScript with RxFire

Combine Queries in Firebase Cloud Firestore for JavaScript with RxFire

This is a much easier way to write combination queries for Cloud Firestore. If you prefer to just use RxJS, then check out Performing OR Queries with Firebase Cloud Firestore for JavaScript with RxJS.

What is RxFire?

RxFire is a framework independent library that help create RxJS Observables from various Firebase operations that your Firebase project would typically include, such as Authentication, Realtime Database, Firestore, Storage, etc. In this article, we will go through how to combine multiple Firestore queries together using RxFire as a single Observable stream. I will be using the same examples mentioned in my previous article Performing OR Queries with Firebase Cloud Firestore for JavaScript with RxJS, so that you will be able to see how much simpler RxFire is.

Creating Firestore Observables with RxFire

Lets take a look at how it is done without the help of RxFire, so we can do a comparison

Now with RxFire, we can simplify this as we don’t need to manually create a Subject and update the observable manually when a new value is received:

RxFire includes observable generation functions such as collection that can be used to create an observable directly from a Firestore Query . This looks much simpler and cleaner right?

Combining observables into a single stream

Since we created the observables easily with the help of collection provided by RxFire/firestore, we can easily combine the observables together:

Summary

If you see yourself combining queries all the time, I would recommend this extra dependency to help make you and your code live happier! If you are concerned about the additional bundle size, RxFire is tree shake-able!

RxFire has other observable creation methods for other commonly used parts of the Firebase SDK, especially in Authentication, Storage and Realtime Database. Check out the RxFire GitHub.