Debug de aplicações Node.js com VSCode | Code/Drops #11

[@FelipeEBatista]

Kkkk Eu faço exatamente isso coloco vários console.log("chegou aqui") Kkkkkk

[@CharlesMendes1985]

console.info("Obrigado, excelente dica, cheguei aqui ! ");

[@guilhermecardosodealmeida9498]

Adorei o vídeo, mas eu queria mesmo, era ver como configurar o Debug do VS para o react e react-native... Abraço !!!

[@relfarias]

guilherme cardoso de almeida eles ja fizeram algo so n lembro se esta no youtube ou no skylab

[@guilhermecardosodealmeida9498]

@@relfarias puxa muito obrigado ! se vc puder me mandar o link Agradeço muiiiito, eu vou tentar procurar aqui no canal

[@albuquerquedev5200]

@@guilhermecardosodealmeida9498 e o cara não mandou...

[@Mexares]

Eu sou super novato com node/react, e é um dificuldade enorme pra achar conteúdo direto, todo video acaba com varias coisas ao invés do que ta no titulo. O video é ótimo, mas acho que se a pessoa nãos abe debugar no vs code é pq ela realmente ta no começo e jogar outras informações desconexas acho q acaba mais confundindo do que ajudando. Não é bem uma critica ao seu conteúdo, é mais um desabafo pessoal...

[@rafaelcascalho4180]

Mais uma vida salva...nem todo herói usa capa. kkkk Valeu Diego

[@wiltonvieira8201]

Excelente!!! Fica uma sugestão para o próximo vídeo: PWA, como fazer a implementação com React Web... VALEU!!

[@Alexedtion]

Maravilha. Principalmente service workers.

[@relfarias]

Yayyy Thank u!!! Como sempre otimos conteudos Preciso aprender debug d node p serveless usando servless offline Isso vai me ajudar tanto espero

[@thsurf]

Da próxima poderia usar o debug com react.

[@williamdantas-dev]

A intro sempre me lembra o programa de "fale com o fábio" do canal The Hardware Show

[@viniciossilva5414]

Exatamente @Larissa Dantas

[@victormacgrath]

Curti muito, ja estava ha tempos querendo saber sobre o debug no vscode. O que você está usando no terminal para ter o auto complete?

[@adrianbgois]

tambem quero saber

[@sandroverissimo6713]

O "skipFiles" não está funcionando no request "attach", fica exibindo os processos internos do express. Alguma dica?

[@kaua_sa_nzx]

9:37 "O VSCode tem uma ferramenta muito legal que é essa barata" kkkkk valeu Diego e equipe da rocketseat aprendi muito com o canal de vocês e ate hoje aprendo

[@nexusprime_here]

A, b, kkkkkk é só se vc acabou de começar. Se tu tá a 2hrs programando, se bota no console: vai caraio, PORRAAAAA

[@wagutoxD]

Eu não entendi nada... e achei legal mesmo assim! Sou muito novato. Ver tudo isso é maneiro, mas bate aquela insegurança, pois parece impossível lidar com tanta coisa... Mas ainda vou ser um programador minimamente respeitável!

[@rodbrowning]

Acabei de voltar kkkk tinha saído do vídeo pra ver mais sobre em conteúdo de fora que é mais sucinto, de repente lembrei kkkk "qual foi a conclusão daquele vídeo mesmo" kkkkk enrola demais .

[@arturcadorin95]

Loool. I legit spend 6 years using gms before finally getting serum. I was making blown out saw softs and exporting them to Edison

[@eduardoleaoleao8860]

abri a configuraçao do debug "protocol": "inspector" apareceu a mensagem de error Property protocol is not allowed. alguem mim ajudar como resolvo

[@viniciusnyari9727]

console.log('Valeu pelas dicas!');

[@thomasjardanedeoliveirabou9993]

Eu sempre acho estranho ver essas funcionalidades que eu nunca ouvi falar, por exemplo, entendo que call stack é um conceito fundamental do node, mas onde que eu posso encontrar essas informações? ou Heap, ou o -inspect, a documentação do node parece ser muito extensa de informações especificas de mais e não parece ser uma boa fonte. As vezes parece que existe algum local cheio dessas informações que todo mundo sabe menos eu, é muito estranho.

[@lucasmaciel8605]

