Integrated development environment (IDE)

Teman-teman mahasiswa, dalam mengembangkan sebuah perangkat lunak, tools code editor atau Integrated development environment (IDE) akan sangat membantu memudahkan kita karena memiliki beberapa fitur seperti:

Menulis kode dengan highlight warna sehingga mudah dibaca.

Memberikan fitur autocomplete dan debugging sederhana.

Mendukung HTML, CSS, JavaScript, serta framework seperti Vue.js, React, Laravel, dll.

Terintegrasi dengan banyak ekstensi/plugin yang memudahkan pengembangan web.

Nah, dalam pengembangan website, ada banyak pilihan IDE seperti Notepad++, dan Sublime. Salah satunya yang akan kita gunakan berdasarkan modul BMP STSI4209 Pemrograman Web dalah Visual Code.

Halaman ini menyajikan panduan dan langkah dalam menginstalasi Visual Code dan plugin yang dapat membantu teman-teman mahasiswa.

Instalasi Visual Studio Code (VS Code)

Langkah 1: Unduh VS Code

Buka situs resmi: https://code.visualstudio.com/.

Klik Download for Windows.

Pilih installer .exe untuk sistem operasi Anda.

Langkah 2: Instal VS Code

Jalankan installer yang sudah diunduh.

Ikuti wizard:

Centang opsi Add to PATH (agar bisa dipanggil dari terminal).

Klik Next hingga akhir, lalu Install.

Klik Finish untuk membuka VS Code pertama kali.

Langkah 3: Cek Instalasi

Buka VS Code.

Coba buat file baru:

Klik File → New File.

Simpan sebagai index.html.

Tulis kode HTML sederhana.

Klik kanan file → Open with Live Server (jika sudah instal ekstensi Live Server).

Bagaimana jika belum menginstal ekstensi seperti Live Server?

Cara Menambahkan Ekstensi Penting di VS Code

Untuk mempermudah pengembangan web:

Live Server → Menjalankan web secara langsung di browser.

Prettier → Merapikan kode otomatis.

HTML CSS Support → Autocomplete untuk HTML & CSS.

JavaScript (ES6) snippets → Potongan kode cepat untuk JavaScript.

Cara instal ekstensi:

Klik ikon Extensions (Ctrl+Shift+X).

Cari nama ekstensi.

Klik Install.