Real-Time Chat Application

A simple real-time chat application built with React, Node.js, Express.js, and Socket.io.

Features

• Send and receive messages in real time
• Messages appear instantly using Socket.io
• Chat history is loaded after refreshing
• Message timestamps
• Send messages using Enter or the Send button
• REST APIs for sending and fetching messages
• Works across multiple browser tabs
• Clean and responsive chat interface

Tech Stack

Frontend: React, JavaScript, HTML, CSS Backend: Node.js, Express.js, Socket.io, CORS Tools: Git, GitHub, Postman, VS Code

Project Structure

chat-app/
├── backend/
├── frontend/
├── .gitignore
└── README.md

Setup

Backend

cd backend
npm install
node server.js

Frontend

Open another terminal:

cd frontend
npm install
npm run dev

Then open the local URL shown in the terminal.

API Endpoints

• GET /api/messages — Fetch chat history
• POST /api/messages — Send a message

Environment Variables

No environment variables are required for the current local setup.

Design & Assumptions

Socket.io is used for instant communication, while REST APIs handle messages and chat history. Messages are stored in memory, so they are cleared when the backend server restarts.

Authentication and database storage were not included as they are optional features in the assignment.

Testing

The app can be tested by opening it in multiple browser tabs and sending messages between them. REST APIs can also be tested using Postman.