Antigamente eu tinha medo de utilizar debug, pois tinha uma dificuldade de entender as funcionalidades e achava mais pratico utilizar o console.log do Js ou print em Python. Mas depois que comecei a estagiar, utilizando Java no backend em aplicações reais, percebi que utilizar debug é algo obrigatório, até porque não da para ficar escrevendo System.out.println() toda hora sendo que o console já fica co bastante informação relacionada ao proprio servidor da aplicação.

[@paivamarcelo]

Porque não utilizar o require mesmo, ao invés de acrescentar mais código e dependências para utilizar o import ??

[@suzukaoaovento8226]

Alguém aí utiliza o VIMSPECTOR para debuggar no VIM?

[@MarcusPaulo]

Parabéns pelo excelente vídeo, seria muito interessante mostrar o Debug no ReactJS e no React-Native.

[@rudarabellodasilva6149]

Gostaria de ver esse conteúdo no ReactJS

[@rodbrowning]

Por isso que eu parei de acompanhar o canal, 10min e só explicou o que tínhamos deduzido do título kkkkk

[@gersonrevoredo5313]

opa, só pra saber, saiu algum vídeo sobre debug de aplicações web utilizando React ? valeeeu

[@gabrielblpapera]

Ótimo vídeo Diego :) Uma sugestão de podcast seria o tema Desing Pattern, quais vocês (da Rocketseat) acham bacana, quais funcionam no mercado, pontos positivos e negativos, etc

[@ManiaEletronico]

Tem algum e-mail que possa responder no privado? Preciso de uma consultoria paga. Obrigado.

[@jose-x-2826]

MAIS UM CONTEÚDO LIXO DA INTERNET QUE NÃO SERVE DE NADA, ENFIM, CONTINUE COM O CONSOLE.LOG E VIDA QUE SEGUE..

[@msrcio]

Alguém pode me ajudar com uma dúvida , quando rodo um código a minha sentença não aparece . Uso o vscode

[@geovaniperez9777]

Se eu estiver rodando a aplicação dockerizada, como eu faço o inspect dentro de um docker por exemplo: funciona na minha máquina só que no cloud não funciona kkkk

[@guuhzo]

Está em algum repositório git? Se sim, tenta usar o gitpod, já ouviu falar ? Um vscode em cloud, você consegue ate subir a aplicação nele

[@pedrolira3524]

quando eu click no play para debugar da errado(olha o que acontece) abre uma pagina nova do visual code vazia e o point red muda p/ a cor cinza, quem poder me ajudar?

Uma outra ferramenta que passei a usar bastante recentemente, principalmente para debugar códigos de teste unitários, é o terminal de debug do javascript: JavaScript Debug Terminal. Assim posso rodar um único arquivo de teste, por exemplo usando o Jest: 'jest exemplo-teste-unitario.spec'. (excelente vídeo)

[@rocketseat]

Faaaala, Sérgio! Valeeeu! 💜 Poxa, que bacana! Valeu demais pela dica! 😉 Parace ser massa e super prático! 👀

[@rafaelalbano8561]

Como usar essa ferramenta de debugger juntamente com o docker, como ficaria para inspecionar o container criado ?

[@GustavoGAvila]

