Postingan lainnya
10 Packages atom yang berguna untuk membantu penulisan kode
[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/10-atom-packages.jpg[/img]
Tanpa basa-basi lansung aja simak gan! Oh iya gan, saya ga tau ini termasuk tutorial ato ngga :x, komen dibawah gan
1. Emmet [[link]https://atom.io/packages/emmet[/link]]
[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/emmet_pic.jpg[/img] 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 [[link]http://emmet.io[/link]]. Untuk melihat sintak-sintaksnya bisa dilihat di [[link]http://docs.emmet.io[/link]].
2. Color Picker [[link]https://atom.io/packages/color-picker[/link]].
[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/cpick_pic_1467269716_514.jpg[/img] 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 [[link]https://atom.io/packages/css-comb[/link]].
[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/comb_pic.jpg[/img] 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 [[link]https://atom.io/packages/linter[/link]].
[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/linter_pic.jpg[/img] 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 [[link]http://atomlinter.github.io[/link]].
5. Beautify [[link]https://atom.io/packages/atom-beautify[/link]].
[img]https://skspace.sgp1.digitaloceanspaces.com/forums/images/beautify_pic.jpg[/img] 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 [[link]https://atom.io/packages/minimap[/link]].
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].
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].
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].
Kalo ini bisa dibilang "emmetnya" javascript :x.
10. File Icons [ https://atom.io/packages/file-icons].
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++
Tanggapan
guys cara buat view-toggle soft wrap secara otomatis itu gmana ya ?
32 Jawaban:
@Havok [ask] : gan klo dibandingin ya! Atom Text editor sama Brackets text editor tu ringan yang mana ?
Wah kalo itu saya ga tau, ga pernah pake brackets soalnya..
@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)
Thanks Kang Havok... Btw cara pake todoshow kan alt+shift+t kalo di windows ... nah cara memasang file file todoshow nya itu gmna ?
Itu kan TodoShow nya sudah aktif ... cara biar ada file nya itu bagaimana ?
Pake comments gan, contoh:
<h1></h1> <!-- FIXME [Keterangan] -->
Bisa pake FIXME/CHANGED/TODO/XXX/IDEA/HACK/NOTE/REVIEW
saya masih kurang ngerti cara instal packages dan theme di Atom. ada tutor yg lebih jelas g ?
maaf saya mau tanya, saya menggunakan atom terbaru, lalu saya ingin menambah paket pigment sudah saya install tapi koq tidak keluar ya warna di file css saya, apa perlu ada konfigurasi tambahan ? padahal saya coba liha tutorial di internet tinggal install saja sudah bisa, mohon bantuannya
Untuk terminalnya gan apa ? supaya kalau menjalan kan laravel perintah php artisan serve. supaya bisa dijalankan langsung dengan perintah ctrl+ klik kiri ??? soalnya terminal biasa gk bisa...
sebenarnya untuk terminal itu di atom itu opsional, agan bisa pakai terminal bawaannya linux atau command line bawaan windows, kalau misalkan package terminalnya atom di Linux atau Windows nggak bisa ya pakai terminal atau command line bawaannya aja.
kalo bikin atom jadi transparan gimana yah
knpa gak bisa sya install packages atom-beautifynya admin?
makasih suhu, saya sbelumnya menggunakan sublime text 3 mau masang color picker tapi gagal mulu, jadi saya instal atom, masang colorpicker nya pun gampang. tq suhu
mantapp, plugin notepad++ juga dong bang.. rada repot dan berat kalo mau ngubah sedikit koding yg sudah onlen kalo pake atom tengkiu banyakk
josh masih mantap ini kang, walaupun dipake ditahun 2k19
