Giter VIP home page Giter VIP logo

slack-clone's Introduction

** I'm not going to actively maintain this repo anymore (since Feb 2017), but feel free to fork the project or create PRs **

Possible future improvements:

  • Receive ACKs for outgoing socket.io events
  • Separate the repository to front & back repositories from the current monolithic approach
  • Add state container such as Redux
  • Refactor both server & client side code
  • Add front end specific tests with e.g. Jest, enzyme
  • Get rid of mutable stuff
  • Considering using CSS-in-JS, e.g. styled-components
  • Optimization
    • More advanced webpack config
    • Prerendering
    • Code splitting

Build Status codecov

Slack clone - A real time chat service

Demo: https://zh47.herokuapp.com

Stack:

  • React
  • Socket.io
  • Express
  • Node.js
  • MongoDB

I didn't use any state container (like Redux) yet, but it might be useful in the future to avoid passing data between components.

User stories

  • Users can choose a nickname
  • Users can join chatrooms of their own choosing
  • Users can send messages to other users

Features

  • Mobile-friendly UI (Material-UI)
  • Stores messages on the server (only messages from channels are saved at the moment, but it's quite easy to extend it to support private messages also)
  • Supports multiple logged clients at the same time from one user (e.g. desktop & mobile clients)
  • Authentication is made with Passport.js which makes other sign up methods easy to implement (e.g. Facebook OAuth)
  • Highlights unread conversations
  • Keeps list of online users in real time

Install & run

The server includes webpack-dev-middleware & webpack-hot-middleware to show code changes on browser without refreshing

yarn
yarn start

Testing (Mocha & Chai)

Most of the real time and routes api are covered in the tests.

yarn test

Coverage report (Istanbul)

Coverage report can be generated by running

yarn coverage

Linting (ESlint)

yarn lint

to fix most of the warnings automatically:

yarn lint:fix

slack-clone's People

Contributors

avrj avatar renovate-bot avatar nwwells avatar mishraak avatar renovate[bot] avatar

Watchers

James Cloos avatar  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.