Build your first Teams calling application

Browse code

This tutorial demonstrates step-by-step instructions to build a video calling web application empowered by Azure Communication Service. This application connects you to a Microsoft Teams user as shown in the picture. The dark window on the right is using Microsoft Teams whereas the bright window on the left is the application we will build. The tutorial has a prerequisites section that prepares you for further development. After the prerequisites section, we will prepare you for web development environment; give you sample code to build and run; and teach you how to use the application.

Table of Contents

• Prerequisites
• Setup development environment
• Develop the code
• Run the code
• Use the application
• Ask questions

Prerequisites

• Create Microsoft Azure account with active subscription
• You need to have Node.js 18. You can use the msi installer to install it.
• Add Azure Communication Service resrouce to your Azure subscription
• Create User Access Token
• Obtain a Teams id using Graph Explorer

Run the code

1. Run npm i on the directory of the project to install dependencies

2. Use the webpack serve command to build and run the app on a local server: npx webpack serve --config webpack.config.js

3. Go to http://localhost:8080/ from your browser to access the application.

Use the application

1. Enter the User access token you acquired from Prerequisites, and click login

2. Enter a Teams id you acquired from “Prerequisites” as your callee, and click Start Call

Congratulations! You just set up your first Teams calling application!

Ask questions

You can post your questions via our support channels.