Cara Install Visual Studio Code di Windows 11, Lengkap dari Nol

Metode ini sangat berguna karena hampir semua proyek pemrograman sebaiknya dikerjakan dari struktur folder proyek yang jelas.

Membuat File Pertama di VS Code

Sekarang kita akan membuat file HTML sederhana sebagai pengujian.

Di dalam folder proyek, buat file:

index.html

Masukkan:




    
    
    Belajar VS Code


    Hello dari Visual Studio Code
    VS Code berhasil dipasang di Windows 11.

Simpan dengan:

Ctrl + S

Kemudian buka file tersebut melalui browser.

Jika halaman menampilkan tulisan Hello dari Visual Studio Code, berarti editor sudah dapat digunakan untuk membuat file proyek.

Memasang Extension di Visual Studio Code

Extension adalah salah satu kekuatan utama VS Code. Extension dapat menambahkan dukungan bahasa, formatter, debugger, integrasi Git, tema, dan berbagai kemampuan lainnya.

Buka panel Extensions dengan:

Ctrl + Shift + X

Atau klik ikon Extensions pada sidebar.

Extension yang Berguna untuk Pemula

Extension	Kegunaan
Live Server	Menjalankan halaman web secara lokal dengan mudah
Prettier	Memformat kode secara otomatis
GitLens	Membantu memahami dan bekerja dengan Git
PHP Intelephense	Autocomplete dan analisis kode PHP
Python	Dukungan pengembangan Python

Jangan memasang puluhan extension sekaligus hanya karena terlihat menarik. Instal extension sesuai kebutuhan proyek agar VS Code tetap ringan dan lingkungan kerja tidak terlalu penuh.

VS Code Saja Tidak Cukup untuk Semua Bahasa Pemrograman

Ini bagian yang sering disalahpahami pemula.

VS Code adalah editor, bukan otomatis compiler atau runtime untuk semua bahasa.

Misalnya:

Untuk JavaScript/Node.js, biasanya membutuhkan Node.js.
Untuk PHP, membutuhkan PHP runtime jika ingin menjalankan PHP secara lokal.
Untuk Python, membutuhkan Python.
Untuk C/C++, membutuhkan compiler/toolchain.
Untuk Git, perlu memasang Git jika ingin menggunakan Git dari komputer.

Jadi memasang VS Code tidak otomatis berarti komputer sudah siap menjalankan semua jenis program.

Cara Menggunakan Terminal di VS Code

VS Code memiliki terminal bawaan sehingga pengguna tidak selalu perlu membuka Command Prompt atau PowerShell secara terpisah.

Gunakan:

