With Twilio Programmable Video you can add robust video chat functionality to web applications built with Angular and ASP.NET Core. With the Microsoft Azure App Service you can host your video-enabled apps on a fully managed, enterprise-grade cloud platform. Deployment and configuration are easy and take just minutes.

Build a Video Chat App with ASP.NET Core, Angular, and Twilio showed you how to integrate the Twilio JavaScript SDK and the Twilio .NET SDK seamlessly with ASP.NET Core and Angular. This post will show you how to deploy applications built with these technologies to the Azure App Service.

You will learn how to publish your application to the Azure App Service, and securely configure the app on Azure to use the Twilio Video Chat API with the App Service settings. You’ll be able to try out the production applications’ video chat features and verify that it’s correctly configured.

Prerequisites

GitHub account (if you want to fork the project source code, free)

Microsoft account (free, required to create an Azure account)

Azure account (trial account with 12 months of free services)

Twilio account (free developer account)

Visual Studio 2017 or 2019 (free Community Edition)

Get the video chat project source code

There are two ways to get the source code for the video chat project you’ll be deploying to Azure:

Follow the instructions in the previous post (if you haven’t already) which will teach you how to build a fully-functioning video chat application running locally. Get the source code from the author's GitHub repository (Offered under the MIT License, this project includes additional UI styling, functionality for persistent configuration selections, and other features typically found in a production app.)

To get the source code from GitHub, navigate to https://github.com/IEvangelist/IEvangelist.VideoChat in your browser and click Clone or download.

If you have a GitHub account and have enabled Visual Studio integration you can click Open in Visual Studio. You’ll have the opportunity to select the directory where the local repository will be located.

You can, of course, also use whatever process you prefer for creating local projects and repositories. If you’re using Visual Studio 2019, the cloud-first workflow enables a quick alternative to cloning the GitHub repository.

Get started with Twilio Programmable Video

If you build the project by following the steps in the previous post you will create a Twilio account and a Programmable Video project as part of that process. You can skip the rest of the instructions in this section.

If you’ve downloaded the project source code from GitHub you’ll need a free Twilio trial account and a Twilio Programmable Video project to be able to run the project locally or on Azure. Getting set up will take just a few minutes.

Once you have a Twilio account, go to the Twilio Console and perform the following steps:

On the dashboard home, locate your Account SID and Auth Token and copy them to a safe place. Select the Programmable Video section of the Console. Under Tools > API Keys, create a new API key with a friendly name of your choosing and copy the SID and API Secret to a safe place.

The credentials you just acquired are user secrets, so don’t store them in the project source code. Remember that inadvertent disclosure of user secrets can result in unexpected billings.

If you are going to run the project locally, which you’ll need to do to make changes and experiment with Azure’s continuous integration features, you’ll need your Twilio credentials on your local machine. One way to keep them safe and make them accessible in your project configuration is to store them as environment variables on your development machine.

ASP.NET Core can access environment variables through the Microsoft.Extensions.Configuration package so they can be used as properties of a IConfiguration object in the Startup class. The following instructions show you how to do this on Windows.

Execute the following commands at a Windows command prompt, substituting your credentials for the placeholders. For other operating systems, use comparable commands to create the same environment variables.