Comment activer l'application Chrome DevTools pour le débogage à distance
Kenneth Auchenberg a créé l'application Chrome DevTools pour tenter de supprimer devtools du navigateur, en l'occurrence du navigateur Chrome. Cette application est basée sur NW.js et peut fonctionner sur Mac OS X ainsi que sur Linux et Windows..
Cela a incité le fabricant à créer cela, mais sa vision consiste à donner aux développeurs la commodité de débogage à distance sur plusieurs navigateurs, tous à partir de la même plate-forme unifiée (app). Il faudra un certain temps pour que l’idée se concrétise et se concrétise pour diverses raisons (et la résistance que vous pouvez lire sur son blog).
Nous examinerons brièvement l'application Chrome DevTools et verrons ce que Google a à offrir aux développeurs..
Plus sur Hongkiat:
- Mise en route des outils de développement Chrome
- 5 conseils utiles (plus) sur Chrome DevTools pour les développeurs
- Comment personnaliser le thème Google Chrome DevTools
Installation
Téléchargez le fichier Chrome-Devtools.app.zip et extrayez-le. Double-cliquez pour courir. Démarrez votre navigateur Chrome et activez le débogage à distance..
Pour ce faire sur le Mac, ouvrez le terminal et exécutez la commande ci-dessous:
sudo / Applications / Google \ Chrome.app/Contents/MacOS/Google \ Chrome -remote-debugging-port = 9222
Si vous exécutez Windows, ouvrez l'invite de commande et utilisez cette commande:
démarrer chrome.exe -remote-debugging-port = 9222
Comment utiliser
Lorsque votre Chrome est déjà ouvert et que la fonctionnalité de débogage à distance est activée, vous pouvez désormais accéder à n’importe quel site. Par exemple, nous avons ouvert Hongkiat.com pour cet exercice. Ensuite, nous nous dirigeons vers la fenêtre de l'application Chrome DevTools, et rafraîchir cette liste (le bouton est en bas à droite).
Maintenant, vous verrez le lien Hongkiat.com répertorié (comme indiqué ci-dessous).
À présent cliquez sur le bouton 'Go'. Vous serez redirigé vers une nouvelle fenêtre. C'est tout. L'application Chrome DevTools est déjà opérationnelle. Ce que vous verrez ici est le même que lorsque vous "inspectez un élément" sur le navigateur Chrome..
Et à partir de là, vous pouvez utiliser l'application Chrome DevTools exactement comme si vous utilisiez DevTools sur Chrome de manière native: vous pouvez inspecter l'élément DOM, déboguer JavaScript, travailler avec la console, etc..
Et après?
Cette application est encore très expérimentale. Mais pour l’instant, l’idée de retirer Chrome de DevTool dans Chrome permet aux développeurs de traiter l’application comme un éditeur fonctionnel et de travailler avec d’autres environnements d’exécution tels que node.js et iOS. Pour plus de possibilités, vous pouvez consulter le fil de pensée de Auchenberg ici.
