Daftar dan Belajar Sekarang!

10 Packages atom yang berguna untuk membantu penulisan kode

foto Havok
40 Kontribusi 65 Coto
2 tahun yang lalu
https://skspace.sgp1.digitaloceanspaces.com/forums/images/10-atom-packages.jpg Tanpa basa-basi lansung aja simak gan! Oh iya gan, saya ga tau ini termasuk tutorial ato ngga :x, komen dibawah gan 1. Emmet [https://atom.io/packages/emmet] https://skspace.sgp1.digitaloceanspaces.com/forums/images/emmet_pic.jpg Apa itu emmet? emmet adalah plugin/package yang berfungsi mempercepat penulisan kode agan. Emmet ini juga ada untuk sublime text, notepad++, brackets, dll. Agan bisa lihat contoh penggunaannya di [http://emmet.io]. Untuk melihat sintak-sintaksnya bisa dilihat di [http://docs.emmet.io]. 2. Color Picker [https://atom.io/packages/color-picker]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/cpick_pic_1467269716_514.jpg Nah, yang ini berguna banget buat penulisan kode CSS gan! Dengan memakai plugin/packages ini, agan bisa langsung memakai color pickernya di atom-nya sendiri! Penggunaannya cukup mudah, hanya dengan shorcut "CTRL+ALT+C" untuk windows atau "CMD+SHIFT+C" untuk mac. Untuk color pickernya sendiri, bisa memakai warna RGB(a), hex, hsl, hsv, dan vec. 3. CSS Comb [https://atom.io/packages/css-comb]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/comb_pic.jpg Yang ini untuk membuat kode css menjadi rapih gan. Misalnya, kode css agan ga ada ";" semua, kan ribet tuh kalo harus ketik satu2. Dengan memakai CSS Comb ini, agan tinggal menggunakan shorcut "CTRL+ALT+C" untuk windows atau "CMD+ALT+C untuk mac. 4. Linter [https://atom.io/packages/linter]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/linter_pic.jpg Linter ini berfungsi untuk mengkoreksi dan memberi tips untuk kode kita gan. Linter yang disini hanya berfungsi sebagai API gan. Agan harus donlod ini supaya linter yang lain berfungsi. Linter juga ada untuk html, css, javascript, dll. Untuk list fullnya bisa dilihat di [http://atomlinter.github.io]. 5. Beautify [https://atom.io/packages/atom-beautify]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/beautify_pic.jpg Beautify berfungsi untuk mempercantik/merapihkan kode agan supaya mudah dibaca. Setelah menginstallnya, agan bisa klik kanan dan pilih "Beautify editor contents" untuk menjalankannya. 6. Minimap [https://atom.io/packages/minimap]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/minimap_pic.jpg Kode agan banyak? panjang? dengan plugin ini, agan ga usah susah2 scroll kebawah untuk mencari kode agan. Setelah menginstallnya, agan bisa mengganti letak minimapnya gan, mau di kiri atau di kanan terserah agan. 7. Todo Show [https://atom.io/packages/todo-show]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/todo_pic.jpg Lupa mo ngapain? pake plugin ini gan, Dengan plugin ini agan bisa menampilkan todo list di samping layar agan. Cara penggunaanya hanya dengan shorcut "ALT+SHIFT+T" untuk windows/linux atau "CMD+SHIFT+T" untuk mac. 8. Pigments [https://atom.io/packages/pigments]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/pigments_pic.jpg Pigments berfungsi untuk mengganti background kode warna. Contohnya "#FFFFFF" backgroundnya akan berganti sesuai kode warnanya sendiri. 9. Javascript Snippets [https://atom.io/packages/javascript-snippets]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/jss_pic.jpg Kalo ini bisa dibilang "emmetnya" javascript :x. 10. File Icons [https://atom.io/packages/file-icons]. https://skspace.sgp1.digitaloceanspaces.com/forums/images/ficons_pic.jpg File icons berfungsi untuk menambahkan icon sesuai dengan ekstensinya. Berguna banget untuk yang punya file banyak. Cara installnya bisa lewat atomnya sendiri atau dari command line. Akhirnya, selesai juga gan. Kalo ad pertanyaan komen di bawah :x Note: Kalo rame, saya buat untuk notepad++

Jawaban
foto Havok
40 Kontribusi 65 Coto
2 tahun yang lalu
yooot :x

foto SaidAlbaqi
37 Kontribusi 16 Coto
2 tahun yang lalu
@Havok [ask] : gan klo dibandingin ya! Atom Text editor sama Brackets text editor tu ringan yang mana ?

foto Havok
40 Kontribusi 65 Coto
2 tahun yang lalu
Wah kalo itu saya ga tau, ga pernah pake brackets soalnya..

foto mashudi
4 Kontribusi 8 Coto
2 tahun yang lalu
@SaidAlbaqi kalau brackets sama atom sama2 ringan, kalau spek komputernya kuat, tapi lebih enak atom dia bisa untuk teks editor bahasa apapun ga cuma di bidang web saja, beda dengan brackets yg dibuat dg tujuan khusus untuk mendevelop web, lebih khusus lg brackets untuk front end developer (walaupun sekarang sudah ada plugin yg mendukung bahasa php, mysql, dan python di paket manager brackets)

foto SaidAlbaqi
37 Kontribusi 16 Coto
2 tahun yang lalu
@mashudi makasih gan.. :) nice info

foto stivnz
316 Kontribusi 97 Coto
2 tahun yang lalu
Thanks Kang Havok... Btw cara pake todoshow kan alt+shift+t kalo di windows ... nah cara memasang file file todoshow nya itu gmna ?

foto SaidAlbaqi
37 Kontribusi 16 Coto
2 tahun yang lalu
@galactica27 cari di google gan .. :D

foto Havok
40 Kontribusi 65 Coto
2 tahun yang lalu
Memasang file kek gmn gan mksudnya?


Login untuk diksusi di forum sekolah koding