Firebase Slack

A Firebase project A Github Repository with Github Actions enabled Create a Slack app First, let's create a Slack application. A slack clone using React and Firebase. Contribute to aakash-cr7/react-slack-clone development by creating an account on GitHub. React Firebase Slack Clone. This is a Slack clone application using React and Firebase. Creating a complete Slack chat application with React, Redux, and Firebase 5 from scratch Sending and receiving messages instantly with the real-time Firebase Database Uploading and displaying image messages using Firebase Storage Notifications to display new messages in other channels.

The goal of this tutorial is to guide you through the creation of aSlack clone called fireSlack. Upon completion, you willlearn how to build a real time collaborative chat application using angularFireto integrate Firebase with AngularJS.Your application will be able to provide the following features:

  • Sign up for an account
  • Join/create channels to chat in
  • Have a user profile
  • Direct message other users
  • See who's online

We'll be using Firebase 3 and AngularFire 2 for this tutorial which are both the latest versions for each library.


This course assumes knowledge of programming and at least basic knowledge ofJavaScript and AngularJS. We recommend going through A Better Way to Learn AngularJSif you're not familiar with AngularJS. We've created a seed repobased off of the Yeoman AngularJS Generatorto help you get started faster. Before you begin, you will need to have Node.js,npm, and Git installed. We'llneed Node.js and npm in order to install Grunt and Bowerfor managing dependencies. Follow these instructionsfor installing Node.js and npm, and these instructionsfor installing Git. Additionally, you'll need to have a free Firebase accountand create a Firebase for this tutorial.

Install Node.js
Install Git
Clone or fork the seed repo

Clone using ssh:

git clone [email protected]:gothinkster/angularfire-slack.git

Clone using HTTPS:

git clone

Create a new Firebase from the Firebase Dashboard

Final Notes About the Tutorial

You should never copy and paste code from this text unless we tell you to, aswe've found that the skills being taught will stick better if you write out allof the code yourself. If you need more clarification on a certain part of thetutorial, we recommend that viewing the supplementary screencast series as we gointo far more detail in each of the videos. It's also significantly easier tolearn from the screencast series than the text, as you can actually see how askilled developer manipulates the concepts in AngularJS to build a workingapplication.

Once the initial codebase is cloned locally, we'll need to run a few commandsto install dependencies and get our application up and running. Within ourcodebase, run the following commands:

Run npm install to install our node dependencies

Firebase Slack Free

Run npm install -g bower grunt-cli to install Bower and Grunt.

Firebase Stackoverflow

Run bower install to install our bower dependencies

Firebase Slack Login

Run grunt serve to start our application.

Firebase Slack Client

After running grunt serve, open up http://localhost:4000 and you should seea splash page for our application, with a non-functional login and registerpage ready for us to build off of. In this tutorial, our directory structurewill be grouped by feature (see #1 in this list)and we will be using ui-router asour router. We'll also be using the 'controller as' syntax for referencing ourcontrollers.