Example Chat App

May 02, 2021


The Example

Allows you to chat with people in real time with the help of websockets.


Tech Stack

  • Web App

    • React
    • Socket.io
    • Sass
    • Vite
  • Server

    • Express
    • Socket.io
    • Json web token (JWT)

Project Status

Project was created on May 16 2021 and finished on 19 May 2021.


Where can I find the source code?

This project was made 10 months ago and at that time I didn't know how to create a monorepo. So this project is split into two github repositories.

Web App

Server


How do we know that the user is authenticated?

When user connects to the websocket server it sends a JWT token generated by the HTTP api which you get by logging in with your credentials. When the server recieves the websocket request to authenticate the user, the server validates if the json web token (JWT) is correct and if it is correct it adds the user's connection to the list of authenticated users. And now when we need to send message to only authenticated users we send to every user in that list of connected users the message.

Where is it Deployed?

example-chat-app.netlify.app sign in into the testing account with username '123' and password '123'.

Home Page Login Page Messages Page