🎙️ Modern Voice Chat Application

A modern, secure, real-time voice and text chat application built with Socket.IO, Express, and WebRTC.

✨ Features

🔐 Security & Authentication

• Token-based authentication with JWT
• Message encryption using AES-256-CBC
• Rate limiting to prevent abuse
• Secure headers with Helmet.js
• Username uniqueness enforcement

🎵 Voice Chat

• Real-time voice communication using WebRTC
• Echo cancellation and noise suppression
• Microphone toggle (mute/unmute)
• Speaker controls (mute/unmute speakers)
• Visual indicators for users in voice chat
• Automatic cleanup of voice connections

💬 Text Chat

• Real-time messaging with Socket.IO
• Message encryption before storage
• Message history persistence in MongoDB
• System notifications for user events
• Responsive message UI with timestamps

👥 User Management

• Live user list showing online users
• User presence tracking
• Room-based communication
• MongoDB storage for user data
• Automatic cleanup on disconnect

🎨 Modern UI/UX

• Dark theme with beautiful gradients
• Responsive design for all devices
• Real-time animations and transitions
• Connection status indicators
• Toast notifications for user feedback
• Modern typography with Inter font

🚀 Quick Start

Prerequisites

• Node.js (v16 or higher)
• MongoDB (local or cloud instance)
• Modern web browser with WebRTC support

Installation

1. Clone or download the repository

2. Install dependencies:

   npm install

3. Start MongoDB (if using local instance):

   mongod

4. Set environment variables (optional):

   # Create .env file
   MONGODB_URI=mongodb://localhost:27017/voicechat
   JWT_SECRET=your-secret-key
   PORT=3000

5. Start the application:

   npm start
   # or for development
   npm run dev

6. Open your browser and navigate to:

   http://localhost:3000
   

🎯 Usage

Getting Started

1. Enter a username (3-20 characters, letters, numbers, underscores only)
2. Enter a room name (3-30 characters, letters, numbers, hyphens, underscores)
3. Click "Join Voice Chat" to enter the room

Text Chat

• Type messages in the input field at the bottom
• Press Enter to send messages
• Messages are encrypted before storage
• View message history and timestamps

Voice Chat

1. Enable microphone by clicking the "Enable Mic" button
2. Grant microphone permission when prompted by browser
3. Start talking - other users will hear you automatically
4. Toggle microphone on/off as needed
5. Control speakers (mute/unmute incoming audio)

Room Features

• See all online users in the sidebar
• View users in voice chat with special indicators
• Real-time notifications for user events
• Connection status displayed in top-right corner

🏗️ Technical Architecture

Backend

• Express.js - Web framework
• Socket.IO - Real-time communication
• MongoDB + Mongoose - Database and ODM
• JWT - Authentication tokens
• Crypto - Message encryption
• Helmet - Security headers
• CORS - Cross-origin resource sharing

Frontend

• Vanilla JavaScript - No frameworks for simplicity
• WebRTC - Peer-to-peer voice communication
• Socket.IO Client - Real-time events
• CSS Grid & Flexbox - Responsive layouts
• Web Audio API - Audio processing

Security Features

• Input validation and sanitization
• Rate limiting (100 requests per 15 minutes per IP)
• Message encryption with AES-256-CBC
• JWT token authentication
• XSS protection through HTML escaping
• CSRF protection with secure headers

🔧 Configuration

Environment Variables

# Database
MONGODB_URI=mongodb://localhost:27017/voicechat

# Security
JWT_SECRET=your-super-secret-jwt-key-here

# Server
PORT=3000
NODE_ENV=production

WebRTC STUN Servers

The application uses Google's public STUN servers by default:

• stun:stun.l.google.com:19302
• stun:stun1.l.google.com:19302

For production, consider using your own TURN servers for better connectivity.

📱 Browser Compatibility

Fully Supported

• Chrome 80+
• Firefox 75+
• Safari 13+
• Edge 80+

Required Features

• WebRTC support
• getUserMedia API
• Web Audio API
• WebSocket support
• localStorage support

🛠️ Development

Scripts

# Start production server
npm start

# Start development server (with nodemon)
npm run dev

# Run tests
npm test

Project Structure

├── app.js              # Main server file
├── package.json        # Dependencies and scripts
├── views/              # EJS templates
│   ├── index.ejs       # Landing page
│   └── chat.ejs        # Chat room
├── public/             # Static assets
│   ├── css/
│   │   └── style.css   # Modern CSS styling
│   └── js/
│       ├── landing.js  # Landing page logic
│       └── chat.js     # Chat functionality
└── README.md           # This file

🚨 Security Considerations

Production Deployment

1. Set strong JWT_SECRET environment variable
2. Use HTTPS for secure communication
3. Configure proper CORS settings
4. Set up rate limiting (already implemented)
5. Use environment variables for sensitive data
6. Regular security updates for dependencies

Privacy Features

• Messages encrypted before database storage
• No message logging to console in production
• Automatic token expiration (24 hours)
• Secure session management

🎨 Customization

Theming

Edit public/css/style.css to customize:

• Color scheme (CSS variables in :root)
• Typography (font families and sizes)
• Layout (grid and flexbox properties)
• Animations (keyframes and transitions)

Features

The modular architecture allows easy addition of:

• File sharing
• Video chat
• Screen sharing
• Chat commands
• User roles and permissions

🐛 Troubleshooting

Common Issues

"Microphone permission denied"

• Check browser microphone permissions
• Ensure HTTPS in production
• Try refreshing the page

"Connection failed"

• Check MongoDB is running
• Verify network connectivity
• Check firewall settings

"Username already exists"

• Choose a different username
• Wait a few minutes and try again
• Clear browser localStorage

"Voice chat not working"

• Check microphone permissions
• Ensure WebRTC support in browser
• Test with different browsers

Debug Mode

Enable verbose logging by adding to browser console:

localStorage.setItem('debug', 'socket.io-client:*');

📄 License

MIT License - feel free to use this project for personal or commercial purposes.

🤝 Contributing

1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Test thoroughly
5. Submit a pull request

📞 Support

For issues or questions:

1. Check the troubleshooting section
2. Review browser console for errors
3. Verify all dependencies are installed
4. Test with different browsers/devices

---

Enjoy your modern voice chat experience! 🎉