Kode VS: Tinjauan Mendalam untuk Pengembang WordPress

Microsoft mendapat reputasi buruk. Selama bertahun-tahun, mereka mendapatkan reputasi sebagai sedikit ketinggalan zaman dan kurang ramah pengguna. Bertahun-tahun yang lalu, mereka mungkin bahkan pantas mendapatkannya. Tapi tidak lagi. Usaha terbaru Microsoft bersifat lintas platform, intuitif, dan melampaui batas teknologi. Di situlah Visual Studio Code masuk. Sejak dirilis pada tahun 2015, VS Code telah menjadi editor kode de facto bagi banyak pengembang, dengan memilih Sublime Text dan Atom sebagai pilihan teratas. Dan itu mengatakan banyak. Jadi, mari kita jelaskan mengapa VS Code begitu hebat dan bagaimana Microsoft mendapatkan kembali semua kepercayaan kami.

Kode Visual Studio: Sumber Terbuka dan Mencintainya

Di permukaan, Visual Studio Code terlihat seperti kebanyakan editor lain di luar sana. Penyorotan sintaks, tema gelap, ekstensi, dll. Tetapi ketika Anda menggali lebih dalam, Anda melihat bahwa tidak seperti banyak editor dan IDE lain di luar sana, pengalaman yang Anda dapatkan di VS Code sangat mulus dan — maafkan permainan kata itu — agung.

Hal positif terbesar yang dimiliki VS Code adalah open source-nya. Tapi sekali lagi, begitu juga Atom (dan secara teknis juga dimiliki oleh Microsoft, sejak mereka mengakuisisi GitHub). Lebih dari itu, Microsoft telah merilisnya di bawah lisensi MIT, lisensi open-source yang paling lunak dan terbuka. Untuk perusahaan yang secara historis sangat ketat pada paten dan kekayaan intelektual mereka, ini adalah langkah besar .

Karena lisensi ini, VS Code memerintahkan komunitas pengembang keras yang tidak hanya menggunakan perangkat lunak untuk kehidupan profesional mereka, tetapi mereka juga berkontribusi pada editor itu sendiri atau ke beberapa ekstensi dan plugin yang tersedia untuk menyesuaikannya. Ada beberapa perdebatan mengenai luasnya lisensi MIT untuk Visual Studio Code, tetapi itu seharusnya tidak mempengaruhi pengguna atau pengembang mayoritas.

IDE All-In-One?

Inilah pertanyaan saat ini: Apakah VS Code editor kode atau IDE? Ini memiliki integrasi Git bawaan, akses terminal dan bash, konsol debugging, dan jenis penyorotan sintaks khusus dan penyelesaian kode yang disebut IntelliSense.

Semua itu langsung dari unduhan, tanpa ekstensi atau penyesuaian sama sekali. Biasanya, fitur-fitur semacam itu yang dibangun dan diperbarui oleh tim pengembangan resmi tersedia di aplikasi premium seperti PhpStorm. Tetapi dengan VS Code… garis itu menjadi kabur. Ini menawarkan banyak fitur seperti IDE.

Tapi pada akhirnya, itu tidak cukup IDE penuh. Anda tidak mendapatkan pemfaktoran ulang kode default, pembaruan khusus bahasa resmi dan pemeriksaan masa depan, dan hal-hal kelas berat lainnya yang dapat dibajak oleh IDE. Yang mengatakan, ada Visual Studio IDE. Ini adalah produk premium terpisah yang telah dibuat Microsoft selama bertahun-tahun, dan Visual Studio Code hanyalah anggota lain dari keluarga Visual Studio. Jadi, jika Anda mencari IDE kelas berat yang lengkap, Anda bisa mendapatkannya dari MS. Tapi ini adalah detik yang cukup dekat, jujur.

Juga, ada Visual Studio IDE adalah mengapa pengembang menyebutnya sebagai Kode VS atau hanya Kode daripada Visual Studio. Itu hanya akan terlalu membingungkan jika tidak.

Kode VS: Keluar dari Kotak

Jika Anda belum menebaknya, ada banyak bagian yang membentuk VS Code. Mari kita mulai dengan melihat dasar-dasar dan bagaimana semuanya bekerja langsung, sebelum menambahkan segala jenis ekstensi atau menyesuaikan apa pun.

Saat Anda membuka editor untuk pertama kalinya, Anda akan melihat dua hal:

