Cara menggunakan vs code wordpress linter

Dipublikasikan Oleh : Alex Supriyadi (12171390)

Cara menggunakan vs code wordpress linter

Assalammualaikum Wr.Wb.

Buat kalian yang sedang membaca artikel ini, mungkin banyak banget dari kalian yang tanya alasan kenapa sih ko menggunakan vscode dibandingkan kode editor lain. Oleh karena itu di artikel kali ini saya akan jelaskan beberapa alasan yang menyebabkan saya menggunakan vscode dibandingkan kode editor lain. Saya alex supriyadi dan kalian sedang membaca artikel 7 alasan untuk menggunakan vscode.

Oke sebelum saya mulai, saya mau kasih tahu dulu bahwa artikel ini benar – benar merupakan opini dari saya. Saya menggunakan vscode ini bukan berarti vscode adalah kode editor yang terbaik, karena banyak yang bilang kode editor itu hanya sebagai tools saja, yang membantu kita mempercepat proses pembuatan sebuah program, ada banyak orang yang menganggap tools itu adalah sesuatu yang penting untuk kita kuasai dan kita pahami, tapi ada juga orang – orang yang menganggap tools itu merupakan sesuatu yang menghambat kita untuk membuat sesuatu, jadi selalu ada dua opini yang berbeda. Jadi kita bukan berdebat mencari mana yang paling baik, disini saya akan sharing aja, pengalaman saya setelah menggunakan sebuah tools untuk pemprograman yang namanya visual studio code. Nah sekarang latar belakangnya dulu ya, kenapa ko saya mau menggunakan visual studio code, padahal saya bisa saja menggunakan kode editor lain. Karena visual studio code ini rasanya banyak banget yang membicarakan, banyak banget yang pake, sehingga saya penasaran untuk mencoba menggunakan visual studio code ini. Jadi begitu ya teman – teman latar belakangnya. Nah sekarang kita langsung aja masuk ke alasan kenapa saya menggunakan visual studio code dibandingkan kode editor lain.

1. Gratis

Cara menggunakan vs code wordpress linter
Website resmi vscode.

Alasan yang pertama karena visual studio code itu gratis, beda dengan editor lain contohnya seperti sublime text. Sublime text itu berbayar ya, harganya kurang lebih sekitar $80 delapan puluh dolar atau diatas Rp. 1.000.000,00 satu juta rupiah, jadi lumayan kalo misalkan temen – temen baru belajar ngoding gitu terus pakai sublime text sebetulnya berbayar, walaupun kita bisa menggunakan versi yang trailnya, dan kayanya versi trailnya itu tidak jauh berbeda dengan versi fullnya atau berbayarnya, tapi tetep aja sebetulnya sublime text itu berbayar dan visual studio code gratis.

2. Plugin Emmet

Cara menggunakan vs code wordpress linter
Website resmi emmet.

Cara menggunakan vs code wordpress linter
Bisa di pasang di berbagai kode editor.

Cara menggunakan vs code wordpress linter
Proses emmet di file html cukup ketikan tanda seru lalu klik tombol tab maka akan otomatis dibuatkan struktur html yang lengkap.

Cara menggunakan vs code wordpress linter
Hebatnya lagi jika ingin membuat list, cukup dengan mengetikkan ul>li lalu klik tombol tab maka otomatis dbuatkan struktur list nya.

Cara menggunakan vs code wordpress linter
Struktur list.

