VideoPeers - Real Time P2P Video Chat Application
Description
This is a real time video chat application built using WebRTC, Socket.io, Node.js, Express.js, and Next.js. It allows users to create a room and share the room ID with other users to join the room for a peer-to-peer video call.
Key Features
- Create and join video chat rooms using room IDs
- Real-time peer-to-peer video calling using WebRTC
- Audio mute/unmute controls
- Video Hold/Play controls
- Call End option
- Responsive Design
- Built with Next.js, Node.js, Express, Socket.io
Technologies used / Prerequisites Of The Project
- Next.js - React framework
- WebRTC - Real-time communication
- Socket.io - Bidirectional communication
- Node.js - Backend runtime
- Express - Node.js framework
- Tailwind CSS - Styling
Installation
- Clone the repository
git clone https://github.com/hirentimbadiya/Video-Peers.git
- Install dependencies for Client Side
cd client #in Video-Peers/client
npm install
- Install dependencies for Server Side
cd server #in Video-Peers/server
npm install
- Run the application
- Run the client side
cd client #in Video-Peers/client npm run dev - Run the server side
cd server #in Video-Peers/server npm run dev
Working Demo
https://github.com/hirentimbadiya/Video-Peers/assets/86219935/7ce8caf9-0881-4abe-b633-79d3bb0a87ef
Future Scope
- Text chat support in rooms
- Screen Sharing Feature
- Multiple Participants in a room
- Video recording option
My Learnings
By Building this project I learned about the following concepts:
-
WebRTC (Web Real-Time Communication) is a technology that enables real-time peer-to-peer communication between browsers and mobile applications. It is an open-source and free project that used to provide web browsers and mobile applications with real-time communication (RTC) via simple application programming interfaces (APIs).
-
Socket.IO is a library that enables real-time, bidirectional and event-based communication between the browser and the server. It consists of: a Node.js server: Source | API. a Javascript client library for the browser (which can be also run from Node.js): Source | API.
-
Next.js is a React framework that enables several server-side rendering (SSR) features such as static site generation (SSG), automatic code splitting, server-side rendering, and client-side routing. It is a framework that is built on top of React.js and Node.js.