@glints/video-rooms-client

Glints Video Rooms Client

This project is a fork of https://github.com/twilio/twilio-video-app-react. We converted their stand-alone app into a component that can be used in our front-end projects. A majority of the code-base is still the same as in the parent project, so if anything is unclear here, you can check their repo too.

Usage

Don't run this server-side or you will get errors! Provide a token for joining the room as a Promise through the getToken prop as shown below.

import VideoClient from 'glints-video-rooms-client';
const VideoClient = dynamic(() => import('glints-video-rooms-client'), { ssr: false });

// ...

<TwilioVideoClient getToken={Promise.resolve({token})} />

Testing With yalc

To test the VideoClient component inside our front-end projects, you can use yalc to publish this package to a mock local package registry. This should work even if there is another version of @glints/video-rooms-client already installed.

yarn build
npx yalc publish // only fist time
npx yalc push // subsequently

// in other project
npx yalc add @glints/video-rooms-client // don't use LINK
yarn

To remove, run npx yalc remove --all.

Standalone

For active development, it might be easier to run this as a stand-alone project. To do this, create a file .env based on the .env.example file and paste your Twilio credentials there. Then run yarn start to run a token-server based on your Twilio credentials, and the Video Client in standalone mode. A browser tab should open at localhost:3000.

Publishing

Bump the version with npm version patch (or minor/major). Run npm run build. Then you can npm publish. Please only do this on the master branch, after checking for changes upstream with git pull, otherwise two people might end up trying to publish the same version.