Criar um novo aplicativo de Teams

Nesta secção, pode aprender a criar um novo projeto do Microsoft Teams com o Microsoft Visual Studio Code.

Criar um novo projeto do Teams com o Visual Studio Code

Pode criar um novo projeto do Teams ao selecionar Criar uma Nova Aplicação no Microsoft Teams Toolkit. Pode começar a partir de modelos de aplicações do Teams incorporados ou começar a partir de exemplos de aplicações oficiais do Teams no Teams Toolkit. Além disso, o Teams Toolkit suporta começar com modelos de Suplementos do Outlook para criar os seus próprios Suplementos do Outlook.

Para começar com as capacidades do Teams, pode criar os seguintes tipos de aplicação teams:

Tipos de Aplicações	Definição
Aplicações do Teams baseadas em cenários	Este grupo de modelos foi concebido para cenários empresariais abstratos específicos para os quais a sua aplicação de equipas pode servir. Por exemplo, bot de notificação, bot de comandos, separador com SSO ativado ou aplicação de separador Dashboard.
Aplicações Básicas do Teams	As aplicações básicas do Teams são apenas o separador, bot ou extensão de mensagens hello world teams que pode criar e personalizar com base nos seus requisitos.
Expandir a Aplicação Teams através do Microsoft 365	Este grupo de aplicações do Teams pode ser instalado e executado no Outlook e Office.com.

Criar um novo aplicativo de Teams

O processo de criação de uma nova aplicação do Teams é semelhante para todos os tipos de aplicações.

Para criar uma aplicação básica do Teams:

1. Abra o Visual Studio Code.

2. Selecione o Toolkit> do TeamsCriar uma Nova Aplicação.

   

3. Neste exemplo, selecione Tabulação como capacidade de aplicação.

   

4. Selecione Separador Básico como capacidade de aplicação.

   

5. Selecione JavaScript como linguagem de programação.

   

6. Selecione Pasta predefinida para armazenar a pasta raiz do projeto na localização predefinida.

   

   Saiba como alterar a pasta predefinida:

   1. Selecione Procurar.

      

   2. Selecione a localização da área de trabalho do projeto.

      

   A pasta que selecionar é a localização da área de trabalho do projeto.

   1. Introduza um nome adequado para a sua aplicação, como helloworld, como o nome da aplicação. Certifique-se de que utiliza apenas carateres alfanuméricos. Pressione Enter.

   

   A aplicação de separador Teams é criada dentro de alguns segundos.

   

Estrutura de diretórios para diferentes tipos de aplicações

O Teams Toolkit fornece todos os componentes para criar uma aplicação. Depois de criar o projeto, pode ver as pastas e os ficheiros do projeto na secção EXPLORADOR .

Estrutura de diretórios para a aplicação básica do Teams

O exemplo seguinte mostra uma estrutura básica do diretório da aplicação de separador do Teams:

Nome da pasta	Conteúdos
.vscode	Definições para o VS Code criar e depurar a sua aplicação Teams.
appPackage	Ficheiro de manifesto de aplicação (anteriormente denominado manifesto de aplicação do Teams) e ficheiros de ícone que o Teams utilizou para reconhecer a sua aplicação teams.
env	Armazena parâmetros de ambiente diferentes.
infra	Ficheiros de modelo do Azure bicep . Utilizado para implementar a sua aplicação Teams no Azure.
src	Código fonte para a capacidade de Tabulação, incluindo a sua aplicação de front-end, componentes da IU e o aviso de privacidade, termos de utilização,
src/app.js	Processadores e restify pontos de entrada de aplicações para o site.
src/views/hello.html	Um modelo HTML que está vinculado ao ponto final do separador.
src/static	O servidor Web pode servir recursos estáticos, como ficheiros CSS e JavaScript.
teamsapp.yml	Este ficheiro de configuração define o comportamento do Teams Toolkit para aprovisionar, implementar e publicar ciclo de vida. Pode personalizar este ficheiro para alterar o comportamento do Teams Toolkit em cada ciclo de vida.
teamsapp.local.yml	Isto substitui teamsapp.yml com ações que permitem a execução local e a depuração.

Observação

Se tiver uma aplicação de extensão de bot ou mensagem, as pastas relevantes são adicionadas à estrutura do diretório.

Para saber mais sobre a estrutura de diretórios de diferentes tipos de aplicações básicas do Teams, consulte a tabela seguinte:

Tipo de Aplicação	Links
Para a aplicação de separador	Crie seu primeiro aplicativo de guia usando JavaScript
Para a aplicação bot	Crie seu primeiro aplicativo de bot usando JavaScript
Para a aplicação de extensão de mensagem	Criar seu primeiro aplicativo de extensão de mensagem usando JavaScript

Estrutura de diretórios para a aplicação Teams baseada em cenários

O exemplo seguinte mostra uma estrutura de diretório de aplicações do Teams baseada em cenários:

A nova pasta do projeto contém o seguinte conteúdo:

Nome da pasta	Conteúdos
.vscode	Definições para o VS Code criar e depurar a sua aplicação Teams.
appPackage	O ficheiro de manifesto da aplicação e os ficheiros de ícone que o Teams utilizou para reconhecer a sua aplicação Teams.
env	Armazena parâmetros de ambiente diferentes.
infra	Ficheiros de modelo do Azure bicep . Utilizado para implementar a sua aplicação Teams no Azure.
teamsapp.yml	Este ficheiro de configuração define o comportamento do Teams Toolkit para aprovisionar, implementar e publicar ciclo de vida. Pode personalizar este ficheiro para alterar o comportamento do Teams Toolkit em cada ciclo de vida.
teamsapp.local.yml	Isto substitui teamsapp.yml com ações que permitem a execução local e a depuração.

A implementação da notificação principal é armazenada na pasta src e contém:

Nome do arquivo	Conteúdos
src\adaptiveCards\	Modelos para Cartão Ajustável.
src\internal\	Gerado o código de inicialização para a funcionalidade de notificação.
src\index.ts	O ponto de entrada para processar mensagens de bot e enviar notificações.
.gitignore	Ficheiro para excluir ficheiros locais do projeto de bot.
package.json	O ficheiro de pacote npm para o projeto de bot.

Observação

Se tiver um bot de comandos, um bot de fluxo de trabalho, um separador com SSO ativado ou uma aplicação de separador SPFx, as pastas relevantes são adicionadas à estrutura do diretório.

Para saber mais sobre a estrutura de diretórios de diferentes tipos de aplicações do Teams baseadas em cenários, consulte a tabela seguinte:

Tipo de Aplicação	Links
Para a aplicação de bot de notificação	Enviar notificação para o Teams
Para a aplicação de bot de comandos	Criar bot de comando
Para a aplicação bot de fluxo de trabalho	Criar bot de fluxo de trabalho do Teams
Para a aplicação de separador SPFx	Criar um aplicativo Teams com SPFx

Confira também

• Descrição Geral do Teams Toolkit
• Criar um aplicativo do Teams com o Blazor
• Criar um aplicativo Teams com C# ou .NET
• Pré-requisitos para todos os tipos de ambiente e criar a sua aplicação Teams
• Preparar para criar aplicações com o Microsoft Teams Toolkit