VISUAL CODE STUDIO : PENGANTAR

Visual Studio Code (VSC) merupakan software code editor buatan microsoft yang ringan tapi sangat powerful yang kompatibel dengan segala jenis sistem operasi seperti windows, macOS, maupun linux. dan bisa berjalan dibeberapa framework seperti JavaScript, TypeScript dan Node.js. serta dilengkapi dengan ekstensi yang beraneka ragam untuk berbagai jenis bahasa pemrograman seperti C++, C#, Java, Python, PHP, Go, sampai. NET,.

VSC pertama kali diperkenalkan Microsoft pada tahun 2015, mempunyai fitur-fitir, sebagai berikut :

• Fitur Pengeditan Dasar, merupakan lembar kerja untuk mulai merangkai coding yang dilengkapi fitur pengeditan seperti :

  • Fitur untuk memformat kode ke bentuk lain sesuai kebutuhan

  • Fitur penyimpanan otomatis

  • Fitur perintah copy paste pada satu atau beberapa barisan coding

  • Fitur pencarian kata kunci tertentu ataupun file, dan masih banyak lainnya.

• Fitur Mendeteksi Bug Dengan Lebih Cepat (Debugging), Jika ada eror sistem akan langsung menunjukkan di baris mana dan apa yang menjadi kesalahannya. sehingga mempermudah dalam hal mengedit, menyusun, dan mengeksekusi kode berulang kali dalam waktu singkat.

• Fitur Ekstensi Marketplace, merupakan fitur yang memungkinkan memperbanyak tools-tools di luar yang tersedia dalam visual studio code, dengan instal tools-mengtools tersebut tanpa perlu merancang detail konfigurasi. beberapa ekstensi populer yang bisa diunduh antara lain ESLint, Prettier, Live Server, Vetur, Debuggers,

• Fitur IntelliSense, dapat membuat coding tidak dari nol dimana sistem akan memberikan rekomendasi kode syntax yang sesuai berdasarkan jenis bahasa pemrograman atau database yang digunakan, cukup klik pada rekomendasi tersebut dan langsung muncul dalam lembar kerjamu. Secara default, IntelliSense hanya mendukung HTML, CSS, JavaScript, dan TypeScript. atau bisa mengunduh IntelliSense khusus melalui ekstensi marketplace.

• Terminal Support, menyediakan dukungan supaya pengguna tidak beralih di antara dua layar untuk hal yang sama. Sehingga dapat mengeksekusi skrip di terminal secara langsung tanpa membuka terminal tambahan lagi.

• Git Support, silahkan install GitHub Pull Request and Issues melalui fitur Extension Marketplace. sehingga dapat berbagi kode tanpa berpindah ke software lainnya. Sumber-sumber kode dapat diambil melalui repositori GitHub maupun sebaliknya. Menarik sumber ini juga berarti mengkloning kode yang tersedia di internet. Kode ini nantinya dapat diubah dan simpan kapanpun.

• Commenting, sangat membantu programmer dalam mengingat atau melacak kode yang sesuai. Selain itu, pihak-pihak yang berkolaborasi dapat memberi saran di dalamnya.

• Debugging, terdapat pada menu View > Debug. akan muncul panel-panel informasi seperti Variables, Watch, Call Stack, dan Breakpoints. Fungsinya adalah memudahkan editing, compiling, dan looping pada kode yang dibuat. Debugging sudah tersedia untuk Node.js, namun untuk bahasa pemrograman lainnya dapat didownload pada Extension Marketplace. Selain itu dapat menggunakan ekstensi Debugger for Chrome.

Cara Install Visual Code Studio, sebagai berikut :

• Download dari Visual Code Studio di https://code.visualstudio.com/Download. Selanjutnya tentukan installer sesuai sistem operasi yang dipakai, pilih icon yang sesuai maka proses download dimulai tunggu sampai mencapai 100%
• Klik dua kali pada file hasil download lalu tekan Run untuk menginstall Visual Code Studio.
• Ikuti instruksi yang muncul di layar sampai menyelesaikan proses instalasi. kemudian klik Finish untuk mengakhiri proses instalasi.

Cara Download Extension Visual Code Studio, sebagai berikut :

• Pada bagian awal  tampilan visual studio code, klik ikon Ekstensi yang berada  di Sidebar.
• Selanjutnya sistem akan menuju halam ekstensi marketplace. masuk ke kolom pencarian lalu ketik tulisan “ Extension “. Silakan pilih ekstensi yang akan dipakai dengan klik pada tombol Install.
• Proses instalasi ekstensi sedang berlangsung tunggu sampai mencapai angka 100%. Jika prosesnya  berhasil maka akan terlihat fitur tersebut pada kolom “Installed”.

Konsep-Konsep Dasar Dalam Belajar Visual Studio Code, meliputi :

