O Chrome DevTools é uma ferramenta embutida no navegador Chrome e que pode ser acessada através da tecla F12 ou com a combinação de teclas Ctrl+Shift+I. Ela oferece uma série de recursos para quem está desenvolvendo ou fazendo a manutenção/otimização de um site.
Clique com o botão direito do mouse e clique em Inspecionar Elemento, ou pressione Command + Option + i no seu Mac ou F12 no seu PC. No campo de pesquisa, você pode digitar – QUALQUER COISA – que quiser encontrar nessa página e ela aparecerá nesse painel.
Aprenda Usar Chrome DevTools em 10 Minutos | Tutorial Desenvolvimento Web
Para que serve o modo debug?
Debug, ou depuração, é a tarefa de encontrar e eliminar erros de um código para torná-lo melhor, mais ágil e mais seguro. O nome vem de “bug”, utilizado para se referir a algum erro no desenvolvimento (e também a “inseto”, em inglês).
Debug é uma prática essencial na programação, pois permite identificar, corrigir e prevenir bugs em códigos das mais diferentes naturezas. Ela envolve várias técnicas e ferramentas, e, como desenvolvedor, você precisa tê-las em seu repertório para garantir a qualidade dos seus softwares.
Para “Salvar como” um documento no Word, clique em F12. A tecla tem ainda mais duas funções. Ao apertar F12 + Shift dá para salvar direto um documento e ao pressionar F12 + Ctrl, abrir um arquivo. Ao segurar Ctrl + Shift + F12 é possível ativar a função impressão do Word.
Para abrir a função "Salvar como" no Word, clique em F12. Você também pode salvar diretamente o documento apertando F12 + Shift, ou abrir um documento com F12 + Ctrl. Juntando as três teclas de uma vez, Ctrl + Shift + F12, abrirá a função imprimir.
Se a ferramenta já estiver vísivel, clique na aba Debugger. Chrome: Abra as ferramentas de desenvolvimento e selecione a aba Fontes(Sources). (Opera funciona igualmente). Edge e Internet Explorer 11: Aperte F12 então, Ctrl + 3 , ou se a ferramenta já estiver visível, clique na aba Debugger(depurador).
Hoje iremos falar do debug do Google Chrome, abaixo iremos ver o passo a passo para usá-lo e desfrutar da sua maravilhosa ferramenta. Para acessar as ferramentas de desenvolvimento dos browsers basta apertar a tecla F12 (Pode variar de acordo com o browser e sua versão).
Você já abriu alguma página em um site que não carrega uma imagem ou algum outro elemento? Então, se você apertar apenas o F5 ele vai recarregar a página, porém, mantendo os elementos já salvos na memória cache. É o famoso “refresh” da página. Provavelmente você já fez isso várias vezes.
Coloque o "Modo Tecla de Atalho" ou "Teclas de Ação" no Desativado. O nome desse recurso varia de fabricante para fabricante. Quando este recurso está desativado, você não terá que apertar a tecla FN para usar as teclas F1 – F12. Apertar a tecla FN junto com uma das teclas de F1 a F12 vai ativar a ação.
O F10 permite marcar elementos da janela ativa e passar a uma outra janela. Junto ao Shift, essa tecla abre aquele mesmo menu que costuma aparecer quando clicamos com o botão direito do mouse na área de trabalho, em cima de um arquivo ou pasta. O mesmo acontece se usa Mac, mas nesse caso, é preciso apertar F10 + Fn.
Também chamado de debugging ou, em português, depuração, é o nome dado ao processo de encontrar e remover os erros que podem acometer softwares e hardwares.