Read Data From Firebase Firestore (V9)

For reading data from firestore database we will need some starter files so clone this repo https://github.com/abhisheks-12/Blog-dev-to

1) Go to https://firebase.google.com/ then click on Go to console.

2) Now create project with name parking system and after that turn off google analytics.

3) After that click on </> icon which represents web app.

4) Register app with any name , then copy firebase configuration and if you don't have firebase install firebase first.

5) After that go to your editor open src/Firebase/config.js
and paste configuration here

6) Again go to firebase click on firestore database.

7) Click on start collection and create your data base like this
picture

8) Now come back to your text editor open src/App.js.

9)Import following statements

10) Now we will fetch data from firestore so we will use async function so first see this code

11) Here we are using getData function to fetch data ,now we will save data in parkingData first console log parkingData after logging we will find doc value in this value there will be objects of our data.

12) In setCars we are setting data in array using map method . All properties will come in different objects so we are destructuring
this properties into one object with unique id .

15) Now we have data and now we are going to loop over that data
using map and access every property and set it in our html .

16) Here is final code https://github.com/abhisheks-12/Blog-dev-to/tree/final/src