Excelente dica! Obrigado! Consegui configurar para o ReactJS, mas apenas no modo launcher. No modo attach, que é bem melhor, não consegui ainda :( De acordo com a documentação do Chrome Debugger, é necessário iniciar uma instância do Chrome no modo de debug. Alguém sabe como configurar para o React já abrir o Chrome com essa flag de debug? Valeu!

[@DouglasCruzdgs]

Vinheta igual à do Primo Rico kkk quem copiou quem? kkkk

[@TheMatthewizee]

16:21 - Agora eu venho aqui na baratinha... KKKKKKKKKK nem ele tankou

[@wandersonpo]

Sinceramente, o indivíduo falar q console.log é uma coisa boa eu já descarto o vídeo na hora. Isso é bom pra cara q quer fazer hora pra outros pagarem. Péssimo.

[@rocketseat]

Faala Wanderson! O console.log é uma ótima maneira para debugar algo rapidamente sem precisar fazer todo o processo de debug como mostrado ao decorrer do vídeo. É claro, não é a maneira mais limpa, mas sempre temos que tirar proveito do que as ferramentas nos possibilitam para agilizar o desenvolvimento em geral. 💜💜

[@EpsonLopes]

Achei muito trampo pra fazer um simples debug

[@DanielSouza-py9ty]

passou mas tempo falando sobre o codigo do que a ferramenta em si

[@gfrsolutions8042]

Legal , mas fico com o console.log . Muito overhead

[@daviamerico2268]

o cara perde metade da aula só por causa dessa frescurinha do sucrase

[@emersonjr.2219]

Consigo usar esse servidor para testar um site com html, css e js?

[@walkdead94]

Muito obrigado! Me salvou! :DDD

[@filipeassad53x0]

não aguento mais ver propaganda da rocketseat

[@killiandatabase]

Como faz debug com nestjs?

[@dalciomacuetegarcia9685]

Só um dev pra entender um dev. console.log("love rocketseat");

[@rocketseat]

console.log("Muito obrigada pelo carinho, Dálcio") 💜

[@andrefelipe7530]

Teria como fazer um vídeo de debug usando o TS?

[@RafaelFernandes-ut2dg]

cara me ajudou muito!!! Rocket é rocket

[@bhpjares]

Seria legal depurar o front no VSCode com attachment. Se houver eu agradeceria um video. :D

[@rocketseat]

Faala Bruno! Valeeu pela sugestão! 💜

[@DanielSouza-py9ty]

pra quem e iniciante igual eu ficou sei la

[@ENYO200915]

tem como aplicar isso no angular tbm?

[@luistitossaiete9850]

Acabou a era dos console.log()

[@spwwmtb]

como sempre TOP né diegão!

[@kesleydaviddev5569]

Muito massa, e seria perfeito o video de debug para front react

[@andersonsantanna6401]

Mostra fazendo no react e react native, obrigado pelo conteúdo!!

[@annielmenezescruz9042]

Revendo o vídeo descobri uma funcionalidade legal do VS Code que é o auto attach. Ctrl (command no macos)+Shift+P > Debug: Toggle Auto Attach e eu sempre seleciono with flag, isso faz o debug já dar o attach sem precisar do play da aba de debug

[@marcusandre8897]

rapaziada, não se iludam com a velocidade que ele escreve o código, provavelmente ele já escreveu esse mesmo código milhões de vezes ! Programar é muito mais ficar horas olhando pra tela do que digitando. resumindo: não se sinta 'menos' por não programar tão rápido, isso é normal !!! e por ultimo, parabéns pro autor do vídeo, ficou excelente!!!

[@rick7242]

Traz o video de debug em react

[@redspace5410]

bom dos videos da rocket é que tu vai pra aprender uma coisa e aprende 300 kkkkk

[@rocketseat]

hahahahaha valeeeu pelo feedback dev!!! 💜😍

[@gamaquad6765]

Abertura do primo rico.

[@sergio453]

Muito bom camarada!!!

[@andresouza696]

o que é que está fazendo calculo quando vc escreve o codigo no vs code?

[@__und3f1n3d__]

É uma extensão do VScode que calcula uma estimativa de tamanho para o módulo importado. "Import Cost" faz isso, mas não sei se é exatamente essa a extensão que ele está utilizando.

[@bmllvr6]

Mas como seria isso no react?

[@JeffersonSilva-mc2xz]

Tem como fazer esse debug no AdonisJS ?? (Editado) Descobri como faz kkk Chega ate ser bem simples, as configurações no launch.json ficam as mesmas, mas na hora de iniciar o servidor tem que adicionar --debug (adonis server --dev --debug). Muito bom o vídeo.

[@GabrielRodrigues-rh1eg]

Simplesmente sensacional!!!!!!!!! Obrigado

[@rocketseat]

Faaaala, Gabriel! AAAAAAAA! Valeu demais! 💜 😍

[@eusouoviana]

Que tema de terminal é esse?

[@eduwric]

Então é pra isso que serve a baratinha do VS Code... haha... eu sabia que era uma ferramenta de Debug, mas não sabia como configurar. Já configurei em uma aplicação que estou desenvolvendo e já testando. Muito Obrigado.

[@Beto13154]

Sou iniciante, não entendi nada. Mas tudo pareceu fazer sentido

[@rocketseat]

Hahaha 😄

[@jack.rsantana]

Debug no React e React-Native?! NECESSITO!

[@gubmt]

Essa ferramenta funciona para o frontend também?

[@felipeluckemeyer5295]

Pelo que entendi, é possível se fazer em aplicações que utilizam o ReactJS e React Native, ou seja, frontend também!^^

[@brunokiafuka]

Muito massa Diego 🚀

[@francyleomatos7104]

debbuger no Vue?

[@leandroemanuel5883]

Alguém me indica um curso que vai me ensinar isso pfv

[@rocketseat]

Faala, Leandro! Já ouviu falar do nosso bootcamp GoStack? Se inscreve aqui nesse link pra ficar sabendo de todos os detalhes quando houver uma próxima turma! app.rocketseat.com.br/signup

[@AndrewDiass]

Bora codar!

[@ina192]

Show! Obrigado!

[@luisgabrielmxm]

Não é necessario mais fazer o app.use(express.json()); ??? Agora o express entende o JSON por default?

[@brunomello7499]

Fiz meu trabalho de estrutura de dados em 2018.2 debuggando puramente pelo printf no terminal. Lembro que na parte final do trabalho eu fiquei mais de um dia debuggando. Algumas semanas depois aprendi a debuggar um programa em C no vscode e resolvi bugs mais complexos em alguns minutos. Rimos muito, meu computador levou dois tiros.

[@alyssondaniel]

Tô ligado aqui, rumbora!!!

[@marcelosantana8931]

console.log() ❤

[@brunomello7499]

Cara, pode mostrar como configurar o Debugger pro AdonisJS? apanhei pra cacete aqui e não consegui configurar =/

[@LewisSenpai]

Valeu, Diego. Sensacional Da para fazer um mostrando como debugar no React?

[@tentandosertrader4166]

Sou desenvolvedor de aplicações desktop em C#, Delphi, C, C++ e em linguagens Web programo PHP e estou estudando React Native. Mas inventam uma tecnologia pra agilizar a escrita do código, mas praticamente temos que desenvolver outra aplicação de tanta configuração só pra fazer um simples debug do código e ainda assim não consegui fazer funcionar aqui, vou ficar com o bom e velho console.log. Essa é a vantagem em desenvolver aplicações desktop, com apenas um click iniciamos a depuração do código.

[@ryannnkl]

SEMANA OMNISTAAAAAAACK!!!!!!

[@afonsoortiz1]

Fiquei curioso o porquê de você utilizar o nodemon ao invés do live-server ou Browser sync

[@NicholasEduardo]

nodemon é para api (roda em projetos backends) e live-server serve para rodar o arquivo html (projetos front ends)

[@afonsoortiz1]

@@NicholasEduardo valeu por tirar essa dúvida.

[@brunokotesky5965]

E usando babel ou tsc?

[@projetoslinux]

Muito legal...já usava...mas descobri novas funções...queria tb ver xdebug do react e react-native

[@borjovsky3164]

Tô me matando há MESES tentando fazer isso funcionar, e ainda não consegui... Mas estou trabalhando no projeto de ReactJS mais cagado da história... Tem até coisa escrita em ES5, ES6 e ES7 juntos!!

[@ThiagoDevBR]

Ótimo vídeo, Parabéns!!!! Fiquei também na vontade para também ver como funcionaria o Debug utilizando o React Native e React!!!!

[@jonathanjesus5266]

Foda, ajudou d+++

[@hidemitsugoncalveshashimot6177]

Otimo video. Quero muito um video de debug para React e React Native. Hoje eu uso console.log em tudo hahaha, ficam 30 linhas de console haha.

[@thassinhu]

Diego, quais as extensions que vc usa no VSCode pra trabalhar em node js?

[@Luis-vi6fd]

Faz com react

[@jorgesousa9229]

muito top faz outro com recat js e native vlw ó "SOBERANO DEV"

[@tavareshenrique]

Eu dei uma evoluída, Diego. Não uso mais console.log(), uso consle.tron.log() sakskaskaskaska

[@aprendaprogramacaogratis]

No C# usando visual studio, nos conseguimos usar o debugger e ir passando linha a linha, mas conseguimos voltar em linhas que já passamos também

[@paulojosedesouzamello9891]

Diego, Me tira uma duvida, queria fazer um middware de erro para pegar erros de execução, rotas e gravar isso em um.log teria um video explicativo para isso?

[@carlosjunior5371]

Muito bacana essa possibilidade usando node. Recurso bem corriqueiro para nós, desenvolvedores em back com Java(Eclipse) e .NET.(VS Full). Parabéns

[@principe.borodin]

Eu uso o DEBUG:* yarn dev, assim ele me mostra tudo da aplicacao...mostra tambem com o webstorm as formas de debug.

[@wayderloyola1373]

Muito bom o vídeo, gostaria de ver como configurar o Debug do VS para o react e react-native... Abraço !!!

[@arthurgrigoletto]

Diego e comunidade, é possível usar essa estratégia para debugar uma aplicação rodando dentro do docker?