Exercício – Scaffolding de um aplicativo Web de chamadas de voz

3 minutos

Nesta unidade, você criará um aplicativo Web e o executará no navegador.

Criar a pasta do aplicativo

Em uma janela de console (como cmd, PowerShell ou Bash), use os comandos a seguir a fim de criar uma pasta para nosso aplicativo e alterar para ela
```
mkdir VoiceCallingApp
cd VoiceCallingApp
```
Em seguida, prepararemos a nova pasta para se tornar um aplicativo Web.
```
npm init -y
```

Isso vai configurar a pasta para o Node.js e permitirá que você salve e gerencie as dependências.

Adicione as dependências necessárias

Agora, adicionaremos as dependências necessárias.

Começaremos adicionando as específicas dos Serviços de Comunicação do Azure.
```
npm install --save @azure/communication-common @azure/communication-calling
```
Em seguida o Pacote, que nos permitirá executar o aplicativo em um navegador.
```
npm install --save-dev parcel
```

Criar o arquivo HTML de índice

Crie um arquivo chamado index.html no diretório do se aplicativo.

Insira o texto a seguir como conteúdo desse arquivo.

<!DOCTYPE html>
<html>
  <head>
    <title>Azure Communication Services - Simple voice calling app</title>
  </head>
  <body>
    <h1>Azure Communication Services</h1>
    <h2>Simple voice calling app</h2>

    <!-- Calling HTML here -->

    <script src="./app.js" type="module"></script>
  </body>
</html>

Criar o arquivo JavaScript do aplicativo

Criar um arquivo chamado app.js no diretório do aplicativo
Por enquanto, deixe o arquivo app.js vazio. Adicionaremos conteúdo nele durante a próxima unidade.

Testar o novo aplicativo

Em uma janela do console, no diretório do projeto, execute o seguinte comando:
```
npx parcel index.html
```
O Pacote compilará e executará seu aplicativo.
Depois de concluído, ele fornecerá um link para ver seu aplicativo no navegador. Esse link é geralmente http://localhost:1234/:
Abra este link no navegador e você deverá ver seu aplicativo em branco no navegador: