Como ativar o aplicativo DevTools do Chrome para depuração remota
O aplicativo Chrome DevTools é criado por Kenneth Auchenberg em uma tentativa de retirar os devtools do navegador - neste caso, do navegador Chrome. Este aplicativo é construído com base no NW.js e pode ser executado no Mac OS X, bem como no Linux e Windows.
Há muitas razões que levaram o criador a criar isso, mas sua visão consiste em dar aos desenvolvedores a conveniência de depuração remota em vários navegadores, todos da mesma plataforma unificada (aplicativo). A ideia levará algum tempo para se materializar e se materializar devido a uma variedade de razões (e resistência, que você pode ler no blog dele).
Vamos dar uma breve olhada no aplicativo Chrome DevTools e ver o que o Google tem para oferecer aos desenvolvedores.
Mais sobre Hongkiat:
- Primeiros passos com as ferramentas do desenvolvedor do Google Chrome
- 5 (mais) dicas úteis do Chrome DevTools para desenvolvedores
- Como personalizar o tema do Google Chrome DevTools
Instalação
Faça o download do Chrome-Devtools.app.zip e extraia-o. Clique duas vezes para executar. Inicie o seu navegador Chrome e ative a depuração remota.
Para fazer isso no Mac, abra o terminal e execute o comando abaixo:
sudo / Aplicativos / Google \ Chrome.app/Contents/MacOS/Google \ Chrome -remote-debugging-port = 9222
Se você executar o Windows, abra o Prompt de Comando e use este comando:
Iniciar chrome.exe -remote-debugging-port = 9222
Como usar
Quando seu Chrome já está aberto, com o recurso de depuração remota ativado, você pode navegar para qualquer site. Por exemplo, abrimos o Hongkiat.com para este exercício. Em seguida, vamos até a janela do aplicativo Chrome DevTools e atualize esta lista (o botão está no lado inferior direito).
Agora você verá o link de Hongkiat.com listado (como mostrado abaixo).
Agora clique no botão "Ir". Você será levado para uma nova janela. É isso aí. Você já tem o aplicativo Chrome DevTools instalado e funcionando. O que você verá aqui é o mesmo de quando você "inspeciona o elemento" no navegador Chrome.
E a partir daqui, você pode usar o aplicativo Chrome DevTools como usar o DevTools no Google Chrome nativamente: inspecionar o elemento DOM, depurar JavaScript, trabalhar com o console e muito mais.
Qual é o próximo?
Este aplicativo ainda é muito experimental. Mas, por enquanto, a ideia de retirar o DevTool do Chrome permite que os desenvolvedores tratem o aplicativo como um editor funcional e trabalhem com outros tempos de execução, como node.js e iOS. Para mais possibilidades, você pode conferir o trem de pensamento de Auchenberg aqui.