Alasan yang berikutnya itu lebih kepada penggunaan saya sehari- hari, jadi buat temen – temen yang belum tau saya menggunakan kode editor ini khususnya untuk belajar ya, saya belajar di kelas dan di rumah, jadi sebisa mungkin saya menggunakan kode editornya itu persis sama dengan apa yang di install pertamakali, jadi engga ada plugin, sebisa mungkin engga pake tema warna sebetulnya, kenapa? Karena begitu saya menambahkan sesuatu yang temen saya itu tidak punya, kadang – kadang fokus belajarnya itu jadi berubah, nah jadi teman saya itu kadang – kadang malah bertanya ke sesuatu yang bukan pada topiknya, jadi nanya plugin, jadi nanya tema apa yang di pakai, sehingga kehilangan fokus, jadi kalo dikelaspun kadang – kadang saya malah ngajarin gimana caranya menginstall plugin, jadi sebisa mungkin saya ingin sebuah kode editor yang ketika di install itu udah langsung bisa digunakan, nah makanya alasan yang kedua adalah didalam vscode ini sudah terinstall plugin favorit saya di sublime text yaitu emmet, jadi kalo temen – temen belum tau emmet itu adalah sebuah plugin yang bisa kita install di banyak kode editor ya, emmet ini digunakan untuk mempermudah kita menulis html dan css, kita bisa install ini di kode editor macam – macam, jadi kita bisa install secara terpisah, nah tapi di visual studio code, emmet ini sudah tertanam secara default.

3. Linter dan Intelisense

Cara menggunakan vs code wordpress linter
Proses linter di file css, jika kodingan kita error seperti gambar diatas dibagian margin tidak ada tanda ; titik koma maka linter menandai dengan garis merah disekitar area yang error.

Cara menggunakan vs code wordpress linter
Lalu scroll kebawah dan klik icon tersebut. maka nanti akan muncul notifikasi errornya.

Cara menggunakan vs code wordpress linter
Linter menunjukkan bagian error di kodingan kita.

Cara menggunakan vs code wordpress linter
Proses intelisense di file php, jika kita ketikkan huruf a saja maka akan muncul saran – sarannya.

Sekarang alasan ke tiga itu karena didalam vscode juga udah terinstall yang namanya linter, linter ini adalah sebuah fungsi untuk ngecek kodingan kita itu ada errornya apa engga, kalo di kode editor lain seperti sublime text, linternya harus kita install sebagai plugin, walaupun di visual studio code itu tidak semua bahasa ada linternya, tapi css dan javascript itu ada, kalo php itu sayangnya kita harus nginstall plugin atau ekstension kalo di vscode bilangnya extension dan satu lagi selain linter juga ada yang namanya intelisense, nah kalo intelisense ini istilahnya autocomplete, jadi ketika kita ngetik apa terus dikasih tau saranya apa yang mau kita ketikan itu, menurut saya ini lebih lengkap dibanding editor lain.

4. Bekerja dengan warna

Cara menggunakan vs code wordpress linter
Ketika kita mendisain website di file css dan ingin menambahkan background color maka vscode akan menampilkan pilihan warna dikotak kecil.

Cara menggunakan vs code wordpress linter
Hebatnya lagi ketika kita sorot warnanya maka vscode menampilkan color picker dan bisa di ubah warnanya.

Alasan keempat adalah saat kita bekerja dengan warna, kalo kita bekerja dengan warna misal di css atau di html saya kasih background color itu otomatis divscodenya ngasih warna didepannya misalkan warna aqua nanti dikasih liat dikotak kecil warna biru muda begitu pula kita ngasih warnanya pakai hexadesimal dan yang lebih kerennya lagi ketika kita sorot warnanya itu keluar color picker dan bisa kita ganti, walaupun simpel ini sangat membantu saya ketika saya mendisain sebuah website dan ini sudah ada sejak kalian nginstall.

5. Sidebarnya lengkap

Cara menggunakan vs code wordpress linter
Sidebar vscode yang lengkap.

Cara menggunakan vs code wordpress linter
Di menu explorernya terdapat menu – menu yang memudahkan kita membuat folder dan file.

Alasan kelima adalah di vscode itu memiliki sidebar yang kaya akan fitur, jadi kalo kita buka sidebarnya di sebelah kiri pilih yang paling atas itu untuk explorernya kalo dibuka kalian bisa liat struktur folder dan file dan diatas sudah ada menu – menu yang membantu kita untuk bikin file baru atau untuk bikin folder baru kalo di kode editor lain seperti sublime text harus nginstall plugin lagi.

