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.
Clone using ssh:
git clone [email protected]:gothinkster/angularfire-slack.git
Clone using HTTPS:
git clone https://github.com/gothinkster/angularfire-slack.git
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:
npm installto install our node dependencies
Firebase Slack Free
npm install -g bower grunt-clito install Bower and Grunt.
bower installto install our bower dependencies
Firebase Slack Login
grunt serveto start our application.
Firebase Slack Client
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.