Lebih terarah belajar coding melalui Kelas Online dan Interactive Coding Lihat Materi Belajar

Mengenal Fitur-fitur Chrome DevTool

Ditulis oleh aduar jendi, dipublikasi pada 30 Jul 2019 dalam kategori Tips & Trik
Mengenal Fitur-fitur Chrome DevTool - CodePolitan.com

Chrome DevTools adalah tools untuk melakukan proses debug pada suatu web yang menjadi keistimewaan dari browser Google Chrome. Tools ini sangat berguna jika anda adalah seorang developer web. Berikut beberapa fitur DevTool yang bisa dimanfaatkan untuk membantu proses pengembangan web:

Device Mode

Device Mode

Klik kanan pilih inspect lalu toggle device toolbar atau bisa menekan F12, Ctrl + Shift + M langsung bisa menggunakan fitur device mode sebagai menguji apakah website yang anda kembangkan tampilannya responsif dan berjalan dengan baik di platform mobile.

Elements

Animated GIF

Klik kanan pilih inspect lalu pilih tool Elements atau bisa tekan F12, Berguna untuk memeriksa dan bisa mengedit langsung kode HTML dan CSS (namun akan hilang saat i refresh)

Console

Animated GIF

Klik kanan pilih inspect lalu pilih tool Console. Fitur ini memungkinkan developer untuk menjalankan perintah-perintah JavaScript atau melihat pesan-pesan yang dihasilkan oleh kode JavaScript di laman yang sedang aktif.

Source

Source

Klik kanan pilih inspect lalu pilih tool Source. Fitur ini akan menampilkan isi file atau kode sumber dari laman yang sedang aktif.

Network

Network

Klik kanan pilih inspect lalu pilih tool Network, Fitur ini anda menampilkan rincian size, status, type, intiator, size, time, waterfall halaman web file yang telah di tampilkan

  • size = ukuran file yang mengoperasi tampilan website tersebut
  • status = status yang di terima HTTP
  • type = jenis format file
  • time = tempo waktu yang di ambil

Security

Security

Klik kanan pilih inspect lalu pilih tool Security. Fitur ini akan menampilkan informasi keamanan pada web yang sedang aktif, apakah sertifikat HTTPS nya aktif atau tidak, dsb.

Sekian dari artikel saya semoga bermanfaat.


background

Gabung CodePolitan Membership

Ingin belajar coding secara online dengan lebih terarah? Gabung sekarang dalam program Premium Membership di CodePolitan. Dapatkan ratusan modul belajar pemrograman premium dalam beragam format dengan materi silabus lengkap dan tersusun rapi dari awal hingga mahir.

LIHAT MATERI BELAJAR GABUNG MEMBERSHIP