• Mengubah Tema, caranya tekan tombol Ctrl + K dan Ctrl + T secara berurutan. Selanjutnya akan muncul daftar yang berisi berbagai tema default yang software ini sediakan. atau dapat mengunduh tema lain di Ekstensi Marketplace.

• Memberikan Perintah Pada Sistem Untuk Mengeksekusi Hasil Coding, Setelah memasukkan seluruh rangkaian coding yang telah dibuat, dengan memberikan perintah agar sistem menjalankan program tersebut dengan klik tombol “run” pada toolbar, yang mempunyai dua opsi yaitu “Start Debugging” dan “Run Without Debugging”. Perbedaannya terletak pada apakah akan menjalankan dengan debugger atau menggunakan software lain seperti Web Browser.

• Membuka dan Membuat File Baru, Untuk membuka file, dengan menekan tombol Ctrl + O. sedangkan untuk mencari file yang akan dibuka dengan menekan Ctrl + P dan klik file yang muncul. Jika membuat file baru maka klik Ctrl + N untuk “new file” dan klik Ctrl + S untuk menyimpan file.

• Mengubah Bahasa Pemrograman, dapat beralih dari satu bahasa pemrograman ke yang lain dalam visual code studio  dengan menekan tombol Ctrl + K lalu tekan tombol M. kemudian tinggal tentukan bahasa pemrograman yang akan digunakan.

• Mendeteksi Error, Untuk mengetahui error dengan menekan tombol Ctrl + Shift + M. Apabila ternyata ada beberapa error yang terdeteksi, maka bisa menggunakan F8 untuk berpindah dari satu error ke error yang lain.

Antarmuka Visual Studio Code, antara lain :

• Sidebar, Di sisi paling kiri, akan menemukan menu Sidebar yang berisi beberapa panel penting seperti:
  • Explorer untuk menampilkan dan mengelola file proyek.
  • Search untuk mencari teks di seluruh proyek.
  • Source Control untuk integrasi dengan Git.
  • Run & Debug untuk menjalankan dan memantau debugging kode.
  • Extensions untuk mengelola ekstensi tambahan.
• Editor Utama, tempat menulis kode yang dilengkapi dengan tab. sehingga dapat membuka banyak file sekaligus.
• Status Bar, Di bagian bawah aplikasi, dapat menemukan status bar berwarna biru. berisikan informasi  seperti bahasa pemrograman file yang sedang dibuka, status Git, dan notifikasi lainnya.
• Navigasi Dasar, Untuk membuka file kode, dapat klik file-nya sebanyak dua kali di Explorer. Peralihan antar tab dapat dilakukan dengan melakukan klik atau menggunakan shortcut keyboard. dapat mengakses berbagai perintah dengan cepat melalui Command Palette (Ctrl + Shift + P).

Membuat dan Mengelola Proyek, langkahnya sebagai berikut :

• Membuat Folder Proyek: Buatlah folder baru di sistem file Anda, misalnya ProyekWeb.

• Membuka Folder di VSCode: Di VSCode, pilih File > Open Folder setelah itu pilih folder yang telah Anda buat.
• Membuat File Baru: Klik ikon New File di Explorer untuk membuat file seperti index.html, style.css, atau app.js.
• Menyimpan dan Mengatur Struktur Proyek: Gunakan fitur drag-and-drop di Explorer untuk mengatur file dan folder sesuai kebutuhan Anda.

Kelebihan dari Visual Code Studio, antara lain :

• Open-Source, semua aksesnya gratis dengan kualitas bagus .

• Memori Ringan dan Kecepatan Memadai, Pada dasarnya VS Code telah didesain seringan mungkin agar user  tetap bisa memperoleh kenyamanan dengan Waktu loading cepat dan Kinerja yang tetap lancar walaupun memakai device dengan spesifikasi yang rendah

• Support Beraneka Ragam Bahasa Pemrograman, menyediakan dukungan yang luas untuk berbagai bahasa pemrograman sehingga cocok untuk developer yang bekerja dengan teknologi berbeda.

• Memungkinkan Pengerjaan Tugas Secara Otomatis, Sistem pengerjaan tugas yang tertanam dalam Visual Code Studio memungkinkan developer untuk membuat sistem yang otomatis pada tugas yang sifatnya repetitif,, Contohnya di sini seperti membangun, menguji, dan melakukan deploy proyek sehingga meningkatkan produktivitas.

Kekurangan Visual Code Studio, antara lain :

• Kebutuhan Set Up yang Cukup Rumit, membutuhkan pelaksanaan set up secara manual untuk mengaktifkan fitur compile, debug, dan bahasa secara spesifik.
• Ketergantungan Pada Plugins, perlu menginstal plugin untuk fungsi dasar seperti IntelliSense, penyorotan pada syntax tertentu, dan debugging.