Exercício – Comece

  • 3 minutos

Os Aplicativos Web Estáticos do Azure publicam sites em um ambiente de produção compilando aplicativos de um repositório do GitHub. Neste exercício, você criará um aplicativo Web usando o Blazor de um repositório GitHub.

Criar um repositório

Este módulo facilita a criação de um repositório usando um repositório de modelos do GitHub. Há um modelo disponível, que contém um aplicativo inicial criado com o Blazor.

  1. Vá para a página de criação com modelo do repositório de modelos.

    • Se receber um erro do tipo 404 Página Não Encontrada, entre no GitHub e tente novamente.

  2. Se for solicitado Proprietário, escolha uma das suas contas do GitHub.

  3. Dê ao repositório o nome my-static-blazor-app.

  4. Os Aplicativos Web Estáticos do Azure dão suporte a repositórios públicos e privados. Para este exercício, selecione Privado como a visibilidade.

  5. Selecione Criar repositório.

Executar o aplicativo

Você acabou de criar um repositório GitHub chamado my-static-blazor-app na sua conta do GitHub. Em seguida, você clona o repositório e executa o código localmente em seu computador.

  1. No repositório GitHub, selecione Código e copie a URL em HTTPS. Abra o Visual Studio e selecione Clonar um Repositório. Adicione a URL copiada ao local do Repositório, adicione um Caminho e selecione Clonar.

    • Caso você tenha várias versões do Visual Studio instaladas, verifique se o aplicativo está aberto no Visual Studio 2022 ou posterior.

  2. Abra o arquivo de solução, ShoppingList.sln.

    Captura de tela indicando onde abrir a solução da lista de compras.

  3. Por fim, execute o aplicativo cliente front-end selecionando Client como o projeto de inicialização e iniciando o depurador.

    Captura de tela mostrando o projeto do cliente selecionado.

Vá para o seu aplicativo

É hora de ver o aplicativo em execução localmente. O Visual Studio abre o site no navegador padrão.

Captura de tela mostrando a interface do usuário do seu aplicativo Web.

O aplicativo deve dizer Carregando dados..., porque ainda não há dados nem API. Adicione a API para seu aplicativo Web mais adiante neste módulo.

Agora, pare o aplicativo em execução encerrando a sessão de depuração no Visual Studio.

Próximas etapas

Você criou o aplicativo e agora ele está sendo executado localmente no navegador.

Em seguida, você publica seu aplicativo nos Aplicativos Web Estáticos do Azure.