• Tata letak dan desainnya mirip dengan editor lain, dan karenanya akrab bagi kebanyakan orang
• Ini memuat lebih cepat daripada kebanyakan editor kode lainnya (Atom, kami melihat ke arah Anda)

Setelah selesai dibuat takjub dengan betapa responsifnya, kita bisa pindah ke sidebar kiri. Di sinilah sebagian besar alat tambahan yang disertakan dengan VS Code akan hidup.

Ikon default di samping masing-masing akan membuka kolom baru saat diklik yang dapat diubah ukurannya dan disesuaikan.

1. Penjelajah

Tampilan default Anda di VS Code akan menjadi tab Explorer . Di dalamnya, Anda akan melihat bagian yang disebut Open Editors , yang merupakan bahasa gaul VS Code untuk dokumen. Setiap file yang Anda buka dianggap sebagai Editor baru. Jadi jika Anda memiliki 8 file .css terbuka, Anda akan melihat daftar 8 editor.

Kemudian Anda memiliki daftar Program terbuka yang mungkin membuat file untuk diedit dengan Kode VS. Untuk contoh ini, Anda akan melihat satu-satunya yang saya buka di latar belakang adalah Snagit. Di bawahnya adalah Garis Besar yang menampilkan kerangka file saat ini. Saat Anda mendapatkan file raksasa dan perlu mendapatkan tampilan top-down dari seluruh struktur, tampilan Outline sebenarnya bekerja sedikit lebih lancar daripada minimap di sebelah kanan layar.

2. Cari

Fitur Pencarian di VS Code sangat fenomenal. Bukannya lebih powerful dari editor lain (karena saya harus jujur ​​di sini: Saya suka Find/Replace in Sublime Text). Itu lebih mudah dan lebih transparan daripada editor lain.

Saat Anda melakukan pencarian, setiap contoh istilah pencarian Anda ditemukan di bagian bawah kolom kanan. Anda kemudian dapat mengklik satu contoh untuk menyorot lokasi istilah pencarian di dalam file. (Jika Anda CTRL/CMD-Click, itu akan membuka contoh kedua dari file yang menyoroti baris yang baru dipilih.)

Jika Anda memilih untuk mengganti istilah di bidang kedua, hasilnya akan menunjukkan versi istilah pencarian yang dicoret merah dan hasil yang diganti dengan warna hijau. Saat Anda mengklik temukan/ganti di hasil, perbedaan komparatif akan muncul untuk melihat pratinjau perubahan. Fitur ini sangat berguna sehingga Anda akan bertanya-tanya bagaimana Anda pernah hidup tanpanya.

3. Git

Saya akan mulai dengan mengatakan bahwa saya mungkin bias dalam pendekatan saya ke Git. Saya cenderung menjadi pengguna baris perintah/bash, dan klien grafis untuk Git tidak pernah merasa benar untuk saya. Jadi banyak integrasi Git dengan editor dan IDE lain yang belum saya sukai. Namun, implementasi VS Code adalah gabungan antara baris perintah dan GUI, dan ini bekerja dengan sangat baik, apa pun versi Git yang Anda inginkan. Dapatkan… versi Git?

Bagian tentang integrasi Git dalam VS Code adalah ia berfungsi. Kolom kiri yang muncul saat Anda mengklik ikon Git adalah indikator visual status repo Anda. Anda dapat mengklik elipsis (…) untuk melihat perintah Git yang biasanya harus diketik dengan sangat spesifik. Anda dapat menambahkan, melakukan, mendorong, dan bahkan mengubah file bertahap Anda dan bekerja di berbagai cabang melalui menu konteks.

Selain itu, Anda memiliki opsi untuk membuka terminal bash di editor itu sendiri. Ada menu Terminal di bilah navigasi, dan yang ada di dalam VS Code cepat, bersih, mulus, dan cukup bisa digunakan tanpa harus menyesuaikannya. Anda dapat membagi menjadi beberapa kolom jika perlu, dan tetap membuka berbagai direktori di terminal berbeda yang dapat Anda alihkan melalui dropdown.

Terminal juga tidak spesifik untuk Git. Ini bekerja dengan sangat baik dengan fitur ini, rasanya wajar untuk memasukkannya di sini.

4. Konsol Debug

