Buat Profil Pengembangan Web Ultimate Firefox

Buat Profil Pengembangan Web Ultimate Firefox
Buat Profil Pengembangan Web Ultimate Firefox

Video: Buat Profil Pengembangan Web Ultimate Firefox

Video: Buat Profil Pengembangan Web Ultimate Firefox
Video: Manymoon Gmail Gadget - YouTube 2024, Mungkin
Anonim

Ketika dikonfigurasi dengan benar, Firefox dapat menjadi alat pengembangan web utama, memberikan Anda akses langsung ke halaman yang sedang Anda kerjakan sehingga Anda dapat mengatur style halaman Anda secara real-time, men-debug javascript atau bahkan mengedit html.

Buat Profil Terpisah untuk Pengembangan Web

Menginstal semua alat pengembangan ini akan membuat Firefox menjadi peramban yang sangat berat, jadi pertama-tama kita harus membuat profil baru untuk Firefox.

Anda dapat meluncurkan profil terpisah pada saat yang sama dengan profil biasa Anda dengan membuat pintasan baru dengan argumen ini, menggantikan WebDev dengan nama profil Anda. Ada juga penjelasan lebih rinci tentang cara melakukan ini.

firefox.exe -P WebDev -no-remote

Kini setelah Anda mengonfigurasi Firefox dengan profil terpisah hanya untuk pengembangan web, mari kita lihat ekstensi yang dapat kita gunakan untuk menjadikan Firefox menjadi alat pengembangan web utama.

Perlu Ekstensi Web Dev

Ini semua adalah ekstensi yang saya gunakan secara teratur untuk pengembangan web.

Pembakar

Firebug adalah ekstensi paling kuat untuk debug javascript, melihat CSS dan html. Anda dapat membuat perubahan dinamis pada kode dan CSS, dan menggunakannya untuk mendebug kode Ajax Anda. Ini benar-benar ekstensi terbaik di luar sana.

Image
Image

Ekstensi Pengembang Web

Salah satu ekstensi terbaik untuk x tahun berjalan. Ini harus dimiliki oleh pengembang apa pun, tetapi Anda sudah mendengarnya.

Image
Image

Ekstensi Aardvark

Ekstensi ini adalah ekstensi yang sangat ringan yang akan dengan mudah menunjukkan elemen pada halaman dan kelas / id yang ditentukan. Ini lebih mudah digunakan daripada ekstensi pengembang web untuk saat-saat ketika Anda hanya membutuhkan info cepat untuk sebuah elemen. Anda juga dapat menggunakannya untuk menghapus elemen dari halaman.

Image
Image

Colorzilla

Pilih warna dengan mudah. Tidak ada lagi rasa sakit untuk menemukan warna yang disematkan di suatu tempat di stylesheet.

Image
Image

Lihat Sumber dengan

Anda dapat mengatur beberapa profil sumber tampilan untuk membuka sumber dalam berbagai aplikasi.

Image
Image

Validator HTML

Ekstensi ini memungkinkan Anda memvalidasi dengan mudah HTML laman Anda dan memasangnya di panel Lihat Sumber.

Image
Image

Greasemonkey

Ini bukan ekstensi pengembang web, tetapi Greasemonkey luar biasa, paling tidak untuk kemampuan mengotomatiskan tindakan yang biasa dilakukan, yang sangat menghemat waktu bagi pengembang web.

Image
Image

Ukur itu

Ukur jarak dengan mudah di layar dengan ekstensi ini. Setelah mengukur satu area, Anda dapat menyeret segi empat di sekitar layar untuk digunakan sebagai perbandingan.

Image
Image

Tampilan IE / IE Tab / OperaView / FirefoxView / Tampilan Safari / IE View Lite

Ekstensi ini (pilihlah) memungkinkan Anda dengan mudah melihat halaman saat ini di browser yang berbeda. IE Tab bahkan akan membiarkan Anda menjalankan IE di dalam tab, jika Anda begitu ingin.

Image
Image

Hapus Tombol Cache

Menghapus cache. Sangat berguna untuk memeriksa perubahan CSS baru.

Image
Image

Mulai ulang Firefox

Ekstensi Restart Firefox sangat berguna untuk menutup dan memulai ulang Firefox dengan semua tab dan sesi utuh.

Image
Image

Tab Mix Plus

Ekstensi Tab Mix Plus adalah ekstensi yang bagus secara umum, tetapi memiliki beberapa fitur yang pada dasarnya bermanfaat untuk pengembang web: Tab Duplikat dan URL Tab Salin.

Image
Image

YSlow

Ekstensi YSlow adalah ekstensi baru dari Yahoo yang akan menganalisis halaman Anda dan memberi tahu Anda di mana Anda membuat kesalahan. Ini bahkan akan memberi Anda nilai pada kinerja situs Anda. Anda akan melihat pengukur kecil di sudut kanan bawah … itu memberitahu Anda ukuran total halaman Anda serta waktu buka. Ekstensi yang sangat berguna, tetapi ini membutuhkan ekstensi Firebug.

Image
Image

Dummy Lorem Ipsum

Generator ekstensi Dummy Lipsum akan menghasilkan konten dummy untuk Anda berdasarkan teks Lorem Ipsum yang terkenal yang sangat berguna untuk meletakkan konten palsu di situs Anda.

Image
Image

Screengrab!

Ekstensi Screengrab akan memungkinkan Anda mengambil tangkapan layar laman, tetapi dapat melakukan sesuatu yang tidak dapat dilakukan oleh alat screenshot biasa - ini dapat mengambil gambar dari seluruh laman, bukan hanya bagian yang dapat dilihat.

Ada banyak ekstensi lain yang dapat Anda gunakan, tetapi ini adalah yang terbaik dari yang terbaik dari semua yang saya lihat. Jika Anda memiliki ekstensi lain yang Anda gunakan secara teratur, tinggalkan sebutan di komentar.
Ada banyak ekstensi lain yang dapat Anda gunakan, tetapi ini adalah yang terbaik dari yang terbaik dari semua yang saya lihat. Jika Anda memiliki ekstensi lain yang Anda gunakan secara teratur, tinggalkan sebutan di komentar.

Pada titik ini, Anda sekarang mengubah Firefox menjadi alat pengembangan web utama. Luangkan waktu untuk mempelajari cara menggunakan Firebug khususnya.

Direkomendasikan: