Vue + Daily call object (custom) video call demo

This project demonstrates how to build a custom video call with Daily's custom call object mode using Vue.js.

To view a deployed example of this demo, visit https://vue-call-object.netlify.app.

---

Running this demo locally

Clone this repo and, from the project directory, run:

npm install
npm run dev

Open http://localhost:8080 to view it in the browser.

Getting set up with Daily

To use this demo, you will need a Daily room to join.

To get a Daily room URL, create a Daily account.

Once you have an account and are logged into the Daily Dashboard, you can create a new Daily room.

Copy the new room's URL. You can use this in the form on the home page.

The room URL will be in the following format:

https://<your-daily-domain>.daily.co/<room-name>

---

Features

This demo demonstrates how to build a video call in Vue with the following features:

• multi-participant calls
• local participant controls to:
  • control camera and microphone devices
  • share your screen (a limit of 1 screen share at a time is enforced here for simplicity)
  • leave the current call
• join any Daily call
• set your username before joining the call

Ideas for expanding this demo

Some features that could be added to this demo include:

• Adding prejoin UI to test devices and see your local video before joining
• Allowing users to create rooms via the app using Daily's REST API
• Managing meeting permissions via room settings, like making the call a broadcast call

---

Related blog posts/tutorials

Learn more about this demo on the Daily blog.

• Build a custom video chat app with Daily and Vue.js
• Build a custom chat widget in Vue with Daily’s sendAppMessage