From no-sql database to Firestore & AngularFire
Tags: angularfire, firestore, javascript, nosql
Published: 2022-08-03 23:13:38

---
title: From no-sql database to Firestore &  AngularFire
published: true
date: 2018-07-13 13:20:04 UTC
tags: angularfire,firestore,javascript,nosql
canonical_url: 
---

### From no-sql database to Firestore & AngularFire

Have you ever thought that the unique querys format of firestore is unlike any other nosql …  
Firestore is this super powerful database created by the Firebase team in google, but what happens when we want to migrate what we had in another database and we find that we handle state data, and these are not handled equally in query’s from firestore…

![](https://cdn-images-1.medium.com/max/1024/1*ijwRLDPUlke-7twDinUvSg.jpeg)

Suppose we want to migrate from mongodb to firestore…

And suppose that what we are migrating is a chat … a chat normally has data like who sends it, who receives it, and above all it has an important data, the famous double blue check, or rather the follow-up of read.

Then we would have a structure similar to this one:

![](https://cdn-images-1.medium.com/max/1024/1*9im_IjBxBA9sI7lQQsuzfQ.png)

With this format, we would have no problem in making an easy query to identify if it is true or false, reading them, because there are simply two states, if we want to see “the readings” we go to the ones that are true and the opposite for the “unread”…

Let’s think about how to do the query:

![](https://cdn-images-1.medium.com/max/1024/1*krQaHIQwe-cEseVq4PAYLQ.png)

![](https://cdn-images-1.medium.com/max/368/1*P_j3Ducx8Aj4qE3cHo0p-w.jpeg)

But there are more “states” that actually read or not read … We have to identify “by sending”, “sent”, “received / not-read”, “received / read”

![](https://cdn-images-1.medium.com/max/299/1*DiX3IpEpnST9CiBZcYel3Q.jpeg)

![](https://cdn-images-1.medium.com/max/1024/1*sz2Sg58EJSpwLWh9udxqXQ.png)

But, what would be the problem? It’s easy, I can add more “where” and filter by 2 or 3 diferentes “allRead”, yes in MongoDB, but in firestore NO

![](https://cdn-images-1.medium.com/max/500/1*ChMf4j6WKQG0z7XTO4cnGw.gif)

In firestore we would have to generate a structure of this type:

![](https://cdn-images-1.medium.com/max/1024/1*7PfCBObtSCQ_kkZLsG04bQ.png)

So, are you telling me that I can not do the migration?

Well actually if we want to keep the format of the data we will have to make some changes in our code…

The first thing we could think about is to call the different functions and push in a general array:

![](https://cdn-images-1.medium.com/max/1024/1*sFrmOrF9csJPELJNsIn7Dw.png)

But, is this fine?  
Is it the best way to do it?  
does not exist something to not have to do so much code?  
I’m repeating a lot the same …

Thanks to RXJS and some small tricks, we will be able to improve our experience with AngularFire and Firestore

![](https://cdn-images-1.medium.com/max/1024/1*1f_qkwdoDwKIWzFRBLLaRw.gif)

![](https://cdn-images-1.medium.com/max/1024/1*h2cf3kr3O-EWBsBWobB9ww.png)

![](https://cdn-images-1.medium.com/max/500/1*T-657J1OUtxKqgJs9whm3w.gif)<figcaption>RxJS my precious</figcaption>

In this way, thanks to the data and data that comes from firestore, we will be able to make a fusion of data, and be able to show them completely, without thinking about how many things we have to do.

#### But how does it work?

What we do is iterate the arrays and thus be able to work with the different returns, but what firestore actually delivers is an “observable” by which we send the data we requested in the query.  
In this way with the switchMap we will be able to bring all the data of all the observables and in this way concatenate them.  
Once all the data have been established in the same array, we will make the map to obtain the data of the collection plus the unique ID of each one and thus deliver it in our list, in order to work with the data correctly.

Remember that the collection surely does not include all the real data that exists in a database of a real chat, but it is a way to explain how the differences in how we use a non-sql and Firestore.

The function can be in:

{% gist https://gist.github.com/jorgeucano/a816c238b76a1ab7d0a83f184ff9af55 %}

> Right now, you can migrate to firestore :) … enjoy it

After more than 9 years working in the tech industry, Jorge is a full stack developer with focus on JavaScript technologies. Today, Jorge is working at ByteDefault using Angular / RxJS / Firebase / Nativescript as well as other technologies. He delivered several courses and talks as well as write some tech articles on these subjects. Because of that, he was recognised as a Google Developer Expert in Angular & web technologies and Nativescript Developer Expert.

Before leaving, I leave all the places for which it is possible to see what I’m doing, or just to be greeted =).

- [Jorge Cano (@jorgeucano) | Twitter](https://twitter.com/jorgeucano)
- [Jorge Cano](https://youtube.com/channel/UCdp9sM22GW5uIOaU9eZ7n6w)

Thanks for read 👌

JC

* * *