5 Plug-in Sublime-Text untuk Frontend Developer

Setiap pengembang tahu bahwa otomatisasi alur kerja sangat penting untuk pengembangan web. Untungnya ada banyak program yang dibangun untuk mendukung otomatisasi.

Dalam artikel ini saya akan mengulas tentang beberapa plug-in yang telah diciptakan untuk Sublime Text-2, yang merupakan salah satu teks-editor yang paling populer. Yang perlu dicatat, bahwa plug-in ini berjalan pada Sublime 2 harus menginstal sempurna di Sublime 3+. Jadi tanpa basa-basi lagi, mari kita lihat beberapa plug-in dan bagaimana mereka dapat meningkatkan efisiensi Anda ketika pemrograman.

Package Control

package control

Package Control ini penting untuk siapa saja bagi yang menggunakan Sublime Text 2 maupun Subliime Text 3. Hal ini memungkinkan Anda untuk dengan mudah mencari dan menginstal paket untuk Sublime Text.

Tanpa plug-in ini Anda harus men-download dan menginstal plug-in secara manual, akan tetapi Package Control dapat menyimpan dengan menyediakan cara yang lebih mudah untuk instalasi.

Tutorial lainya   Membuat Website Responsive Tanpa Coding

Emmet

Emmet adalah Alat yang sangat membantu bagi pengembang frontend. Hal ini memungkinkan Anda untuk mempercepat menghasilkan potongan kode.

Sebagai contoh, kodeul> li * 4> a akan menghasilkan daftar unordered yang mengandung 4 item yang terkandung di dalamnya. Pada element Emmet juga menyediakan kemampuan untuk bergerak di sekitar kode dengan mulus dan menggunakan cara pintas pada keyboard (shortcuts).

All Autocomplete

Berikutnya adalah All Autocomplete plug-in. Pada Sublime Teks akan otomatis terlihat seluruh file individual untuk kata-kata yang sering dipakai atau diulang-ulang. All Autocomplete mengambil satu langkah lebih lanjut dan mempermudah dalam pencarian melalui setiap file proyek Anda sehingga Anda tidak harus menulis kata-kata yang sama berulang-ulang.

HTML5 Boilerplate

Ini bisa menyedihkan jika menulis secara manual semua tag yang diperlukan untuk memulai dengan file index.html, namun mereka merupakan dasar dari semua aplikasi web.

Tutorial lainya   Membuat Animasi Intro pada Section

Dalam upaya untuk mengotomatisasi proses ini, maka terbentuklah plug-in HTML5Boilerplate. Hal ini akan menghasilkan template HTML5 dengan semua tag yang diperlukan untuk pengembangan dan berjalan. Yang harus Anda lakukan adalah membuat file html, jenis htmlboiler,tekan tab & berkas HTML5 Anda akan muncul.

Meskipun tidak diragukan lagi Plug-in ini bisa membantu kinerja Anda dalam koding, dan pastinya akan diperiksa apakah ada plug-in lain yang ditawarkan untuk diinstall, Anda pasti tidak akan kecewa.

HTMLPrettify

Ketika Anda bekerja pada sebuah proyek yang besar, file anda mungkin akan menjadi berantakan dengan kode non-semantik sangat cepat. Tiba pada saatnya, file-file tersebut akan menjadi lebih sulit untuk dirapikan dan ini akan membuat anda lebih sulit untuk menemukan kesalahan.

Tutorial lainya   Membuat Konten untuk Webiste

Dengan bantuan HTMLPrettify, kode Anda akan secara otomatis diformat (atau di-perindah) sehingga Anda dapat menavigasi dengan mudah. Meskipun namanya sebaliknya, HTMLPrettify tidak terbatas pada file HTML. Hal ini dapat digunakan untuk “memperbaiki” file dalam format JavaScript, CSS, dan JSON juga.

Color Picker

Colorpicker adalah plug-in yang dibangun untuk menghasilkan nilai-nilai hex untuk file css Anda. Kejadian yang serng anda alami adalah mencari kode hex yang berbeda akan menjadi agak sulit, sehingga ColorPicker menyediakan Anda dengan roda warna di mana Anda dapat memilih warna.

Setelah Anda memilih warna yang Anda inginkan dengan Colorpicker, secara otomatis akan menghasilkan nilai heksadesimal yang sesuai dan anda bisa langsung menggunakan kode hex tersebut pada CSS anda.

 

Penulis Tutorial

Penulis Tutorial

Kata terindah

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *