Logo Emmet.io |
Dalam text editor, untuk membantu mempercepat pengerjaan dalam membuat kodingan atau lainnya, biasanya terdapat plugin yang bisa digunakan bersama dengan text editor. Kali ini, saya akan menjelaskan salah satu plugin yang menurut saya cukup berguna dan powerfull pastinya dalam membuat kodingan yaitu Emmet.
Jadi, emmet ini merupakan plugin yang populer diberbagai text editor seperti Sublime Text (yang sering saya gunakan), lalu Atom, Netbeans, Notepad++, Eclipse/Antana dan masih banyak Text Editor yang mendukung plugin emmet ini.
Mengapa dengan emmet membantu kita dalam HTML & CSS workflow ?
Karena kita jika melakukan kodingan biasa tanpa plugin emmet, maka harus mengetikkan satu per satu apa yang mau kita buat. Misalkan saja ingin membuat tag "div" dengan class "al" kita harus mengetikkannya satu per satu. Dengan menggunakan emmet di text editor yang kita gunakan, maka hal itu tidak perlu. Tinggal mengetik "div.al" maka hasilnya "<div class="al"></div>".
Contoh Penggunaan Emmet |
Untuk dapat mengguakan emmet ini di text editor kesayangan kalian, terdapat 2 cara yaitu :
- Pertama dari dalam text editor sendiri mengguakan Package Control misalnya kalo Sublime Text
- Dapat di download langsung di https://emmet.io/download/ dan diletakkan di direktori untuk plugin text editor kalian (misal : di folder packages pada sublime text)
Oh iya, karena saya menggunakan Sublime Text maka saya hanya menjelaskan caranya jika di Sublime Text. Sebenernya kurang lebihnya sama untuk text editor yang lain tapi kali ini saya akan mencontohkannya di Sublime Text 3.
Pertama kalian buka sublime text kalian, lalu pilih Tab menu "Tools" dan pilih "Command Pallete".
Pilih Tools lalu Command Pallete |
Kedua, saat sudah keluar box "Command Pallete", kalian ketikkan "Package Control", dan ketik install package
Package Control : Install Package |
Ketiga, kalian ketikkan "Emmet" di box, lalu kalian pilih. Karena saya sudah menginstall "Emmet" maka ditempat saya tidak akan muncul lagi. Kira kira seperti dibawah ini :
Ketik Emmet di Box |
Jika langkah di atas telah kalian lakukan, maka kalian telah menginstall emmet di Sublime Text kalian. Jika berhasil akan muncul teks seperti berikut :
Emmet - Package Control Message |
Itulah langkah - langkah untuk menginstall emmet di text editor kalian. Saya mencontohkannya menggunakan sublime karena ringan dan mantap untuk digunakan menurut saya ^^. Semoga kalian juga berhasil dalam menginstall plugin ini, karena sangat powerfull dan berguna menghemat waktu untuk kodingan. Jika ada pertanyaan silahkan tinggalkan di kolom komentar atau dapat bertanya di email.
Selamat Mencoba ^^
Eich-I-Ar
0 Comments