Crie seu primeiro aplicativo Web com o ASP.NET Core usando o Blazor

Criar seu aplicativo

  1. Abra a paleta de comandos no VS Code pressionando CTRL+SHIFT+P.
  2. Abra a paleta de comandos no VS Code pressionando CMD+SHIFT+P.
  3. Digite .NET: para ver os comandos que você pode executar com o Kit de Desenvolvimento em C#.
  4. Localize e selecione .NET: Novo Projeto para criar um novo projeto .NET.
  5. Role para baixo e selecione Blazor Web App.
  6. Escolha o local da pasta em que você deseja salvar seu projeto.
  7. Nomeie o projeto BlazorApp na paleta de comandos quando solicitado. Pressione Enter para confirmar.

Habilite a Confiança do Workspace marcando a caixa e selecionando Sim, eu confio nos autores.

Caixa de diálogo de confiança do workspace

Se você tiver uma Assinatura do Visual Studio, entre na sua conta. Se você não vir um prompt, clique no ícone C# na barra de status do VS Code, na parte inferior direita da janela.

Entrar com a Assinatura do VS

Na Barra Lateral, certifique-se de que o VS Code Explorer esteja aberto. Aqui, você verá a pasta BlazorApp e o Gerenciador de Soluções.
Acompanhe o vídeo abaixo para: recolher a pasta BlazorApp, abrir o projeto Gerenciador de Soluções, abrir o projeto BlazorApp e arrastar e soltar o Gerenciador de Soluções mais para cima.

  1. Recolha a pasta BlazorApp no VS Code Explorer.
  2. Clique na divisa à esquerda do Gerenciador de Soluções para expandi-lo.
  3. Clique na divisa à esquerda do projeto do BlazorApp no Gerenciador de Soluções para expandi-lo.
  4. Arraste e solte o Gerenciador de Soluções abaixo de BlazorApp.

O seu projeto foi criado e carregado no Visual Studio Code. Dê uma olhada no conteúdo do seu projeto usando o Gerenciador de Soluções.

O Gerenciador de Soluções contém uma lista de pastas e arquivos criados para seu projeto

Vários arquivos foram criados para fornecer a você um aplicativo Blazor simples pronto para ser executado.

  • Program.cs é o ponto de entrada para o aplicativo que inicia o servidor e onde você configura os serviços de aplicativo e middleware.
  • Dentro do diretório Components:

    • O App.razor é o componente raiz do aplicativo.
    • Routes.razor configura o roteador Blazor.
    • O diretório Pages contém algumas páginas da Web de exemplo para o aplicativo.
  • BlazorApp.csproj define o projeto do aplicativo e suas dependências. Ele pode ser exibido clicando duas vezes no nó do projeto BlazorApp no Gerenciador de Soluções.
  • O arquivo launchSettings.json dentro do diretório Properties define diferentes configurações de perfil para o ambiente de desenvolvimento local. Um número de porta é atribuído automaticamente na criação do projeto e salvo neste arquivo.

Se tudo estiver certo, selecione o botão Continuar abaixo para ir para a próxima etapa.

Continuar