Raid55 / simpleChat

A simple chat app made with React and Express

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Chat App

Requirements

  • MongoDB v3.6.5 or above
  • Node v9.9.0 or above && npm v5.6.0 or above
  • Google chrome v67 or above
  • Preferably a 15' inch computer screen or browser window, I don't know if the css will work beyond or bellow that

Building app and starting API

There are two different ways you can build the app, all in one or each part separately.

  • First, you have to install all the dependencies, go to the project root and type: npm i
  • Before we start anything make sure you have mongo running with through a daemon or through your own server. You can use mongod if you already installed mongo.
  • Now you can either set your own environment variables by adding them to your .bashrc or exporting them but since "dotEnv" is installed you can just create a .env file at the root of the project and format it like this:
KEY=Value
KEY=Value
...
Name Description Default
CHAT_MONGO_CONN mongo connection link "mongodb://localhost:27017/chat_app"
CHAT_PORT port the app will start on 3000
CHAT_TOKEN_SECRET the secret tokens will be signed with "keyboard_cat"
CHAT_TOKEN_ISS token issuer, who issues the token "chat_app"
CHAT_TOKEN_EXP token expiry, when user will be logged out and lost forever, at that point the user will have to make a new account "7d"

now its time to start up the app:

  • npm run dev:
    • running dev will essentially run webpack in watch mode and at the same time run the backend express API, if you are changing things often you might want to use that option.
  • npm run build and then npm run start:
    • this will build the react app and start the server separately, this is the best way if you want to just run the website and test it out.

Limitations

  • Not for Production
    • This app is not ready for production, there are a lot of things that aren't in place and it will become evident as you read through the limitations.
  • Made only for 1 CPU
    • You cannot cluster this app in its current state, socket IO won't work unless you provide some sort of proxy for it(redis). You would also have to use PM2 or rewrite some of the code to enable cluster mode.
  • No React tests (work in progress)
    • While I tried my best to write modular code and define every PropType, I am not very experienced writing front-end tests so I focused instead writing the app well and keeping it organized. (Update) I have read up on react testing and have set up and environment with all the required tools to get started, I am writing my first few component test and they should be pushed as soon as the tests are tested...
  • No logger
    • I started by console logging everything with text tags but I felt like that was sloppy, I did some research into implementing a good logger that would both work for the console but also log to a file, WinstonJS came up and I started looking into it. I already tried to configure it but I couldn't get it to work the way I wanted to so I have to rethink my approach.
  • No rate limiting
    • There is no rate limiting, meaning a user can create as many rooms as he wants and make as many requests to the server as he pleases. Not very good but this is not meant for prod.
  • Security
    • Since the app is password free the whole app is technically available to everyone, anyone can join your room if they have the 8 alphanumeric randomly generated id they can join the channel and see the whole message history.

Testing

To run the API tests type: npm run test

Bugs

  • CSS
    • I'm not that advanced when it comes to CSS so I kind of winged it, no responsivness and it is made to work on my 15'inch MacBook running google chrome.
  • The tests are restarting the server multiple times, they still work but it's annoying. I just put all the tests in one describe for now.
  • SocketIO
    • socket io, for some reason, keeps reconnecting after 3 - 8 minutes of idle time and from there it keeps doing it even if there is no page refresh, the reconnect also deletes all context between server and client.
  • EARINUSE:3000
    • I think this problem has to do with my computer but for some reason after killing the server something still stays active on port 3000, I added npm run pk to kill the process on port 3000, I had to handle SIGNINT because for some reason my computer left the server running if I just ctrl-c'd it.

đź’» by Raid55 (Nicholas Boutboul)

About

A simple chat app made with React and Express


Languages

Language:JavaScript 92.0%Language:CSS 6.7%Language:HTML 1.3%