https://github.com/mkptechnicals/videocon-3
A 3 - way video conference web page using html, css and PeerJS
https://github.com/mkptechnicals/videocon-3
css css3 html html-css-javascript html5 js peerjs peerjs-server peerjs-webrtc video-call video-calling-app
Last synced: 27 days ago
JSON representation
A 3 - way video conference web page using html, css and PeerJS
- Host: GitHub
- URL: https://github.com/mkptechnicals/videocon-3
- Owner: MKPTechnicals
- Created: 2024-03-14T14:53:27.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-03-17T13:09:26.000Z (about 2 years ago)
- Last Synced: 2025-04-04T01:28:39.830Z (about 1 year ago)
- Topics: css, css3, html, html-css-javascript, html5, js, peerjs, peerjs-server, peerjs-webrtc, video-call, video-calling-app
- Language: HTML
- Homepage:
- Size: 13.7 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Simple Web-Based Video Conferencing Application with PeerJS (Videocon-3)
This repository contains a simple web application for conducting a 3-way video conference using WebRTC (Web Real-Time Communication) technology. Users can connect with two remote peers and engage in video communication.
## Features
- **Video Conference**: Users can participate in a 3-way video conference.
- **Peer-to-Peer Communication**: The application establishes peer-to-peer connections between users for real-time video streaming.
- **Dynamic Video Display**: Video streams from the local user and remote peers are dynamically displayed on the web page.
- **Responsive Design**: The layout adjusts to different screen sizes for a seamless experience across devices.
- **User Interface Controls**: Users can input their Peer ID and the Peer IDs of remote participants to initiate connections. Buttons are provided to start and stop the conference.
## Usage
1. Clone this repository to your local machine.
2. Open the `index.html` file in a web browser that supports WebRTC (e.g., Google Chrome, Mozilla Firefox).
3. Input your Peer ID and the Peer IDs of the remote participants in the designated fields.
4. Click on the "Connect" buttons to establish connections with the remote peers.
5. Once all connections are established, click on the "Start" button to begin the video conference.
6. To stop the conference, click on the "Stop" button.
**Note**: Please edit the CSS styles in `styles.css` according to your usage and design preferences.
## Demo
Try out a demo of this application [videocon](https://healthgate.free.nf/frontend/video.html).
## Requirements
- Compatible web browser with WebRTC support (Google Chrome, Mozilla Firefox recommended).
- Webcam and microphone for video and audio input.
## Technologies Used
- HTML5
- CSS3 (with Flexbox layout)
- JavaScript
- PeerJS (for simplified WebRTC implementation)
## Acknowledgments
- This project utilizes the PeerJS library for simplifying WebRTC implementation. [PeerJS](https://peerjs.com/)
- The code structure and design are inspired by various WebRTC video conferencing tutorials and examples available online.
## Authors
- [@mkptechnicals](https://www.github.com/MKPTechnicals)
Feel free to contribute to this project by submitting bug reports, feature requests, or pull requests. Happy conferencing! 📹🎉