Conheça os segredos do Chrome DevTools

Nos últimos anos, as tecnologias client-side como HTML↳HTML45 conteúdosA importância do HTML e CSS para quem trabalha com UI Design e Design SystemProduto & UX · dez 2024Como hostear seu site HTML gratuitamente com GitHub PagesDev (Back & Front) · jun 2025SQL Server – Como criar um versionamento de código das suas Stored Procedures em HTML e com comentários da alteraçãoData · nov 2020Ver tudo em Dev (Back & Front) →, CSS e JavaScript evoluíram de uma maneira absurda. Uma avalanche de APIs vieram com o HTML5, dezenas de novas propriedades foram adicionadas ao CSS3, e uma série de novidades chegaram ao JavaScript a partir das novas especificações do ECMAScript.

Consequentemente, muita coisa no workflow de desenvolvimento web também mudou. Debugar códigos JS usando alert? Ir e voltar no navegador para ver como ficaram as mudanças de CSS? Redimensionar a página para simular responsive design? Esse tempo já passou.

A chegada do famigerado Firebug há alguns anos abriu portas para um novo conjunto de ferramentas como Chrome DevTools, Opera Dragonfly e Firefox DevTools que auxiliam e muito a vida dos desenvolvedores web.

Nesta série oficial da Google, gravada em português e produzida por brasileiros, você vai ver em 10 vídeos como tirar proveito do Chrome DevTools para manipular elementos no DOM, identificar memory leaks, debugar código JavaScript, emular dispositivos móveis, otimizar o waterfall de requisições, e muito mais.

Se você se interessa por produtividade e qualidade no desenvolvimento de aplicações web, não deixe de assistir a todos os vídeos!