The purpose of this project is to provide a platform where two users can collectively collaborate on code in easily and be able to communicate through audio and video streams.

What it does

This component allows you to share your collaboration room with any other user and let them connect with you through video and audio. Through this you can communicate and work on code in real-time.

How we built it

We built two components for our project

  1. The video chat component For this component we used ReactJS for the frontend design. For the backend design we used ExpressJS and for the server and to create a channel for the audio and video between the two users.

  2. The CSS, HTML , JavaScript component. Inspired by Code pen we designed a simple easy to use code collaboration tool which will render code in real time and also allow real time collaboration using the pusher api.

Challenges we ran into

Integrating a WebRTC video chat with any framework other than react was proving difficult to manage due to dependencies and repository structure. Therefore in the end we had to come up with a pure ReactJS solution.

Accomplishments that we are proud of

  • Our deliverables were met. We successfully made a video chat component and were able to implement an easy to use code collaboration. Our sockets and pusher api implementation also worked.

What we learned

  • Code collaboration tools with extra add-ons such as video chats are not the most difficult to implement but require a lot of connections in order to function in real-time. Although these connections were successfully connected, they are suitable for scalable use.
Share this project: