# Firebase Setup (Ionic 4 Version)

{% hint style="warning" %}
This section is for the Ionic 4 version of this platform, where Firebase Functions were used to make the apps talk to each other. Ionic 5 version does not use Firebase Functions.
{% endhint %}

## Authentication Using Firebase

{% hint style="info" %}
Learn more about Firebase Auth, Hosting and DB functionalities in our [detailed tutorial here](https://enappd.com/blog/firebase-with-ionic-4-hosting-auth-and-db-connection/58)
{% endhint %}

This starter provides you with Login, Signup and Reset Password functionality using Firebase Authentication. Along with this, there is a booking functionality connecting all 3 apps together, that is explained in other sections.‌

You can test the authentication in the already provided app code.‌

When you want to attach the authentication process to your own Firebase project, simply get the `config` parameters from Firebase console.‌

![](/files/-LqL0I17zeyaMB_aZ12P)

Once you have the `config` parameters, paste them in the `environment` files in the starter code. There are two environment files, one for `dev` and one for `prod` app.‌

![](/files/-LqL0LdZliCfEk2tWt0R)

This configuration can be imported in `app.module.ts` and `main.ts` by importing the `environment`

```
import { environment } from 'src/environments/environment';
```

![](https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-LdmV17nYtICLrl3bl_d%2F-LdmqJ1V22mWFflV3fyO%2F-LdmtzkeoufmTmXWcbZO%2FeditENVScreenshot.png?alt=media\&token=dee18daa-5f3f-4ede-82f0-0fd6933be7c7)

Make sure to have the `config` in the `environment.prod.ts` when you create a production build‌.

You can create several different types of Login with Firebase. Read more details about each of them in our tutorials

* [Facebook Login in Ionic 4](https://enappd.com/blog/facebook-login-in-ionic-4-apps-using-firebase/25)
* [Google Login in Ionic 4](https://enappd.com/blog/google-login-in-ionic-4-apps-using-firebase/39)
* [Twitter Login in Ionic 4](https://enappd.com/blog/twitter-login-in-ionic-4-apps-using-firebase/24)
* [Anonymous Login in Ionic 4](https://enappd.com/blog/firebase-anonymous-login-in-ionic-4/37)
* [Simple Email Login in Ionic 4](https://enappd.com/blog/email-authentication-with-firebase-in-ionic-4/38)

## Building a CRUD With Firebase & AngularFire <a href="#building-a-crud-with-firebase-and-angularfire" id="building-a-crud-with-firebase-and-angularfire"></a>

​You can open your `app.module.ts` and import everything we'll be using, this is the only time you'll see this file

```
import { AngularFireModule } from 'angularfire2';import { AngularFireDatabaseModule } from 'angularfire2/database';
imports: [    
    AngularFireModule.initializeApp(firebaseConfig),    
    AngularFireDatabaseModle  
],‌
```

`AngularFireModule` and `AngularFireDatabaseModle` are both responsible for crud operation in Firebase​

**Code sample for read data flow from Firebase**

```
this.afs.collection('completedRides').valueChanges().subscribe(res => {
        this.rides = res;
 });
```

**Code sample for Write data flow from Firebase**

```
this.db.collection('customers')
          .doc(uid)
          .set({
            name: `${user['first_name']} ${user['last_name']}`,
            email: user['email'],
            phone: `${user['area']}-${user['phone']}`
          });
```

**Code sample for Update data flow from Firebase**

```
this.db.collection('drivers').doc(uid).update({
        available: status
  });
```

**Code sample for Delete data flow from Firebase**

```
this.db.collection('drivers').doc(uid).delete()
```

![](https://blobscdn.gitbook.com/v0/b/gitbook-28427.appspot.com/o/assets%2F-LdmV17nYtICLrl3bl_d%2F-LdsrdG5mbRZjJCcVS6G%2F-LdstTwV8P4bF8Anms1E%2Fjorge-songs.png?alt=media\&token=dcebd4a6-8cb1-4d71-b987-e5b499a1d0b1)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://enappd.gitbook.io/ionic-taxi-booking-app-starter/extra/firebase-setup.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