Konsol Debug juga merupakan salah satu fitur default di VS Code yang membuatnya menonjol dari editor kode lainnya. Pada tulisan ini, ada 171 lingkungan debugging yang tersedia untuk diinstal dalam VS Code. Mereka tidak memberikan hitungan, tapi saya ingin tahu dan mengira Anda juga melakukannya, jadi saya menghitung secara manual.

Di dalam hasil, Anda dapat menemukan debugger untuk semua yang bisa dibayangkan. JavaScript, CoffeeScript, Coffee, Java… semua skrip bermerek kafein, sungguh. Anda mendapatkan lingkungan LUA dan Python dan Ruby, Docker, PHP, SASS, KURANG, dan… semuanya. Dari semua bahasa pemrograman yang tidak jelas dan/atau mati yang saya coba temukan debuggernya, QBasic adalah satu-satunya yang tidak memberikan hasil apa pun. Dan tidak ada yang menggunakannya dalam waktu yang sangat lama. Saya benar-benar berpikir Anda akan sulit sekali menemukan sesuatu dalam penggunaan modern tidak tersedia di Extensions Marketplace.

5. Pasar Ekstensi

Semua yang dikatakan, melihat lebih dalam ke Extensions Marketplace memberi Anda gambaran tentang jenis alat yang dapat Anda harapkan dari komunitas pengembangan editor. Anda dapat melihat pada tangkapan layar di atas pada jutaan pemasangan yang dimiliki beberapa ekstensi, dan jika Anda tidak yakin harus mulai dari mana, mengurutkan berdasarkan Pemasangan atau Popularitas mungkin merupakan pilihan terbaik Anda.

Anda dapat mengurutkan dan mencari berdasarkan kata kunci menggunakan parameter @sort . Tetapi Anda juga dapat mengklik elipsis (2) untuk dropdown dengan semua opsi Anda. Opsi untuk mengelola ekstensi yang Anda pasang sendiri juga tersedia di sini.

Setelah Anda menemukan sesuatu yang ingin Anda instal, itu sangat mudah dilakukan. Klik tombol Instal hijau,

Anda kemudian perlu memuat ulang editor Kode VS untuk menyelesaikan instalasi.

Itu dia. Setelah selesai, ekstensi Anda siap digunakan. Meskipun demikian, Anda mungkin ingin kembali ke tab Detail sesekali karena berbagai masalah tercakup di sana, seringkali melalui tag yang diperbarui dan diberi kode warna.

Mampu memeriksa status ketergantungan dan kerentanan itu bagus, dan Anda dapat melihat masalah terbuka apa pun dengan ekstensi dan berapa lama biasanya waktu yang dibutuhkan untuk mengatasinya. Tidak setiap ekstensi akan menampilkan semua informasi, tetapi ketika mereka melakukannya, itu sangat berguna.

Pintasan Keyboard dan Peta Tombol

Mungkin bagian terpenting dari editor kode adalah pintasan keyboard dan peta tombol. Semua hal yang telah kita bicarakan sangat bagus, dan itu merupakan bagian integral dari kesuksesan editor dan proyek. Tapi begitu Anda terbiasa dengan keymap dan jari-jari Anda menggunakannya melalui memori otot, menukar ke yang baru hampir tidak mungkin.

Paling-paling, bertukar akan memperlambat jadwal proyek Anda dan mengurangi efisiensi Anda, dan paling buruk, jari-jari Anda yang kikuk melakukan beberapa injeksi bencana ke basis kode.

Dari mana pun Anda berasal saat bermigrasi ke VS Code, komunitas telah membantu Anda. Baik itu dari VIM, Emacs, Sublime Text, atau bahkan Notepad++, Anda bisa menyimpan shortcut dan keymap yang biasa Anda gunakan. Anda dapat mencari di Extensions Marketplace dengan @recommended:keymaps atau masuk ke File – Preferences – Keymaps untuk menampilkan daftar ekstensi yang tersedia.

Dan jika Anda tidak memiliki preferensi untuk pintasan, itu juga tidak masalah. Jika Anda merasa perlu menyesuaikan apa pun (atau hanya ingin ikhtisar pintasan keyboard apa yang tersedia di VS Code secara default), Anda dapat membuka File – Preferences – Keyboard Shortcuts .

Lain-lain Fitur yang Harus Anda Ketahui

