This tutorial will walk you through how to use AngularJS to build a simple chat app hosted on Firebase. The app will be scaffolded by Yeoman's gulp-angular generator.
The tutorial is split into five steps. After finishing all these steps, your client should be able to end up with a live chat app!
Each finished step is tagged in the repo as you can see by using the command $ git tag.
This is the starting point of this tutorial, which is simply the scaffolding result of yeoman.
In this step, you will build the basic UI elements of this chat app using static data.
A sample of the finished version of this step can be found here
In this step, we will add basic control flows using our local data.
A sample of the result of this step can be found here
In this step, we will add register/login funcationality to the app using the firebase SDK.
An example of the result of this step can be found here
In this step, we will replace our in-memory mock data with the real one on firebase.
An example of the result of this step can be found here
In this step, we will assign a dedicated URL for each chat using ui-router. This way, we can stay at the same chat even after we refresh our browser. An example of the result of this step can be found here
- Install dependencies by
$ npm install; bower install - Kick off by
$ gulp serve