Awesome Open Source
Awesome Open Source


IonicFirebaseChat is a sample chat widget powered by Firebase. We created a simple authentication system with email and Facebook support in Ionic.


alt text login with facebook chat add room


1.Setting up a Firebase Account

In order to user Firebase, you need to have an account with them. Url:

2.Setting up a facebook App for Login

Login the firebase dashboard, and select the login&&Auth tab, select the facebook tab, fill the Facebook APP Id and Facebook App Secret.

3.Install the lib by bower
bower install firebase --save
bower install angularfire --save
bower install angular-md5 --save  // md5 for Angular.js and Gravatar filter
4.Replace the firebase url with your's in www/js/configs.js

Data Structure

  • users/

    • user-id
      • username - The display name of the user.
      • email - The user email.
      • connected - The user online or offline.
  • rooms/

    • room-id
      • name -The room name.
      • type - The room type(private and public).
      • createdAt- The time at which the room was created.
      • ownerId - The room's owner id .
  • room-messages/

    • room-id
      • message-id
        • sender_username
        • sender_email - For getting the gravatar.
        • content - The message content.
        • createdAt - The time at which the message was created.

Get help

Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (67,992
firebase (467
facebook (258
ionic (164
realtime-messaging (25

Find Open Source By Browsing 7,000 Topics Across 59 Categories