Cara Men-debug Halaman Web di Chrome untuk Android di Komputer:
Sebagai administrator blog, saya men-debug situs web pribadi saya menggunakan Chrome untuk melihat bagaimana perubahan tema dan CSS akan terlihat sebelum menerapkannya secara permanen di server. Saya belum lama ini ketika saya tidak pernah membayar
perhatian ke halaman seluler
karena hanya sedikit pengunjung yang mengunjungi situs saya menggunakan smartphone.
Namun saat ini, persentase pengunjung yang signifikan terdiri dari ponsel cerdas dan tablet, dan karenanya penting untuk menjaga tampilan dan presentasi di sana juga. Jika itu merupakan halaman di komputer, seseorang dapat dengan mudah melakukan debug menggunakan opsi dari menu konteks klik kanan Chrome, tetapi itu bukan opsi dengan halaman di seluler.
Jadi, hari ini saya akan menunjukkan kepada Anda bagaimana Anda dapat men-debug halaman web seluler di komputer Anda menggunakan Chrome untuk Android dan Android SDK.
Men-debug Halaman Web
Langkah 1: Unduh dan instal Android SDK di komputer Anda dan jalankan. Pemasang akan meminta Anda untuk mengdowload Java jika Anda belum memasangnya.
Untuk pertama kali Anda menjalankan Android SDK di komputer, Anda akan diminta mengdowload beberapa API dan alat. Jika satu-satunya tujuan Anda menginstal Android SDK adalah untuk men-debug halaman, hapus centang semuanya kecuali alat Platform Android SDK dan klik tombol Instal Paket .
Langkah 2: Setelah menginstal alat platform Android, buka Run Box (Windows+R) dan jalankan %userprofile%AppDataLocalAndroidandroid-sdkplatform-tools untuk membuka direktori alat platform Android.
Langkah 3: Sekarang tahan tombol Ctrl+Shift dan klik kanan di folder untuk membuka command prompt di sana.
Anda juga dapat membuka Command prompt menggunakan kotak Run dan menavigasi ke folder secara manual.
Langkah 4: Setelah melakukan itu, buka Chrome di ponsel Android Anda, buka Pengaturan—> Alat pengembang dan centang opsi Aktifkan USB Web debugging.
Langkah 5: Sekarang pada command prompt jalankan perintah adb forward tcp:9222 localabstract:chrome_devtools_remote dan buka browser Chrome di Windows pada eksekusi yang berhasil. Langkah 6: Buka halaman yang ingin Anda debug di browser Chrome Android Anda dan buka URL localhost:9222 di browser Chrome komputer Anda.
Itu saja, Anda akan melihat semua halaman yang terbuka di browser Android Anda sebagai thumbnail di komputer Anda. Untuk membuka halaman debug, cukup klik pada thumbnail situs web masing-masing.
Anda akan dapat melacak perubahan debug yang Anda buat di komputer langsung di Android secara real-time.
Kesimpulan
Saya yakin trik ini akan membantu banyak pengembang web untuk mengoptimalkan halaman web mereka untuk smartphone. Saya telah menggunakan trik untuk mengonfigurasi halaman web saya dan berhasil dengan sangat baik.
Namun, jika Anda mengetahui cara yang lebih baik untuk men-debug halaman web ponsel cerdas di komputer, bagikan dengan kami.