Zoomify - Video Conferencing Application

A full-featured video conferencing application built with the MERN stack (MongoDB, Express.js, React.js, Node.js).

Features

• ✨ HD Video & Audio Communication
• 🖥️ Screen Sharing
• 💬 Real-time Chat
• 🎨 Virtual Backgrounds
• 📝 Interactive Whiteboard
• 🎥 Meeting Recording
• 🔒 Password Protection & Waiting Rooms
• 📱 Cross-Platform Support
• 🌐 WebRTC Peer-to-Peer

Tech Stack

Frontend: React 18, TypeScript, Tailwind CSS, Socket.io Client, WebRTC
Backend: Node.js, Express.js, MongoDB, Socket.io
Real-time: Socket.io for signaling and chat

Quick Start

Prerequisites

• Node.js (v16+)
• MongoDB (v5+)
• npm or yarn

Installation

1. Clone and Install

# Install backend dependencies
cd server
npm install

# Install frontend dependencies
cd ..
npm install

2. Configure Environment

Create server/.env:

PORT=5000
MONGODB_URI=mongodb://localhost:27017/zoomify
NODE_ENV=development
CORS_ORIGIN=http://localhost:5173

Create .env:

VITE_API_URL=http://localhost:5000/api

3. Start MongoDB

# Windows
net start MongoDB

# Mac
brew services start mongodb-community

# Linux
sudo systemctl start mongod

4. Run the Application

Terminal 1 - Backend:

cd server
npm run dev

Terminal 2 - Frontend:

npm run dev

5. Open http://localhost:5173

Project Structure

Zoomify/
├── server/              # Backend (Express + MongoDB)
│   ├── config/         # Database configuration
│   ├── models/         # Mongoose models
│   ├── routes/         # API routes
│   └── server.js       # Main server file
├── src/                # Frontend (React + TypeScript)
│   ├── components/     # React components
│   ├── lib/           # Utilities (API, Socket, WebRTC)
│   └── App.tsx
└── public/            # Static assets

API Endpoints

Meetings

• GET /api/meetings - Get all active meetings
• POST /api/meetings - Create meeting
• GET /api/meetings/code/:code - Get meeting by code
• PATCH /api/meetings/:id/end - End meeting

Participants

• GET /api/participants/meeting/:meetingId - Get participants
• POST /api/participants - Join meeting
• PATCH /api/participants/:id - Update status

Chat

• GET /api/chat/meeting/:meetingId - Get messages
• POST /api/chat - Send message

Meeting Limits

Anonymous Users (IP-based): 1 active meeting
Future - Authenticated Users:

• Free: 3 active meetings
• Pro: 10 active meetings
• Business: Unlimited

Usage

Create a Meeting

1. Enter your name and meeting title
2. (Optional) Set password and enable waiting room
3. Click "Create Meeting"
4. Share the meeting code

Join a Meeting

1. Enter your name
2. Enter the meeting code
3. Enter password if required
4. Click "Join Meeting"

Development

# Backend development
cd server
npm run dev

# Frontend development
npm run dev

# Production build
npm run build

Troubleshooting

MongoDB Connection Issues:

• Ensure MongoDB is running
• Check MONGODB_URI in .env

WebRTC Issues:

• Use HTTPS in production
• Check camera/microphone permissions
• Verify firewall settings

Socket.io Connection Issues:

• Check CORS settings
• Verify VITE_API_URL in .env

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT License

Support

For support, please open an issue in the repository.