Chat-App

Description

It is a real-time chat application built using Node.js, Express, Socket.io, RESTful Web Service. Some the features of this application are

• Uses Express as the application Framework.
• Real-time communication between a client and a server using Socket.io.
• Uses RESTful Web Service for serve different platforms.
• I am currently working on integrating mongoDB, mongoose to store the messages.

Working Procedure:

A connection is opened between the client and the server so that the client can send and receive data. This allows real-time communication using TCP sockets. This is made possible by Socket.io. The client connects to the server through a socket. Once connections is successful, client and server can emit and listen to events. Currently, I am using an array called ‘users’ to store the information of all the new users.As soon as a new user enters a chat room an object is created that contains all the information such as username, id and room. This object is pushed into the ‘users’ array. The repository contains details information about the code.

Features to add:

• Authentication using jwt.
• Database to store the messages.

Usage

 
  cd Chat App
  npm install
  npm start
  Go to http://localhost:3000/
  

Feel free to play with it.

Screenshots

How to understand the code?

Please take a look here

Code

Server.js:

I started with setting up the server for the application and installed all the npm packages such as express, socket.io etc. Socket.io is a library that enables real-time, bidirectional and event based connection between the browser and server.

As soon as the client connects to the server, two messages are broadcasted to the chat room.

• “Welcome to ChatCord”.
• “Alex has joined the chat”.

When a client leaves the chat, a message is broadcasted that a user has left the chat.

User.js:

I created a separate file for users which handles all the functionalities of a user such as joining the server, leaving the server, getting the current user etc.

For the challenge, instead of using databases, I stored the user information in an array called users. Every time a new user enters a chatroom, an object is created which contains the information : username, id, room. This object is then pushed to the users array.

Main.js:

It is the client side javascript file which acts as an interface between the server and the user.

• Outputs the message to the DOM.

  

• Add room names and usernames to the DOM.

  

#Updates: I am working on integrating a database that will store the chat messages and the users information. I am working on a new branch. Please visit this link.