DISKON TERBATAS! Masukkan kupon "skillbaru" saat checkout di kelas apa saja

Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

CARA RUN HTML DI VISUAL STUDIO CODE

Artikel ini berisi panduan langkah-langkah mudah untuk menjalankan HTML di Visual Studio Code. Ikuti petunjuk sederhana ini untuk memulai.

Daftar Isi:

Langkah Pertama: Membuat Dokum...
Langkah Kedua: Menginstal Ekst...
Langkah Ketiga: Menjalankan Se...
Tips Tambahan: Menggunakan Sni...

Visual Studio Code (VS Code) adalah perangkat lunak pengeditan teks yang paling populer di kalangan pengembang saat ini. Antara lain, perangkat lunak ini memberi kamu kemampuan untuk menulis kode HTML dan melihat hasilnya secara langsung. Namun, mungkin ada beberapa dari kamu yang masih bingung bagaimana cara menjalankan HTML di Visual Studio Code. Tenang, artikel ini akan memandu kamu langkah demi langkah menjalankannya.

Sebelum kita memulai, pastikan kamu sudah menginstal Visual Studio Code dan browser pilihanmu di komputermu.

Langkah Pertama: Membuat Dokumen HTML Baru

Buka VS Code dan pilih File -> New File untuk membuat file baru. Simpan file tersebut dengan ekstensi .html untuk mengindikasikan bahwa ini adalah dokumen HTML.

Langkah Kedua: Menginstal Ekstensi Live Server

Untuk dapat melihat hasil HTML secara langsung, kamu perlu menginstal ekstensi Live Server pada VS Code. Berikut caranya:

  • Di sebelah kiri layar VS Code, kamu akan melihat ikon Extensions. Klik ikon tersebut.
  • Di kotak pencarian, ketik Live Server dan tekan Enter.
  • Dari daftar panduan yang muncul, pilih ekstensi Live Server yang dibuat oleh Ritwick Dey. Klik tombol Install yang berwarna hijau.

Langkah Ketiga: Menjalankan Serverdan Membuka Dokumen HTML

Setelah proses instalasi selesai

  1. Klik kanan di dalam file HTML yang telah kamu buat.
  2. Pilih Open with Live Server.

Dokumen HTML yang kamu buat sekarang akan terbuka di browser pilihanmu. Setiap kali kamu melakukan perubahan pada kode dan menyimpannya, halaman web akan secara otomatis diperbarui, memungkinkan kamu untuk melihat hasil perubahan tersebut.

Pada titik ini, kamu harus bisa menjalankan HTML di Visual Studio Code dan melihat hasilnya secara langsung di browsermu.

Tips Tambahan: Menggunakan Snippets HTML

Agar lebih cepat dalam penulisan kode HTML, VS Code menyediakan “snippets” atau potongan kode yang bisa kamu gunakan. Cukup ketik ! dan tekan tombol Enter, maka struktur dasar HTML akan otomatis tertulis.

Dengan mengikuti panduan ini, diharapkan kamu bisa menjalankan HTML di Visual Studio Code dengan sukses dan mudah. Selamat mencoba dan semoga sukses!


Daftar newsletter skodev masukkan emailmu untuk dapat informasi menarik dari dunia koding