Build a Video Conferencing App using SignalWire and Vue 3

Using the SignalWire Video API and Javascript SDK you can quickly build an app that leverages powerful video conferencing features along with Room Previews and fully customize the experience for your users.

We’ve published an open-source example built in the popular Vue 3 JavaScript web framework that demonstrates how you can build a full-featured video conferencing web app. The bonus? It is already capable of going to scale using the SignalWire Video API and Javascript SDK.

Features of the SignalWire Video VueJs example:

• Join or Create temporary Room Sessions
• Meeting controls such as Mute Audio/Video and Share Screen
• Change Camera and Microphone devices
• Change Room Layouts
• List Rooms with Room Previews
• Join Active Rooms from the homepage

Why SignalWire?

Other video conferencing APIs and applications rely on SFU (Selective Forwarding Unit) which means every user is responsible for handling streams to and from other users.

The SignalWire Video Conferencing API takes an MCU (Multipoint Control Unit) approach which reduces the load on the client resulting in minimized latency and the ability to participate in large-scale calls within a browser. Essentially, everyone streams to the SignalWire servers and we send back one stream.

SignalWire also recently launched the new Room Previews feature. When enabled on a Room Session, a link to an mp4 of the last few seconds of the sessions is returned when fetching a room’s properties. For those adopting a remote-first approach to business, this provides an experience of spontaneous engagement with conversations, akin to running into co-workers around the office.

Running and Using the Vue 3 Example

We’ve provided instructions on running our example application locally or in the cloud using Replit.com. In just a few minutes you can deploy your own video conferencing app that works on Desktop and Mobile. All the code is freely provided and well-documented so you can modify it as needed or to use as reference.

Instructions can be found in the SignalWire-Video-VueJS GitHub Repository.

Here at SignalWire, we love our community of developers! Find us on the SignalWire Twitter and be sure to join our SignalWire Community Slack. We’re always happy to help answer questions and we look forward to engaging with you!

Also Published Here