Cara Menjalankan JavaScript di Browser dan VS Code

by

Belajar cara menjalankan JavaScript untuk pemula, langsung di browser dan dengan Visual Studio Code. Cocok untuk kamu yang baru mulai belajar coding.

keywords: cara menjalankan javascript, javascript di browser, javascript di visual studio code, cara run javascript, belajar javascript pemula, menjalankan javascript di vscode, coding javascript dasar

Banyak pemula yang semangat belajar JavaScript, tapi sering bingung saat mau mencoba kode pertama:
“Saya sudah menulis kode, tapi bagaimana cara menjalankannya?”

Tenang, artikel ini akan membimbing kamu langkah demi langkah untuk menjalankan JavaScript. Kita akan bahas dua cara utama: langsung di browser (cara termudah), dan lewat Visual Studio Code (VS Code) untuk pengalaman coding yang lebih profesional.

Jika kamu sudah membaca Hari ke 1 – Apa itu Javascript? maka artikel ini adalah lanjutan praktis supaya kamu bisa mencoba kode pertamamu.

Menjalankan JavaScript di Browser

Cara paling sederhana untuk menjalankan JavaScript adalah menggunakan browser seperti Chrome, Firefox, atau Edge. Semua browser modern sudah punya JavaScript Engine di dalamnya.

1. Menggunakan Console Browser

  1. Buka browser (contoh: Google Chrome).
  2. Tekan F12 atau klik kanan → Inspect → pilih tab Console.
  3. Ketik kode berikut:
console.log("Halo, Dunia!");
  1. Tekan Enter → kamu akan melihat tulisan Halo, Dunia! muncul di console.

👉 Cara ini cocok untuk uji coba cepat tanpa perlu file HTML.

2. Menggunakan File HTML + JavaScript

Untuk project lebih rapi, biasanya JavaScript ditulis dalam file HTML.

Contoh 1: Menulis JavaScript langsung di HTML (Internal JS)

<!DOCTYPE html>
<html>
<head>
  <title>Belajar JavaScript</title>
</head>
<body>
  <h1>Belajar JavaScript Hari 2</h1>
  <script>
    alert("Halo, JavaScript!");
  </script>
</body>
</html>

Simpan file ini dengan nama index.html, lalu buka di browser. Akan muncul pop-up alert dengan teks Halo, JavaScript!

Contoh 2: Memisahkan JavaScript ke File Tersendiri (External JS)

Biasanya programmer menaruh kode JavaScript di file terpisah agar lebih rapi.

  1. Buat file index.html:
<!DOCTYPE html>
<html>
<head>
  <title>Belajar JavaScript</title>
</head>
<body>
  <h1>Halo, Dunia!</h1>
  <script src="script.js"></script>
</body>
</html>

2. Buat file script.js:

document.write("Halo dari file JavaScript eksternal!");
  1. Buka index.html di browser → teks dari file script.js akan muncul.

👉 Cara ini sangat direkomendasikan untuk project karena kode lebih terorganisir.

Menjalankan JavaScript di Visual Studio Code (VS Code)

Setelah terbiasa dengan browser, kamu bisa naik level dengan Visual Studio Code, salah satu editor kode paling populer untuk pemrograman JavaScript.

1. Instal VS Code

2. Buat File Project Baru

  1. Buka VS Code.
  2. Buat folder baru, misalnya belajar-js.
  3. Buat file baru bernama index.html dan script.js.

3. Jalankan di Browser

Kamu bisa menjalankan kode langsung dari VS Code ke browser dengan bantuan ekstensi.

  • Install ekstensi Live Server dari Ritwick Dey.
  • Klik kanan pada index.html → pilih Open with Live Server.
  • Browser otomatis terbuka dan menampilkan hasil kode.

4. Menjalankan JavaScript dengan Node.js (Opsional)

Selain di browser, JavaScript juga bisa dijalankan langsung di komputer dengan Node.js.

  1. Download Node.js dari https://nodejs.org.
  2. Install sesuai sistem operasi.
  3. Buka terminal di VS Code.
  4. Ketik:
node script.js

Jika file script.js berisi:

console.log("Halo dari Node.js!");

Maka hasilnya akan muncul di terminal.

👉 Node.js sangat berguna jika kamu ingin belajar backend JavaScript.

Tips Menjalankan JavaScript untuk Pemula

  1. Mulai dari yang sederhana → gunakan console.log untuk melihat hasil kode.
  2. Jangan takut error → baca pesan error di console, biasanya sudah ada petunjuk perbaikannya.
  3. Gunakan ekstensi Live Server di VS Code untuk pengalaman coding lebih nyaman.
  4. atau Kunjungi codepen.io buat akun disana
  5. Pisahkan file JS dari HTML agar struktur project lebih rapi.

FAQ

1. Apakah harus pakai VS Code untuk belajar JavaScript?
Tidak. Kamu bisa pakai text editor apa saja, bahkan Notepad. Tapi VS Code punya banyak fitur yang membantu belajar coding.

2. Bisa jalankan JavaScript di HP?
Bisa, dengan aplikasi editor kode seperti Acode atau langsung lewat browser di HP. Tapi untuk serius, lebih baik di laptop/PC.

3. Lebih baik belajar lewat browser dulu atau langsung VS Code?
Mulai dari browser (lebih cepat & mudah), lalu pindah ke VS Code jika sudah terbiasa.

Kesimpulan

Ada banyak cara menjalankan JavaScript:

  • Langsung di browser (Console atau file HTML).
  • Menggunakan VS Code + Live Server untuk pengalaman coding lebih profesional.
  • Node.js untuk menjalankan JavaScript di luar browser.

Langkah berikutnya, setelah bisa menjalankan kode, kita akan belajar tentang variabel di JavaScript (var, let, const).

👉 Lanjut ke [Hari 3: Variabel JavaScript – var, let, const Dijelaskan Lengkap] untuk memahami cara menyimpan data di JavaScript.

Bagikan artikel ini:

FacebookTikTokXInstagramWhatsApp

Leave a Comment