Eu estava lendo Postagem do weblog de Gabby sobre a nova experiência de projeto TypeScript/JavaScript no Visible Studio 2022. Você deve ler os documentos em JavaScript e TypeScript no Visible Studio 2022.
Se você está acostumado com aplicativos ASP.NET, quando pensa em aplicativos que usam muito JavaScript, “aplicativos front-end” ou focados em TypeScript, pode ser confuso “onde o .NET se encaixa?”
Você precisa considerar as responsabilidades de seus vários projetos ou subsistemas e as múltiplas maneiras totalmente válidas de construir um website ou aplicativo internet. Vamos considerar apenas algumas:
- Um aplicativo Net ASP.NET que renderiza HTML no servidor, mas usa TS/JS
- Isso pode ter uma API Net, Razor Pages, com ou sem o padrão MVC.
- Talvez você tenha adicionado JavaScript through
- Um aplicativo frontend principalmente JavaScript/TypeScript onde o HTML pode ser servido de qualquer servidor internet (node, kestrel, aplicativos internet estáticos, nginx, and so on.)
- Este aplicativo pode usar Vue, React ou Angular, mas não é um “aplicativo ASP.NET”
- Ele chama APIs da Net de backend que podem ser atendidas por ASP.NET, Azure Features, APIs REST de terceiros ou todos os itens acima
- Este cenário às vezes tem sido confuso para desenvolvedores ASP.NET que podem ficar confusos sobre responsabilidade. Quem constrói o quê, onde as coisas acabam, como eu construo e implanto isso?
VS2022 traz suporte a JavaScript e TypeScript para o VS com um JavaScript Language Service completo baseado em TS. Ele fornece um pacote TypeScript NuGet para que você possa construir seu aplicativo inteiro com MSBuild e o VS fará a coisa certa.
NOVO: A partir do Visible Studio 2022, há um novo tipo de projeto JavaScript/TypeScript (.esproj) que permite criar projetos Angular, React e Vue independentes no Visible Studio.
O conceito .esproj é ótimo para pessoas familiarizadas com o Visible Studio, pois sabemos que uma Answer contém um ou mais Tasks. O Visible Studio gerencia arquivos para um único aplicativo em um Projeto. O projeto inclui código-fonte, recursos e arquivos de configuração. Neste caso, podemos ter um .csproj para uma API Net de backend e um .esproj que usa um template do lado do cliente como Angular, React ou Vue.
O problema é que, historicamente, quando o Visible Studio dava suporte a Angular, React ou Vue, seus modelos estavam desatualizados e não eram atualizados o suficiente. O VS2022 usa CLIs nativos para esses entrance ends, resolvendo esse problema com CLI angular, Criar aplicativo Reacte CLI do Vue.
Se eu estiver no VS e for “File New Mission”, há modelos Standalone que resolvem o Exemplo 2 acima. Vou escolher JavaScript React.
Então clicarei em “Adicionar integração para API Net ASP.NET vazia”. Isso me dará um frontend com javascript pronto para chamar um backend de API Net ASP.NET. siga aqui.
Em seguida, ele usa o React CLI para criar o front-end, o que, novamente, é authorized, pois é qualquer versão que eu quiser.
Então adicionarei meu backend ASP.NET Net API à mesma solução, então agora tenho um esproj e um csproj como este
Agora eu tenho um sistema de dois projetos limpo e agradável – neste caso mais focado em JavaScript do que em .NET. Este usa npm para iniciar o projeto usando seu servidor de desenvolvimento internet e proxyMiddleware para fazer proxy de chamadas localhost:3000 para o projeto ASP.NET Net API.
Aqui está um aplicativo React servido pelo npm chamando o serviço Climate servido pelo Kestrel no ASP.NET.

Isso é invertido do que a maioria das pessoas do ASP.NET estão acostumadas, e isso é OK. Isso me mostra que o Visible Studio 2022 pode suportar qualquer estilo de desenvolvimento, usar a CLI que está instalada para qualquer Frontend Framework e me permitir escolher qual servidor internet e navegador internet (through Launch.json) eu quero.
Se você quiser virá-lo, e coloque o ASP.NET Core como primário e então traga algum TypeScript/JavaScript, siga este tutorial porque isso também é possível!
Patrocinador: Faça do login um problema do Auth0. Não seu. Forneça os recursos de login convenientes que seus clientes desejam, como login social, autenticação multifator, login único, sem senha e muito mais. Comece gratuitamente.
Sobre Scott
Scott Hanselman é um ex-professor, ex-arquiteto-chefe em finanças, agora palestrante, consultor, pai, diabético e funcionário da Microsoft. Ele é um comediante de stand-up fracassado, um cornrower e um autor de livros.