Vonage Video Express

Vonage Video Express is a JavaScript library to quickly create a multiparty video conference web application. It works on top of the Vonage Video API for JavaScript.

A Quick Start

  1. Install the Video Express package:
  • Installation using the npm package

    npm i --save @vonage/video-express
  • We can also use a script tag in the <head> section of the HTML page, to include Vonage Video Express in our application

    <script src="https://static.opentok.com/v1/js/video-express.js"></script>
    
  1. Currently, Vonage Video Express doesn't include a default UI. So you will need to add CSS to style the room components in your app:

For a quick start, copy the video-express-styles.css file and include it in your head section:

<link rel="stylesheet" href="/path/to/video-express-styles.css" media="screen" charset="utf-8">
  1. Add a div element within the body section. This will be the room container. The SDK will append all of its DOM components within this container:
<body>
  <div id="roomContainer"></div>
</body>
  1. Use this code snippet to create a room and to join the video conference. To create the room object, you will need to provide your API key, a session ID, and a token for the session:
<script type="text/javascript">
  const room = new VideoExpress.Room({
    apiKey: '', // add your Application ID
    sessionId: '', // add your Session ID
    token: '', // add your token
    roomContainer: 'roomContainer',
  });

  room.join();
</script>

See the guide on Session Creation and Token Creation.

More resources

See the Video Express API reference and guide.