6. Mudah mengelola ekstension

Cara menggunakan vs code wordpress linter
Di menu ekstension vscode akan menampilkan saran – saran ekstension yang sering di gunakan orang – orang.

Alasan ke enam itu karena dapat dengan mudah mengelola ekstension, kalian dapat dengan mudah mengakses lewat menu sebelah kiri disitu ada menu ekstension, didalam marketplacenya kalian bisa dengan mudah mencari ekstension yang dibutuhkan dan bahkan lebih kerennya lagi kalo kalian nginstall sebuah ekstension vscode nya kadang –kadang menyarankan kita apakah anda mau nginstall ekstension lainnya karena orang –orang katanya menginstall yang ini juga jadi kita malah disarankan sama si vscodenya, jadi langsung dikasih tau ekstension yang direkomendasikan.

7. Mudah terintegrasi dengan git

Cara menggunakan vs code wordpress linter
Menu source control.

Cara menggunakan vs code wordpress linter
Kerennya lagi di vcode kita bisa menggunakan terminal langsung dengan mengakses view lalu klik terminal.

Cara menggunakan vs code wordpress linter
Terminal vscode.

Alasan ketujuh adalah di vscode ini kita dapat dengan mudah terintegrasi dengan git karena disebelah kiri itu ada source control atau untuk version control jadi kalo kalian yang senang bekerja dengan git vscode sudah menyediakan dan yang lebih kerennya lagi kita bisa menggunakan terminal atau console langsung dari vscode nya kalian bisa ke view lalu pilih terminal.

Download Visual Studio Code

Baiklah teman teman, jadi begitulah beberapa alasan yang menyebabkan saya mulai menggunakan vscode dan kalo misalkan pertanyaan nya adalah apa kekurangan vscode? Yang sangat terasa saat ini adalah dari sisi kecepatan, jadi misalkan kalian yang pakai editor lain seperti sublime text itu terasa banget lah, sublime text itu cepat banget kalo di klik langsung terbuka ketika kita membuka project yang besar dan filenya banyak lebih cepat terbukanya dari pada menggunakan vscode, jadi dari sisi kecepatan saya merasa sublime text jauh lebih cepat. Jadi kesimpulannya setelah saya menggunakan vscode selama kurang lebih satu minggu, terus terang saya merasa sangat nyaman perpindahannya tidak terlalu menyulitkan bahkan ada beberapa sourcat yang mirip dengan sublime text, jadi saya tidak merasa terlalu kesulitan dan sepertinya ini akan menjadi kode editor utama saya kedepannya dan buat perbandingan aja semua yang bisa dilakukan vscode tadi yang saya jelaskan, juga bisa dilakukan oleh sublime text bahkan mungkin dengan lebih cepat tapi kalian harus nginstall dulu plugin – plugin untuk tiap – tiap fiturnya dan untuk beberapa kasus ini, saya liat dari teman teman saya yang mungkin laptop atau notebook nya memiliki ram 2 gb, mereka merasa bahwa vscode ini sangat lambat. Tapi ketika menggunakan sublime text tidak ada masalah, lancar – lancar aja, jadi mungkin itu juga bisa menjadi pertimbangan kalian. Tapi pada akhirnya saya sarankan kembali kekalian untuk memilih Kode editor mana yang akan kalian gunakan kedepannya, silahkan pakai dua duanya bandingakan fitur fitur nya rasakan sendiri lalu pilih mana yang menurut kalian paling cocok. Jadi itu aja mungkin untuk artikel kali ini, pengalaman saya menggunakan visual studio code ini dan alasan kenapa saya menggunakannya. jadi itu aja untuk artikel kali ini, terimakasih sudah membaca artikel ini saya alex supriyadi pamit.

Download Visual Studio Code

Wassalamualaikum Wr.Wb.