Vonage Video Express

Deprecation Notice

Vonage Video Express is now deprecated. While the library remains available for existing integrations, we recommend that all new projects and customers looking to migrate use the Video API Reference App.

Why the Change?

The Video API Reference App provides a more robust, modern, and customizable foundation for building multiparty video applications. It offers:

Best Practices: Up-to-date implementation of the Core Video SDKs.
Production-Ready UI: Highly customizable components for Web, iOS, and Android.
Advanced Features: Better support for complex layouts and modern browser capabilities.

Next Steps:

New & Existing Users: Please start your journey with the Video API Reference App Overview.
For additional guidance, Contact Vonage Video support (support@api.vonage.com).

Getting started

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

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
widgets.copy
```
<script src="https://static.opentok.com/v1/js/video-express.js"></script>
```

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:

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>

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.