Best Chrome Extensions for Web Developers’ Productivity

Agung Prayoga
TechnoScape BNCC
Published in
4 min readApr 11, 2021
Photo by John Schnobrich on Unsplash

Bagi seorang Web Developer, Chrome extensions dapat membantu dalam meningkatkan produktivitas suatu pekerjaan. Nah, mungkin beberapa Web Developer telah menyusun Chrome extensions favoritnya untuk meningkatkan efisiensi, menyelesaikan tugas lebih sederhana, dan lebih efektif dalam pembuatan website. Chrome sendiri menyediakan banyak extensions untuk memenuhi kebutuhan Web Developer. Hal tersebut memungkinkan untuk menyelesaikan pekerjaan menjadi lebih cepat. Untuk itu, artikel ini akan membahas beberapa Chrome extension terbaik untuk Web Developer. Berikut ulasannya!

Wappalyzer

https://chrome.google.com/webstore/detail/wappalyzer/gppongmhjkpfnbhagpmjfkannfbllamg?hl=en

Wappalyzer dibuat oleh Elbert Alias pada tahun 2008. Wappalyzer merupakan profiler extension yang dapat membantumu dalam mengidentifikasi perangkat lunak yang dipasang pada website tertentu. Wappalyzer dapat mendeteksi programming language, analytics tool, e-commerce platform, database, plugin, widget, web server, marketing tool, payment process, hingga content delivery network (CDN) dan customer relationship management (CRM) yang digunakan pada website tertentu.

VueJS Devtools

https://docs.vuejs.id/v2/cookbook/debugging-in-vscode.html#Menggunakan-alat-pengembang-Vue

VueJS merupakan salah satu extension favorit dalam pengembangan web berbasis Vue. Aplikasi ini cukup populer di kalangan Web Developer karena berguna untuk menyunting langsung properti data, melihat langsung perubahan secara otomatis, serta melakukan time travel debugging (TTD) untuk Vuex. Vuex sendiri merupakan sistem manajemen dan library untuk aplikasi VueJS

Window Resizer

https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh?hl=en

Window resizer dapat membantumu menentukan ukuran jendela browser yang tepat untuk meniru resolusi layar yang sesuai. Tersedia beberapa fitur yang dapat membantumu meningkatkan produktivitas, seperti fitur custom preset, yaitu menambahkan, mengubah, dan menghapus resolusi layar sesuai dengan kebutuhanmu. Fitur rotate tool memungkinkanmu dalam men-swap lebar dan tinggi viewport dengan cepat untuk menyesuaikan perubahan arah perangkat. Ada juga fitur sync yang secara otomatis akan mensinkronisasi pengaturan di semua perangkat dan dapat mengimpor serta mengekspor pengaturan secara manual.

ColorPick Eyedropper

https://youtu.be/wCC0eK6Mz5w

Colorpick Eyedropper adalah salah satu Chrome extension yang dapat mengidentifikasi nilai warna dari halaman website manapun. Kamu dapat memilih warna melalui webpage, kemudian akan tersimpan di dalam clipboard. Selain itu, kamu dapat memilih warna melalui color picker dan menggabungkan warna sesuai dengan yang kamu butuhkan. Kamu juga dapat memilih warna melalui history, yaitu warna yang sebelumnya sudah kamu simpan sehingga dapat digunakan kembali.

Fonts Ninja

https://www.youtube.com/watch?v=U_np8e0Z0HE

Fonts Ninja adalah salah satu extension favorit bagi Web Developer. Alasannya, extension ini dapat mengidentifikasi font yang kita lihat dari halaman website yang diinginkan. Selain melihat font, extension ini dapat membantumu untuk melihat properti lain, seperti spasi huruf, spasi baris, ukuran, serta kode hex suatu warna.

EditThisCookie

https://www.youtube.com/watch?v=wCp7jBCNa3Q

EditThisCookie merupakan extension untuk mengelola cookie. Extension ini menjadi salah satu extension terbaik dalam manajemen cookie. Tak heran, jika EditThisCookie telah mencapai lebih dari dua juta unduhan di Chrome web store. Manfaat dari extension ini antara lain mengedit, menghapus, menambahkan, membuat, dan mencari cookie. Bahkan, EditThisCookie bisa untuk memblokir atau memfilter cookie. Selain itu, extension ini dapat mengimpor cookie dalam format cookies.txt atau JSON. Terlebih, EditThisCookie merupakan extension dengan open source yang dirilis di bawah lisensi General Public License (GNU) dan dikelola di GitHub.

CSS Viewer

https://www.youtube.com/watch?v=cQayddOwBVs

Salah satu extension terbaik untuk Web Developer adalah CSS Viewer. Extension ini membantumu melihat properti CSS pada halaman web yang diinginkan. Hanya dengan mengeklik tombol, gambar, teks, atau lainnya maka akan muncul kode CSS yang digunakan, seperti background, font, box, color, text, positioning, dan effects traits. Yap, hal ini, tentunya, memudahkan Web Developer sebagai referensi dalam menentukan properti yang tepat serta meningkatkan efisiensi dalam pembuatan website. Sama dengan EditThisCookie, CSS Viewer dirilis di bawah lisensi General Public License (GNU).

Last but not least…

Momentum

Walaupun Momentum berbeda dengan extensions yang disebutkan diatas. Namun, extension ini berguna bagi kamu untuk meningkatkan produktivitas, apalagi jika kamu seorang Web Developer. Kamu dapat mengganti halaman tab baru menjadi dashboard pribadimu sendiri. Fitur-fitur yang ada di extension ini seperti foto dan kutipan inspiratif, tujuan atau fokus harian, to do list, cuaca dan ramalan cuaca, link dan pencarian, dan masih banyak lagi. Tampilan UI yang menarik dan mudah digunakan sehingga digemari oleh banyak kalangan, tak terkecuali Web Developer. Tak heran, Momentum menjadi aplikasi favorit dan telah diunduh lebih dari tiga juta pengguna.

Semoga artikel ini dapat membantumu dalam meningkatkan produktivitas dalam bekerja sebagai Web Developer. Apakah kamu memiliki rekomendasi extension lainnya? Jika ada, boleh sharing di kolom komentar ya!

--

--