Coder Social home page Coder Social logo

chat-app's Introduction

Chat app

Overview

Real-time chat with rooms, message likes, social media auth, role-based permissions, file upload, audio messages and real-time notifications.

Stack:

  • React
  • Firebase (realtime database, FCM, cloud functions)
  • Styles with Sass and Rsuite

Develop and run locally

Pull and install

  1. Clone this repo by running git clone https://github.com/shelooks16/chat-app.git
  2. Install dependencies for both cloud functions and React frontend by running npm install && cd functions && npm install

Important

Developed using Node v10. However, if you have one of the latest Node versions, you can easily have dependecy-related errors (when running npm run start), for example with node-sass. Feel free to update conflict packages to versions with no conflicts.

The reason for developing with Node v10 is to deploy cloud functions without any error. Engine.node is set to 10 inside functions/package.json. When deploying functions with different version other than 10, version conflict will pop-up.

Ideally, you should have Node Version Manager installed to easily switch between different NodeJS versions.

Run frontend locally

  1. Inside src/misc/firebase.js replace config with your firebase project config.
  2. Get FCM vapid key for real-time notificaitons from Firebase dashboard > Cog icon > Project Settings > Cloud Messaging > Web push certificates > Key pair and put it as fcmVapidKey inside src/misc/firebase.js.
  3. Run npm run start and develop :)

If you have problems with node-sass, just update the package to other version.

Run functions locally

  1. Download a service account from Firebase dashboard > Cog icon > Project Settings > Service accounts > Generate new private key.
  2. Put the file as functions/service-account.json
  3. Run npm run start from functions

Deployment

  1. Install firebase-cli by running npm install -g firebase-tools
  2. Run firebase deploy

chat-app's People

Contributors

shelooks16 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.