Web Chat Application

Objective

• To create a web chat application based on Socket.io/WebSocket/WebRTC.
• The application should be built using either the MERN or MEAN stack.
• The web application should facilitate two-way real-time communication between two parties.

Deliverables

• Real-Time Communication: The app should enable real-time two-way communication without any delay, using socket connections instead of HTTP requests.
• Online Status: The app should show the online status of the recipient.
• Styling and Animations: You are free to style the app as you like. Better animations will be a plus point.
• Responsive Design: The web application should be responsive, considering mobile and tablet screen sizes.
• Load Previous Messages: The user should be able to load previous chat messages.

Bonus Points

• Search Contacts: I have also include search contacts in my chat app by filtering contacts username.
• Edit and Delete Messages: Implementing features to delete and edit messages will earn additional points.
• Efficiency: More points will be awarded if the code demonstrates better time-space complexity.
• Coding Standards: Plus points for following good naming conventions, abstraction, and SOLID principles.
• Message Delivery Status: Implementing a feature to indicate if the recipient has read the message will also earn extra points.

Technologies Used

• Backend: Node.js, Express, Socket.io, MongoDB
• Frontend: React (for MERN stack) or Angular (for MEAN stack)
• Real-Time Communication: Socket.io/WebSocket/WebRTC

Register Page

Login Page

Set Profile Avatar

Home Page Interface

Chat Interface

Online Status

Search Contacts

Mobile View

Installation

Frontend

1. Clone the repository:

   git clone https://github.com/yourusername/web-chat-app.git
   cd web-chat-app
   npm install
   npm start