S A N S K R ITI U N IV E R S IT Y
R a n do m V i de o C a l l i n g - A p p l i c a t i o n
S u b m i t te d i n p a r ti a l f u l f i l l m e n t f o r t h e a w a r d o f t h e
de g r e e o f
B a c h e l o r o f C o mp u te r A p p l i c a tio n s
S u b m it te d b y
Pu n i t S h a r ma ( 2 2 0 2 3 0 9 1 5 2 )
K a p i l K u m a r ( 2 2 0 2 3 0 9 0 82 )
A n i l Pa c h a u r i ( 2 2 0 2 3 0 9 0 2 1 )
Under the guidance of
mr Danish Mairaaj
Address: 28, K. M. Stone, Chennai - Delhi Hwy,
near Punjab National Bank, Mathura, Semri,
Uttar Pradesh 281401
[Link]
P r o je c t : R a n do m V i de o C a l l i n g A p p l i c a t i o n
In t r o d u c ti o n
This project is a Random Video Calling Application
built using modern web technologies like React,
[Link], [Link], [Link], and [Link]. The main
goal of this project is to enable users to connect
randomly with others for a seamless video calling
experience.
K e y Fe a t u r e s :
1. Random Connection:
Users are connected randomly with other online
users for video calling.
2. Real-Time Communication:
[Link] is used for managing real-time
communication and connections between users.
It handles events like user connection,
disconnection, and reconnection efficiently.
3. Peer-to-Peer Video Calling:
[Link] simplifies WebRTC integration, enabling
smooth video and audio communication between
users without the need for complex signaling
servers.
4. Frontend and Backend Integration:
React is used for building the user interface,
providing an interactive and responsive experience.
[Link] with [Link] powers the backend for
handling API requests, managing sockets, and
supporting [Link] signaling.
5. Scalable and Efficient Design:
The application is designed to handle multiple users
concurrently while maintaining low latency and high
-quality video calls.
Te c h n o l o g y S ta c k :
Frontend: [Link] (for UI)
Backend: [Link] and [Link]
Real-Time Communication: [Link]
WebRTC Library: [Link]
Styling: CSS and custom design components
A Random Video Calling Application involves
integrating multiple technologies like React, [Link],
[Link], and [Link] to create a seamless video
calling experience. Here’s an explanation of the
implementation process:
1. Backend Development
The backend handles real-time communication,
signaling, and user connection management.
Set up [Link] Server:
Use [Link] to create a [Link] server that serves
as the foundation for the application.
ntegrate [Link] for Real-Time Communication:
Use [Link] to manage user connections and
events.
When a user joins, they emit an event (like join-
room) with a unique room ID or session ID.
The server ensures users are matched randomly
and facilitates their connection.
Use [Link] for Signaling:
[Link] simplifies WebRTC signaling for setting up
peer-to-peer connections.
Integrate [Link] with the backend to allow users to
share their unique peer IDs for establishing direct
video/audio streams.
2. Frontend Development
The frontend manages the user interface and
establishes peer-to-peer video connections.
Build UI with React:
Create a simple UI with buttons for
starting/stopping the video, enabling/disabling the
microphone, and a "Call" button.
Add video elements (<video>) to display the local
and remote streams.
Connect to Backend Using [Link]:
Establish a connection with the server when the
user opens the application.
Send events to notify the server about the user's
activity (e.g., joining or disconnecting).
Initialize [Link] for Video Streaming:
Use [Link] to handle WebRTC connections for
video calls.
Once connected to another user, [Link] handles
sending and receiving the video/audio streams.
3. Random User Matching
Randomly connect users by implementing a room or
session system:
When a user opens the app, they are assigned a
random room or session ID.
The backend matches them with another user who
is waiting or assigns them a new session.
Once matched, the two users exchange their peer
IDs through the server.
4. Managing the "Call" Button
The "Call" button should remain disabled until two
users are successfully connected.
Use a state (like isConnected) to manage the
button's status.
Enable the button once the server notifies that
another user has joined the session.
How to Use the Application
1. Open the app in your browser.
2. Allow camera and microphone permissions.
3. Wait for a random user to connect (indicated by
an enabled "Call" button).
4. Click the "Call" button to start the video call.
Co ncl us io n:
This application showcases how to build a robust
real-time communication platform using state-of-
the-art web technologies. It is ideal for
understanding the practical implementation of
WebRTC, [Link], and [Link] in a full-stack
project.
This project is an excellent opportunity to explore
random video calling, peer-to-peer communication,
and scalable backend management.
