Squads

Live (squads-app.herokuapp.com)

Squads is a video conferencing web app, where users can create rooms, invite other users via link, join rooms, group video-audio call with other participants of the same room, and also exchange text messages. This project is a part of Teams Clone- Microsoft Engage'21.

What it can do?

It lets you have video conference with your friends.

How it works?

It uses P2P connection to connect call. Websockets used for signalling.

Getting Started

Steps to get it working on you local machine.

git clone https://github.com/Anubhvv/Squads.git

install nodejs

npm install socket.io express uuid 

npm start

visit localhost:3232 in a browser (preferably chrome/ edge)

Prerequisites: (Open source libraries JavaScript) nodejs

express

socket.io

uuid

Document

Check document

Demo

For the demo, https://www.youtube.com/watch?v=DudWT4HmgqY

step 1 HomePage

step 2 click on Create Room and enter your Name, click on Next button.

step 3 This is your waiting room. CLick on camera/ mic button and allow access. Adjust and make yourself comfortable before joining the room. No one can see you at this moment. you can also copy the invite link by a simple click on 'invite Link' button just above your video.

step 4 Share this invite link to your friends via any messaging app or e-mail. And wait for others to join.

step 5 Talk, discuss strategies, send texts to your friends.

Features

Ability to create a room for conferences.

Ability to share the link to a conference room with users.

Allows people with a room link to join the conference call.

Allows multiple users to join a single room.

Ability to create multiple rooms without interference and conflicts.

Allows the same user to connect to different rooms at a time.

Capability of chatting over text with the people of the conference call.

Ability to switch Camera and Mic On/Off.

Waiting room before joining the call.

Ability to locate the sender of the message in the chat box.

If a user joins a room but is unable to connect to the call, the user can access the chat box and communicate over text.

Learnings

Complete development for a WebApp following Agile Software Development methodology.

Understood End to End flow of a WebApp including FrontEnd & BackEnd.

WebRTC Technology, WebSockets, Servers.

FrontEnd Technologies like Tailwind UI, jQuery, javaScript, responsive UIs.

BackEnd Technologies like NodeJs, Express, APIs.

Utilization of Libraries/Modules for rapid development.

Contributor

• Anubhav Agrawal

References

https://peerjs.com/docs.html#api

https://socket.io/docs/v4

https://www.youtube.com/watch?v=PTz2To7zUVM

https://www.youtube.com/watch?v=FExZvpVvYxA&t=3526s