Ctrl + `

Terminal akan muncul di bagian bawah editor.

Terminal ini dapat digunakan untuk menjalankan perintah seperti:

node -v
npm -v
php -v
python --version
git --version

Perintah yang tersedia bergantung pada software yang sudah dipasang di Windows.

Membuka Project dengan Klik Kanan

Jika integrasi menu konteks diaktifkan ketika instalasi, pengguna dapat membuka File Explorer kemudian klik kanan sebuah folder dan memilih opsi untuk membukanya menggunakan VS Code.

Fitur ini sangat berguna ketika mengerjakan website karena pengguna dapat langsung membuka folder proyek tanpa harus mengetik lokasi folder secara manual.

Konfigurasi Dasar VS Code Setelah Instalasi

Aktifkan Auto Save

Jika tidak ingin terlalu sering menekan Ctrl + S, buka pengaturan dan cari:

Auto Save

Pilih perilaku yang sesuai dengan workflow.

Atur Ukuran Font

Buka Settings dengan:

Ctrl + ,

Cari:

Editor: Font Size

Ukuran 14–16 biasanya nyaman untuk layar laptop, tetapi sesuaikan dengan resolusi dan jarak pandang.

Menggunakan Command Palette

Command Palette adalah salah satu fitur penting VS Code.

Tekan:

Ctrl + Shift + P

Dari sini pengguna dapat mencari berbagai perintah VS Code tanpa harus menghafal lokasi menu.

User Settings dan Workspace Settings

VS Code memiliki dua tingkat pengaturan utama.

User Settings

Pengaturan ini berlaku secara umum untuk VS Code pada akun pengguna.

Workspace Settings

Pengaturan ini hanya berlaku untuk proyek tertentu.

Workspace settings biasanya disimpan dalam folder:

.vscode

Konsep ini penting ketika satu komputer digunakan untuk beberapa jenis proyek yang membutuhkan konfigurasi berbeda.

Cara Menggunakan VS Code untuk Project Node.js

Jika Node.js sudah terpasang, buka terminal VS Code dan periksa:

node -v
npm -v

Buat folder proyek:

mkdir belajar-node
cd belajar-node

Inisialisasi project:

npm init -y

Perintah tersebut akan membuat file:

package.json

Kemudian folder tersebut dapat dibuka menggunakan:

code .

Dengan kombinasi VS Code dan Node.js, pengguna sudah memiliki lingkungan dasar untuk mulai membuat aplikasi JavaScript atau backend berbasis Node.js.

Integrasi Git dengan VS Code

VS Code memiliki integrasi Git sehingga perubahan file dalam repository dapat dilihat melalui Source Control.

Namun, VS Code bukan pengganti Git. Jika Git belum tersedia di Windows, pengguna perlu memasang Git terlebih dahulu.

Setelah Git terpasang, cek menggunakan:

git --version

Jika nomor versi muncul, Git sudah dapat dipanggil dari terminal.

Masalah yang Sering Terjadi Setelah Install VS Code

1. Perintah `code` Tidak Dikenali

Jika muncul:

'code' is not recognized as an internal or external command

coba langkah berikut:

Tutup Command Prompt atau PowerShell.
Buka terminal baru.
Coba kembali code --version.
Jika masih gagal, pastikan VS Code terinstal dengan benar.
Jika perlu, lakukan instalasi ulang menggunakan installer resmi.

Instalasi Windows normal seharusnya menambahkan binary VS Code ke PATH.

2. VS Code Terpasang tetapi `code .` Tidak Berfungsi

Pastikan terminal dibuka setelah instalasi selesai.

Kemudian coba:

where code

Jika tidak menghasilkan lokasi command, masalah biasanya berkaitan dengan PATH.

3. Extension Tidak Bisa Dipasang

Pastikan koneksi internet berfungsi.

Jika menggunakan jaringan kantor, proxy, firewall, atau sistem keamanan tertentu, akses ke Marketplace dapat dibatasi.

4. VS Code Terasa Berat

Beberapa penyebab yang umum:

terlalu banyak extension
project sangat besar
folder dependency ikut dipindai
extension tertentu membutuhkan banyak resource
RAM komputer terbatas

Solusinya adalah menonaktifkan extension yang tidak diperlukan dan menghindari membuka project yang jauh lebih besar daripada kebutuhan.

5. Extension Bermasalah Setelah Update

Coba buka Extensions, kemudian nonaktifkan extension yang bermasalah.

Jika masalah hilang, kemungkinan extension tersebut menjadi penyebabnya. Periksa update extension atau dokumentasi pengembangnya.

User Setup atau System Setup: Mana yang Lebih Baik?

Untuk pengguna rumahan, pelajar, programmer pemula, dan pemilik laptop pribadi, User Setup merupakan pilihan paling praktis.

System Setup lebih masuk akal ketika:

komputer digunakan oleh beberapa akun Windows
VS Code harus tersedia untuk semua pengguna
administrator ingin mengontrol instalasi secara terpusat

Jadi tidak ada alasan memilih System Setup hanya karena terdengar lebih “lengkap”. Pilih berdasarkan kebutuhan.

Apakah VS Code Bisa Dipakai di Laptop Spek Rendah?

Bisa, selama sistem memenuhi persyaratan yang didukung. VS Code sendiri relatif ringan dibandingkan banyak IDE besar.

Namun, performa tidak hanya ditentukan oleh VS Code. Extension, ukuran project, Node.js, database lokal, browser, server lokal, emulator, dan aplikasi lain yang berjalan bersamaan dapat meningkatkan penggunaan RAM dan CPU.

Untuk laptop dengan RAM terbatas, gunakan extension seperlunya dan hindari menjalankan banyak aplikasi berat secara bersamaan.

Apakah VS Code Cocok untuk Pemula?

Ya, tetapi pemula sebaiknya tidak langsung memasang semua extension dan mempelajari semua fitur.

Urutan belajar yang lebih masuk akal adalah:

Install VS Code.
Belajar membuka folder project.
Belajar membuat dan menyimpan file.
Belajar menggunakan terminal.
Belajar extension yang benar-benar diperlukan.
Belajar Git.
Mulai menggunakan runtime seperti Node.js, PHP, Python, atau compiler sesuai bahasa yang dipelajari.

Perbedaan Visual Studio Code dan Visual Studio

Fitur	Visual Studio Code	Visual Studio
Jenis	Code editor	IDE lengkap
Ukuran	Relatif ringan	Lebih besar
Extension	Sangat bergantung pada extension	Fitur IDE lebih terintegrasi
Web development	Sangat cocok	Sangat cocok
Project besar	Cocok	Sangat cocok untuk workflow tertentu
Pemula	Relatif mudah dimulai	Lebih kompleks

Nama keduanya memang mirip, tetapi keduanya bukan aplikasi yang sama. Visual Studio Code lebih tepat dipahami sebagai code editor yang dapat diperluas, sedangkan Visual Studio merupakan IDE dengan lingkungan pengembangan yang lebih lengkap dan terintegrasi.

Cara Update Visual Studio Code

VS Code memiliki mekanisme update otomatis untuk instalasi normal. Ketika update tersedia, VS Code dapat menampilkan pemberitahuan untuk memasang versi baru.

Untuk User Setup, proses update biasanya lebih mudah karena instalasi tersebut dirancang untuk penggunaan akun pengguna tanpa memerlukan administrator untuk setiap proses update.

Versi ZIP berbeda karena update dilakukan secara manual.

Cara Uninstall Visual Studio Code di Windows 11

Jika ingin menghapus VS Code:

Buka Settings Windows.
Pilih Apps.
Buka Installed apps.
Cari Visual Studio Code.
Klik menu tiga titik.
Pilih Uninstall.
Ikuti proses penghapusan.

Uninstall aplikasi tidak selalu berarti semua data pengguna ikut dihapus.

«
1
2
3
»