Sebagai gambaran umum, Anda seharusnya dapat melihat pada titik ini sebagian besar dari apa yang dapat ditawarkan oleh VS Code sebagai editor teks dan kode. Yang mengatakan, ada beberapa hal berguna yang harus Anda ketahui.

1. Menu Pilihan

Ini berguna terlepas dari tingkat dev Anda, tetapi ini sangat berguna jika Anda baru mengenal editor pada umumnya. Menu Pilihan memiliki sejumlah fungsi yang menurut Anda sangat berharga.

Secara khusus dapat menggunakan Add Cursors to Line Ends dengan sekali klik itu bagus, dan bisa masuk ke menu dan Select All Occurrences dari kata, frasa, atau cuplikan yang disorot dalam file saat ini. Sebagian besar editor memiliki ini sebagai pintasan, tetapi tidak semua memilikinya dengan mudah diberi label atau tersedia seperti VS Code. Itu menyegarkan untuk melihat mereka begitu di depan karena mereka adalah beberapa perintah yang paling berharga dan menonjol yang akan Anda gunakan.

2. Menu Terminal

Hanya karena Anda bekerja di editor kode tidak berarti Anda adalah seorang wizard baris perintah. Bahkan, Anda mungkin telah melihat baris perintah dan bagian terminal di atas dan berpikir Anda tidak akan pernah menggunakannya.

Tapi lihatlah menu Terminal . Bahkan jika Anda tidak melakukan banyak hal dengannya, Anda akan melihat beberapa perintah dasar yang dapat Anda jalankan dari menu yang mungkin sedikit membantu pengembangan Anda.

Hanya memiliki akses ke ini melalui menu alih-alih perlu mengetahui perintah shell membuka terminal dan bash dan baris perintah dengan cara yang dilewatkan begitu saja oleh banyak aplikasi. Sentuhan-sentuhan kecil seperti inilah yang membuat VS Code benar-benar menarik bagi semua orang, bukan hanya coders veteran yang berasal dari VIM atau Emacs.

3. Mode Zen

Di bawah menu View , Anda akan menemukan submenu bernama Appearance yang berisi opsi Toggle Zen Mode . Opsi lain di bawah Tampilan layak untuk dicoba dan dicoba, tetapi saya ingin menarik perhatian Anda ke Mode Zen karena saya berharap banyak orang belum pernah mencobanya.

Editor yang berbeda mungkin menyebutnya dengan nama yang berbeda, tetapi ide umumnya adalah Anda mengisi seluruh layar hanya dengan dokumen yang sedang Anda edit. Ini berbeda dari mode layar penuh di mana Anda tidak memaksimalkan aplikasi, tetapi dokumen.

Sulit untuk menampilkan mode dengan tangkapan layar karena tidak dapat benar-benar menunjukkan bahwa seluruh layar ditutupi oleh editor Kode VS. Bahkan taskbar Windows dan MacOS dock. Setiap piksel layar real estat diambil oleh proyek Anda saat ini sehingga Anda dapat fokus padanya dan tidak ada yang lain.

Dan jika bukan untuk Anda, tekan saja ESC, dan Anda kembali ke tampilan lama Anda.

Ini mungkin tidak tampak seperti banyak, dan saya dulu skeptis. Tapi setelah menggunakan fitur serupa di Scrivener untuk menulis fiksi, saya menjadi mualaf. Anda dapat lebih mudah masuk ke keadaan mengalir dan benar-benar menyelesaikan sesuatu. Begitu banyak pujian untuk VS Code karena mengimplementasikan Mode Zen sehingga kami dapat mencolokkan earbud kami dan bekerja tanpa gangguan kapan pun kami mau (atau sebanyak yang kami bisa).

Membungkus

Semua hal dipertimbangkan, Anda akan lalai untuk tidak mengunduh Visual Studio Code dan mencobanya. Microsoft telah mengeluarkan editor yang paling stabil, paling didukung, tercepat, dan proporsional ringan/berat fitur di luar sana. Pembuat kode baru, pengembang berpengalaman, atau penggemar yang ingin menemukan alat yang tepat…VS Code telah dibuat untuk Anda. Itu bukan prestasi yang mudah untuk dicapai, tetapi karena itu, VS Code bernilai bit dan byte di hard drive Anda. Dan mungkin bahkan melihat lagi di Microsoft jika Anda sebelumnya telah menghapusnya.

Apa aspek favorit Anda dari VS Code? Sudahkah Anda beralih?