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++

avatar Havok
@Havok

40 Kontribusi 67 Poin

Diperbarui 4 tahun yang lalu

Tanggapan

guys cara buat view-toggle soft wrap secara otomatis itu gmana ya ?

32 Jawaban:

yooot :x

avatar Havok
@Havok

40 Kontribusi 67 Poin

Dipost 7 tahun yang lalu

@Havok [ask] : gan klo dibandingin ya! Atom Text editor sama Brackets text editor tu ringan yang mana ?

avatar SaidAlbaqi
@SaidAlbaqi

37 Kontribusi 17 Poin

Dipost 7 tahun yang lalu

Wah kalo itu saya ga tau, ga pernah pake brackets soalnya..

avatar Havok
@Havok

40 Kontribusi 67 Poin

Dipost 7 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)

avatar mashudi
@mashudi

4 Kontribusi 8 Poin

Dipost 7 tahun yang lalu

@mashudi makasih gan.. :) nice info

avatar SaidAlbaqi
@SaidAlbaqi

37 Kontribusi 17 Poin

Dipost 7 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 ?

avatar pemudakoding
@pemudakoding

342 Kontribusi 120 Poin

Dipost 7 tahun yang lalu

@galactica27 cari di google gan .. :D

avatar SaidAlbaqi
@SaidAlbaqi

37 Kontribusi 17 Poin

Dipost 7 tahun yang lalu

Memasang file kek gmn gan mksudnya?

avatar Havok
@Havok

40 Kontribusi 67 Poin

Dipost 7 tahun yang lalu

Itu kan TodoShow nya sudah aktif ... cara biar ada file nya itu bagaimana ?

avatar pemudakoding
@pemudakoding

342 Kontribusi 120 Poin

Dipost 7 tahun yang lalu

Pake comments gan, contoh:

 <h1></h1> <!-- FIXME [Keterangan] -->

Bisa pake FIXME/CHANGED/TODO/XXX/IDEA/HACK/NOTE/REVIEW

avatar Havok
@Havok

40 Kontribusi 67 Poin

Dipost 7 tahun yang lalu

cara nambah list lah :D

avatar pemudakoding
@pemudakoding

342 Kontribusi 120 Poin

Dipost 7 tahun yang lalu

Iya itu cara nambah listnya :x

avatar Havok
@Havok

40 Kontribusi 67 Poin

Dipost 7 tahun yang lalu

oowh ok thanks :D

avatar pemudakoding
@pemudakoding

342 Kontribusi 120 Poin

Dipost 7 tahun yang lalu

Nice to know.. Thanks gan..

avatar mail354
@mail354

2 Kontribusi 0 Poin

Dipost 7 tahun yang lalu

Woot :x

avatar Havok
@Havok

40 Kontribusi 67 Poin

Dipost 7 tahun yang lalu

kalo di sublime text gimana?

avatar NeticXcode
@NeticXcode

1 Kontribusi 0 Poin

Dipost 7 tahun yang lalu

saya masih kurang ngerti cara instal packages dan theme di Atom. ada tutor yg lebih jelas g ?

avatar Lafifmaqrun
@Lafifmaqrun

7 Kontribusi 0 Poin

Dipost 7 tahun yang lalu

Up :D

avatar Sam
@Sam

4 Kontribusi 1 Poin

Dipost 7 tahun yang lalu

Up :D

avatar Sam
@Sam

4 Kontribusi 1 Poin

Dipost 7 tahun yang lalu

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

avatar hadii
@hadii

1 Kontribusi 0 Poin

Dipost 7 tahun yang lalu

Makasih Gan Infonya

avatar pramudyaxyz
@pramudyaxyz

1 Kontribusi 0 Poin

Dipost 7 tahun yang lalu

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...

avatar baguzwahyu
@baguzwahyu

6 Kontribusi 0 Poin

Dipost 6 tahun yang lalu

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.

avatar arisid96
@arisid96

179 Kontribusi 71 Poin

Dipost 6 tahun yang lalu

Mantep nih, thanks gan

avatar mhdadil
@mhdadil

105 Kontribusi 61 Poin

Dipost 6 tahun yang lalu

Sangat bermanfaat mbah

avatar Gaptex
@Gaptex

3 Kontribusi 0 Poin

Dipost 6 tahun yang lalu

Izin share

avatar arisid96
@arisid96

179 Kontribusi 71 Poin

Dipost 6 tahun yang lalu

buatkan untuk notepad++ gan

avatar sukmaw
@sukmaw

340 Kontribusi 75 Poin

Dipost 6 tahun yang lalu

kalo bikin atom jadi transparan gimana yah

avatar rezulkarnain
@rezulkarnain

7 Kontribusi 0 Poin

Dipost 6 tahun yang lalu

knpa gak bisa sya install packages atom-beautifynya admin?

avatar wahyono
@wahyono

1 Kontribusi 0 Poin

Dipost 5 tahun yang lalu

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

avatar Tesa
@Tesa

1 Kontribusi 0 Poin

Dipost 5 tahun yang lalu

mantapp, plugin notepad++ juga dong bang.. rada repot dan berat kalo mau ngubah sedikit koding yg sudah onlen kalo pake atom tengkiu banyakk

avatar hexacore
@hexacore

73 Kontribusi 14 Poin

Dipost 4 tahun yang lalu

josh masih mantap ini kang, walaupun dipake ditahun 2k19

avatar 1Firsts
@1Firsts

18 Kontribusi 3 Poin

Dipost 4 tahun yang lalu

Login untuk ikut Jawaban