Mesmo para profissionais, codificar não é fácil. Provavelmente é por isso que os desenvolvedores gastam muito tempo procurando por bugs em seu código. Às vezes, um bug é óbvio, fazendo com que todo o programa falhe de uma só vez. Outras vezes, um bug é muito sutil, produzindo uma saída de boa aparência que sempre contém falhas.
Por mais contra-intuitivo que possa parecer, bugs óbvios são melhores porque são mais fáceis de encontrar. Um bug sorrateiro pode se esconder em softwares comuns por anos.
Pense desta forma: se você estivesse em um prédio que estava se enchendo lentamente de gás venenoso, você gostaria que o gás fosse inodoro , insípido e incolor, ou roxo brilhante e cheirando a pó. canhão?
A depuração é uma etapa crucial no processo de desenvolvimento , existem muitas ferramentas disponíveis para fazer isso. Hoje vamos falar sobre depuração de JavaScript no Chrome. Javascript é de longe uma das linguagens mais populares ‚Äã‚Äão em geral e sem dúvida a linguagem mais popular para desenvolvimento web. Da mesma forma, o Chrome é um dos navegadores da Web mais usados.
Como alguém que em breve será um desenvolvedor da Web em demanda , é uma boa ideia se familiarizar com a depuração de JavaScript com o Chrome. Recomendo que você siga esta página da Web de exemplo elegante > criado especificamente para praticar a depuração.
Usando o painel Origem

O Chrome vem com um conjunto de ferramentas poderosas que permitem aos desenvolvedores inspecionar o código-fonte de um site , incluindo HTML, CSS e Javascript.
Essa é uma ótima maneira de ler o código dos sites que você adora e aprender a depurá-los.
Pegue o tour
A partir de 2019 e da versão mais recente do Chrome, acessar as ferramentas do desenvolvedor é tão fácil quanto ir para View -> developer -> Tools development no menu superior do navegador da tela. Isso abre o Chrome Developers Panel com muitas guias úteis.