Ionic 4 Chat App with Firebase

Disclaimer: This is a simple ionic 4 chat app with firebase for fun only.

Objective: This is ionic based chat app with firebase. There are two authorities one is admin and second is user. User can chat only with admin and admin can chat with all users of the app.

Clone from GitHub

git clone https://github.com/SATPAL-BHARDWAJ/ionic-messenger-firebase.git

Create account with firebase

1. Login with firebase console
2. Get the google-service.json file and upload it to the root directory of the project.
3. Go to the root directory of the project and run following command to install firebase package

npm install firebase

Configuration

Go to api.service.ts and add following configuration

const config = {
  apiKey: "your_api_key",
  authDomain: "project_id.firebaseapp.com",
  databaseURL: "https://project_id.firebaseio.com",
  projectId: "project_id",
  storageBucket: "project_id.appspot.com",
  messagingSenderId: "sender_id"
}; 

Build user and admin app

We are using this single code for both user and admin.

User

- Go to config.xml 
- change to app id to io.ionic.userMessenger
- go to api.service.ts
- set admin: boolean = false;

Then run build command

ionic cordova build android

Admin

- Go to config.xml
- app id will be io.ionic.adminMessenger
- go to api.service.ts 
- set admin: boolean = true;

Then run build command

ionic cordova build android

You can also check our other Ionic related updates here.

Output

• 

• 

• 

You can subscribe our blog to get the notification of the new version of this app.

If you have any question or suggestion, you can comment below. I really want to hear from you.