Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/oscargonzalezdev/video-call-app

Video Call Application using WebRTC and Socket.io - Client side
https://github.com/oscargonzalezdev/video-call-app

socket-io videocall webrtc

Last synced: about 1 month ago
JSON representation

Video Call Application using WebRTC and Socket.io - Client side

Host: GitHub
URL: https://github.com/oscargonzalezdev/video-call-app
Owner: oscargonzalezdev
License: mit
Created: 2022-08-11T12:13:29.000Z (over 2 years ago)
Default Branch: main
Last Pushed: 2022-08-17T15:34:34.000Z (over 2 years ago)
Last Synced: 2024-12-15T19:05:51.820Z (about 1 month ago)
Topics: socket-io, videocall, webrtc
Language: JavaScript
Homepage: https://wetalk.oscargonzalez.dev
Size: 968 KB
Stars: 2
Watchers: 1
Forks: 1
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        

                



[![Contributors][contributors-shield]][contributors-url]

[![Forks][forks-shield]][forks-url]

[![Stargazers][stars-shield]][stars-url]

[![Issues][issues-shield]][issues-url]

[![MIT License][license-shield]][license-url]

[![LinkedIn][linkedin-shield]][linkedin-url]







  

    

  

  


    Video Call Web Application

    


    View Demo

    ·

    Report Bug

    ·

    Support

  






  Table of Contents

  


    

      About The Project

      

        Built With

      

    

    

      Getting Started

      

        Installation

      

    

    Usage

    Roadmap

    Contributing

    License

    Contact

    Links

  





## About The Project

[![Alt text](./public/wetalk-screenshot.png)](https://wetalk.oscargonzalez.dev)

WeTalk is a video call web application based on WebRTC, this technology allows peer-to-peer communications in real-time using web browsers.

### Built With

* React for the frontend.

* Express for the server side.

* Socket.io for handling signals between server and client.

* Chackra UI for UI styling.

* JavaScript, HTML, CSS as a general stack to build web applications.

## Getting Started

To get and run a local copy of this project follow the instructions below.

### Installation

1. Clone the repo

   ```sh

   git clone https://github.com/oscargonzalezdev/video-call-app.git

   ```

2. Install NPM packages

   ```sh

   npm i socket.io-client simple-peer react-icons  @chakra-ui/react react-copy-to-clipboard

   ```

3. Run the project locally

   ```sh

   npm start

   ```

## Usage

How can I make a Video Call?

That is very easy. First, you need the Call ID of your friend. Then paste it in the corresponding input and click the video call icon and Voila!

## Roadmap

- [X] Server-Side.

- [X] Client-Side.

- [X] Access component to get user name.

- [x] Options component handle Call IDs.

- [X] VideoPlayer component to render Video Stream.

- [X] Notifications component to notify incoming calls.

- [ ] CallOptions component to control the availability of video and audio.

- [ ] Chat component.

- [ ] ShareScrren component.

- [ ] Storage to allow user accounts.

See the [open issues](https://github.com/oscargonzalezdev/video-call-app/issues) for a full list of proposed features (and known issues).

## Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".

Don't forget to give the project a star! Thanks again!

1. Fork the Project

2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)

3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)

4. Push to the Branch (`git push origin feature/AmazingFeature`)

5. Open a Pull Request

## License

Distributed under the MIT License. See `LICENSE.txt` for more information.

## Contact Author

[www.oscargonzalez.dev](https://oscargonzalez.dev) |

[Twitter](https://twitter.com/oscardev_) |

[LinkedIn](https://linkedin.com/in/oscargonzalezdev)

## Links

- App Client-Side: [https://github.com/oscargonzalezdev/video-call-app](https://github.com/oscargonzalezdev/video-call-app)

- App Server-Side: [https://github.com/oscargonzalezdev/video-call-server](https://github.com/oscargonzalezdev/video-call-server)

- To learn more about WebRTC visit [www.webrtc.org](https://webrtc.org)

(back to top)


[contributors-shield]: https://img.shields.io/github/contributors/oscargonzalezdev/video-call-app.svg?style=for-the-badge

[contributors-url]: https://github.com/oscargonzalezdev/video-call-app/graphs/contributors

[forks-shield]: https://img.shields.io/github/forks/oscargonzalezdev/video-call-app.svg?style=for-the-badge

[forks-url]: https://github.com/oscargonzalezdev/video-call-app/network/members

[stars-shield]: https://img.shields.io/github/stars/oscargonzalezdev/video-call-app.svg?style=for-the-badge

[stars-url]: https://github.com/oscargonzalezdev/video-call-app/stargazers

[issues-shield]: https://img.shields.io/github/issues/oscargonzalezdev/video-call-app.svg?style=for-the-badge

[issues-url]: https://github.com/oscargonzalezdev/video-call-app/issues

[license-shield]: https://img.shields.io/github/license/oscargonzalezdev/video-call-app.svg?style=for-the-badge

[license-url]: https://github.com/oscargonzalezdev/video-call-app/blob/master/LICENSE.txt

[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=for-the-badge&logo=linkedin&colorB=555

[linkedin-url]: https://linkedin.com/in/oscargonzalezdev