Depurando código Node.js noVisual Studio


Depurando código Node.js noVisual Studio

Veremos nesse artigo como depurar código Node.js no Visual Studio

Para os desenvolvedores de formação .NET que nem eu, quando entram em uma nova stack que precisam depurar algum código logo lembram do break point que nós ajuda muito no Visual Studio.

Vejamos nesse artigo como depurar codigos JavaScript no Visual Studio code e no Visual Studio 2017 versão community.

Nosso primeiro passo será com o Visual Studio 2017. Para isso, vamos baixar o projeto que criamos para esse artigo no link, ele é um projeto simples em node com o module express. Agora abra o seu Visual Studio, para esse artigo iremos utilizar a versão 2017 Community, com o VS aberto vá em: file > new Project > Other Languages > JavaScript e selecione Node.js, após isso selecione o template From Existing Node.js code e informe o local que você salvou o projeto. Podemos ver esse passo na imagem a baixo:

template JS no Visual Studio 2017

Com o projeto aberto no Visual Studio, adicione um break point na linha 5 conforme está na imagem a baixo e execute o seu projeto.

Agora que o projeto esta rodando abra no seu navegador o endereço a baixo para que possamos depurar o nosso código:

http://localhost:3030/

Notem que o Visual Studio irá nos informar que o nosso código parou no break point.

Agora passe o mouse no parâmetro req (request) e notem que temos todos os valores da nossa request para depuração.

Agora para que possamos depurar o nosso código e verificar os parâmetros que estamos recebendo, abra a url a baixo no seu navegador e adicione um break point na linha 12 do seu código.

http://localhost:3030/api/users?id=4&name=kratos

Agora com o immediate window aberto no Visual Studio vamos verificar se estamos recebendo o parametro name corretamente:

Notem que estamos com o nosso código parado no break point e com o immedite conseguimos depurar o nosso código Node da mesma forma que fazemos com o C# ou qualquer outra linhagem back end que utilizamos com o Visual Studio.

Agora para que possamos depurar com o Visual Studio Code, abra o seu projeto nele, adicione um break point no linha 8 novamente, feito isso clique no icone de debug do VS que fica na lateral esquerda da IDE e clique no botão de play conforme imagem a baixo:

Notem que iremos que ira aparecer a mensagem a baixo na aba de Debug Console que o projeto esta sendo executado na porta 3030:

Abra no seu navegador o endereço que esta aparecendo no server e note que ele ira parar no break point da mesma forma que no Visual Studio 2017.

Com isso nós conseguimos desenvolver de uma forma mais produtiva e em caso de erros depurarmos o nosso código de uma maneira mais rápida.

Compartilhe:

Share on facebook
Facebook
Share on twitter
Twitter
Share on pinterest
Pinterest
Share on linkedin
LinkedIn

Table of Contents

Postagens Relacionadas

iphone12

Apple iPhone 12 Pro Max

Apple iPhone 12 Pro Max  CPU Apple A14 Bionic  RAM 6 GB  Armazenamento 512 GB  Display 6.7 XDR OLED  Câmera 12 Mp + 12 Mp
RockBottomRiser

Rock Bottom Riser

Rock Bottom Riser 01/03/2021(US) – Documentário – 1h 10min –   Nota: 0/10   Sinopse     Elenco Nainoa Thompson Como – master navigator Moses
SaferatHome

Safer at Home

Safer at Home 26/02/2021(US) – Filmes – 0h 0min –   Nota: 0/10   Sinopse     Elenco Mais informações Título Original Safer at Home
SouLunaOUltimoShow

Sou Luna: O Último Show

O elenco de “Sou Luna” se apresenta ao vivo pela última vez no mítico estádio Luna Park em Buenos Aires. Vamos acompanhá-los na intimidade dos bastidores e r…