Giter VIP home page Giter VIP logo

zoom-clone's Introduction

zoom-clone

This Node.js project is bootstrapped with yarn2. This is a simple implementation of a Video Chat App built with Socker.io and Peerjs

Run the Demo

First Install peerjs globally :

npm i -g peer

then, run the express server :

npm run start:dev

# or

yarn start:dev

finally run the peerjs server :

peerjs --port 3004 # change the default port  as you want
  • Open http://localhost:3003.
  • Authorize your browser to access to your camera
  • Copy the url with the generated roomId and open it in a new tab (you should now see 2 users connected to the room with their video stream)

Try Multiple Users in Local

If you want to make a quick demo with different users on different networks (Other computer, smartphones etc.). You can try NgRok

First install it :

# Macos
brew install ngrok/ngrok/ngrok
# Windows
choco install ngrok
# Linux 
sudo tar xvzf ~/Downloads/ngrok-v3-stable-linux-amd64.tgz -C /usr/local/bin

Connect to the NgRok Dashboard and follow the installation process

Update your local ngRok config file (~/.ngrok2/ngrok.yml) like this :

authtoken: <YourAuthToken>
tunnels:
  peer: # give the name you want
    addr: 3004
    proto: http
  node: # give the name you want
    addr: 3003
    proto: http

Run ngrok tunnel :

ngrok start --all

Copy ngRok's generated urls (free plan) :

Example :

Forwarding    https://d18b-93-1-15-153.ngrok.io -> http://localhost:3004
Forwarding    https://faaf-93-1-15-153.ngrok.io -> http://localhost:3003

Go to public/script.js and replace myPeer host and port by the ngRok's url pinned on port 3004 :

const  myPeer = new  Peer(undefined, {
	host:  'd18b-93-1-15-153.ngrok.io',
	port:  '443' // default port for https
});

Now you can visit the ngRok's url pinned on port 3003 (https://faaf-93-1-15-153.ngrok.io in the example) and share the link with the roomId to a friend.

zoom-clone's People

Contributors

jkancel avatar

Stargazers

Roman avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.