Firebase

Use Firebase authentication, upload, storage, CRUD functionalities

Authentication Using Firebase

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.‌

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.‌

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

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

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

Enable the intended Login methods

Firebase has several Login methods in the console. For this platform to work, you need to enable Email/password method in Firebase Console as shown below

Building a CRUD With Firebase & AngularFire

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 AngularFireDatabaseModule 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()

Firebase Database Structure