Aproveitando o frisson do lançamento de nova versão (ver o post anterior), a equipe do Angular lançou também uma ferramenta chamada Angular Dev Tools - uma extensão para o Chrome que permite maiores informações de debug e performance de uma aplicação Angular rodando no browser. Mais um passo dado pela equipe de desenvolvimento do framework para melhorá-lo para a comunidade, conforme pesquisa realizada que apontou que uma ferramenta de debug e melhores mensagens de erro eram os maiores desejos dos desenvolvedores - veja o post oficial falando sobre isso aqui: https://blog.angular.io/introducing-angular-devtools-2d59ff4cf62f.
Para instalar a ferramenta, entre na Chrome Web Store e procure a extensão pelo seu nome (aqui o link direto). Clique em "Add to Chrome" para instalá-la.
Após a instalação, abra sua aplicação Angular no Chrome e entre na opção "Inspecionar" (Chrome Dev Tools, acessível também pela tecla de atalho <F12>). No mesmo lugar que você costuma acompanhar as mensagens de erro da Console e também a atividade de rede (Network), agora você tem uma aba Angular, que permite visualizar os componentes Angular da tua aplicação.
Esta nova ferramenta é compatível com as versões do Angular 9 e superiores, que possuam o Ivy habilitado (o Ivy é o compilador / renderizador mais moderno do Angular, que a partir da versão 9 já vem habilitado por default). Ainda está muito cedo para saber o impacto do lançamento desta ferramenta. Veremos se ela vai facilitar a vida de nós desenvolvedores de aplicações Angular ou não. Vou procurar utilizá-la e quando conhecê-la mais a fundo faço outro post com mais conteúdo.
Um abraço e até o próximo post!
Comentários
Postar um comentário