LAB 5 Ionic Firebase - sindhusha-t/ASE-Lab-Assignments GitHub Wiki
Ionic FireBase
Team 6-1
Introduction:
Creating Basic Login and Registration page using firebase Authentication and Database along with local notifications plugin.
Main Objective:
- Creating Login and Registration page using Firebase authentication.
- Providing Interface for user to add local notifications to the device using local notifications ionic plugin.
- Saving user specific notification details in firebase database and retrieving the details when user logs in again.
- Deploying the application to ionic/android/web
Design and Implementaion steps for above tasks:
Task-1: Creating Login and Registration page using Firebase authentication:
- Created account and authenticated into firebase website. ( https://console.firebase.google.com )
- Enabled email/password authentication mechanism for current project development.
- Installing Angular FireBase2 using command
npm install firebase angularfire2 --save
. - Adding the environment config values to connect with the firebase application.
- Importing required Angualar Firebase Modules for the project like Auth and Database/store
- Replaced local storage with Firebase Authentication method in AuthService file. Firebase authentication methods like createUserWithEmailAndPassword signInWithEmailAndPassword These methods do basic validations on the parameters/arguments/data ( whether email is valid or not , password exceeds 6 chars or not )
- Login and Register pages call the AuthService methods for creating and authenticating the users in real time using firebase.
Task-2: Providing Interface for user to add local notifications to the device using local notifications ionic plugin.
- Created basic html page to allow user to add local notifications.
- Installed Local notification ionic plugin using command
ionic cordovaplugin add cordova-plugin-local-notification
. - Imported Local notification plugin provider in app.module.ts
- on submitting the form, scheduling the notification using the methods provided by the plugin.
Task-3: Saving user specific notification details in firebase database and retrieving the details when user logs in again.
- Getting the authenticated user details from the Authservice provider.
- Creating the collection name with user email address and storing it in firebase real time database.
- Reading the items present in the user specific collection to retrieve previously stored local notification details.
Task-4: Deploying the application in android/ionic/web:
- Deployed the Ionic Application in Ionic Lab
Conclusion:
- We have learnt how to store user authentication details in firebase and how to use the tools and methods provided by firebase.
- We have learnt how to add notifications to the devices.
- We have also learnt how to store user specific details and retrieve them when needed using firebase real time database and storage.
Task Responsibilities:
- Sindhusha Tiyyagura: Basic Authentication using Firebase, Adding Local Notifications using ionic plugin.
- Pradeepika Kolluru: Storing user notification details to firebase database and showing user previously saved notifications when user logs into his account.