🚀 MEGACHAT — Realtime Friends Messaging Web App

MEGACHAT is a feature-rich, high-performance, real-time messaging application designed for friends, built with Node.js, Express, and Socket.IO on the backend, and a glassmorphic HTML5/CSS3/JavaScript frontend.

---

✨ Features

• ⚡ Realtime Messaging: Instant text delivery powered by Socket.IO with typing indicators and online user tracking.
• 🎙️ Voice Notes: Record audio voice messages directly in the browser with live duration timers and waveform playback bubbles.
• 📷 Media & File Attachments: Share images and documents with instant file upload preview.
• 🔥 Emoji Reactions: React to any message with real-time emoji reaction badges and live counters.
• 🔒 Public & Private Channels: Join public lounges (# General Lounge, # Gaming Zone, # Chill & Vibe, # Dev Corner) or create secret passcode-protected friend channels.
• 🎨 Cyber-Dark Glassmorphic UI: HSL color system, animated glowing orbs, frosted glass backdrop blurs, Google Fonts (Outfit & Inter), custom scrollbars, and mobile-responsive navigation.
• 🔔 Synthesized Audio Cues: Zero-dependency Web Audio API sound cues for message send and receive events.

---

📁 Directory Structure

MEGACHAT/
├── package.json              # Root launcher script
├── .gitignore                # Git exclusions
├── README.md                 # Project documentation
├── backend/                  # Node.js + Express + Socket.IO Server
│   ├── package.json          # Backend dependencies
│   ├── server.js             # HTTP & WebSockets Server
│   ├── lib/
│   │   ├── socketHandler.js  # Realtime Socket.IO event handler
│   │   └── storage.js        # Local JSON message storage engine
│   ├── data/                 # Chat history persistence
│   └── uploads/              # Media & audio recordings storage
└── frontend/                 # Client Web Application
    ├── index.html            # SPA HTML Structure
    ├── css/
    │   └── styles.css        # Glassmorphic CSS design system
    └── js/
        ├── audioService.js   # Web Audio synthesizer & MediaRecorder
        └── app.js            # Socket.IO client logic

---

🚀 Quick Start Guide

Prerequisites

• Node.js (v16 or higher)
• npm (v8 or higher)

Installation & Execution

1. Clone the repository:

   git clone https://github.com/mahe15/Realtime-message.git
   cd Realtime-message

2. Install backend dependencies:

   cd backend
   npm install

3. Run the Application:

   # From the backend directory:
   npm start
   
   # Or from the root directory:
   npm start

4. Open in Browser: Navigate to http://localhost:3000

---

🛠️ Tech Stack

• Frontend: HTML5, Vanilla CSS3 (Custom Tokens & Glassmorphism), JavaScript (ES6+), Socket.IO Client
• Backend: Node.js, Express.js, Socket.IO, Multer
• Storage: Local JSON database engine with persistent room history

---

📄 License

This project is open source and available under the ISC License.