Cara Mengaktifkan Aplikasi Chrome DevTools untuk Debugging Jarak Jauh
Aplikasi Chrome DevTools dibuat oleh Kenneth Auchenberg dalam upaya untuk mengeluarkan devtool dari browser - dalam hal ini keluar dari browser Chrome. Aplikasi ini dibangun berdasarkan NW.js dan dapat berjalan di Mac OS X serta di Linux dan Windows.
Ada banyak alasan yang mendorong pembuat untuk membuat ini tetapi visinya terdiri dari memberikan kenyamanan pengembang debugging jarak jauh di beberapa browser, semua dari platform terpadu yang sama (aplikasi). Idenya akan membutuhkan waktu untuk dipahami dan diwujudkan karena berbagai alasan (dan penolakan, yang dapat Anda baca di blog-nya).
Kami akan melihat Aplikasi Chrome DevTools dan melihat apa yang ditawarkan Google kepada pengembang.
Lebih lanjut tentang Hongkiat:
- Memulai dengan Alat Pengembang Chrome
- 5 (Lainnya) Tips DevTools Chrome yang Bermanfaat untuk Pengembang
- Cara menyesuaikan tema Google Chrome DevTools
Instalasi
Unduh Chrome-Devtools.app.zip dan ekstrak. Klik dua kali untuk menjalankan. Mulai Browser Chrome Anda dan aktifkan debugging jarak jauh.
Untuk melakukan ini pada Mac, buka terminal dan jalankan perintah di bawah ini:
sudo / Aplikasi / Google \ Chrome.app/Contents/MacOS/Google \ Chrome -remote-debugging-port = 9222
Jika Anda menjalankan windows, buka Command Prompt dan gunakan perintah ini:
mulai chrome.exe -remote-debugging-port = 9222
Bagaimana cara menggunakan
Saat Chrome Anda sudah terbuka, dengan fitur debugging jarak jauh diaktifkan, kini Anda dapat menjelajah ke situs mana pun. Misalnya kami membuka Hongkiat.com untuk latihan ini. Selanjutnya, kita menuju ke jendela aplikasi Chrome DevTools, dan segarkan daftar ini (tombolnya ada di sisi kanan bawah).
Sekarang Anda akan melihat tautan Hongkiat.com terdaftar (seperti yang ditunjukkan di bawah ini).
Sekarang klik tombol 'Go'. Anda akan dibawa ke jendela baru. Itu dia. Anda sudah menjalankan dan menjalankan aplikasi Chrome DevTools. Apa yang akan Anda lihat di sini sama dengan ketika Anda "memeriksa elemen" pada browser Chrome.
Dan dari sini Anda dapat menggunakan aplikasi Chrome DevTools seperti halnya menggunakan DevTools di Chrome secara native: Anda dapat memeriksa elemen DOM, men-debug JavaScript, bekerja dengan Konsol, dan lainnya.
Apa berikutnya?
Aplikasi ini masih sangat eksperimental. Tetapi untuk saat ini, gagasan mengeluarkan DevTool dari Chrome memungkinkan pengembang untuk memperlakukan aplikasi sebagai editor fungsional, dan bekerja dengan runtime lain seperti node.js dan iOS. Untuk kemungkinan lebih lanjut, Anda dapat memeriksa jalur pemikiran Auchenberg di sini.