Giter Club home page Giter Club logo

next-webrtc's Introduction

An open source live screen share and webcam video recorder

Deploy your instance

  1. Deploy the backend project to some cloud (heroku etc) to consume websockets.
  2. Deploy the frontend project to vercel with single click Deploy with Vercel
  3. Add required env variables
    • NEXT_PUBLIC_WEBSOCKET_URL - URL to your websocket server. The backend deployment. If you want to use meeting feature
    • NEXT_PUBLIC_URL - URL of your site
    • NODE_ENV - development or production

Features

  • Background removal
  • Virtual backgrounds
  • Background blur

Contributions

Welcome :)

Requirements

  1. Node >= v15.x
  2. npm >= v7
  3. yarn 1.x

Code structure

  1. It is a monorepo managed by yarn
  2. There are two packages backend and frontend
  3. Backend is just a small websocket server used for signaling
  4. Frontend is actual UI built with nextjs
  5. It uses google stun server for populating ice candidates

How to run

  1. Install all dependencies using yarn --frozen-lockfile
  2. add .env see the contents below
  3. run backend using yarn workspaces @openrtc/backend start
  4. run frontend using yarn workspaces @openrtc/frontend start

.env contents

NEXT_PUBLIC_WEBSOCKET_URL=wss://localhost:4000/
NODE_ENV=development
NEXT_PUBLIC_URL=http://localhost:3000

How to build

  1. You dont need to build backend
  2. You can build frontend package with yarn workspaces @openrtc/frontend build command

TO DO

  1. Handle if someone stops screen share in recording vlog
    • This currently stops recording
    • Ideally it should keep on recording but change video from screen to user
  2. First time visitor faces lag in audio recording
  3. First time visitor can not see small PiP video
  4. Microphone volume control
  5. Ability to name the video file - Currently it uses ISO date time string

next-webrtc's People

Contributors

aromalanil avatar technikhil314 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.