Beranda

JavaScript #1: Hello, World!



Pengenalan JavaScript - Hello, World!

Pada bagian ini, kita akan memulai belajar dasar dari JavaScript, yaitu bagaimana menjalankan kode pertama kita. Biasanya, dalam belajar bahasa pemrograman, kita selalu memulai dengan menampilkan tulisan: "Hello, World!".

Tujuannya:

  • Untuk memastikan program bisa berjalan.
  • Untuk mengenal struktur dasar kode.

JavaScript dijalankan dimana?

JavaScript adalah Bahasa Pemrograman yang bisa dijalankan di:

1. Browser (Paling umum digunakan untuk pemula)
    - Contoh: Google Chrome, Microsoft Edge, Firefox
2. Di luar browser
    - Menggunakan Node.js
    - Biasanya untuk membuat aplikasi Backend

Pada materi ini kita akan berfokus ke browser dulu karena mudah untuk dipahami.

Cara Menambahkan JavaScript ke HTML

Agar JavaScript bisa berjalan di website, kita harus menuliskannya di dalam tag: <script>: 
<script>
</script>
Tag <script> berfungsi sebagai tempat menuliskan kode JavaScript di dalam file HTML.

Contoh Program Sederhana

Silahkan buat di Visual Studio Code.
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      alert("Hello, World!");
    </script>
  </body>
</html>

Penjelasan Kode

Mari kita pahami satu per satu:
  • <script> → tempat menulis JavaScript
  • alert("Hello, World!) → Menampilkan pesan popup di layar
  • kode akan langsung berjalan saat halaman dibuka
Jadi saat file ini dibuka di browser, akan muncul kotak pesan yang betuliskan Hello, World!

Cara Kerja <script>

Saat browser membaca HTML:
  1. Browser membaca dari atas ke bawah 
  2. Ketika menemukan tag <script> maka JavaScript langsung dijalankan
  3. Setelah itu, browser akan melanjutkan membaca HTML berikutnya
Jadi urutan penulisan kode itu penting.
-------------------------------------------------------------------------------------------------------------------------------------------------------

Soal Latihan

1. Program pertama
    - Buat file dengan nama: hello.html
    - Isi dengan kode untuk menampilkan pesan: Hello, JavaScript!

2. Program kedua
    - Buat file dengan nama: hello-2.html
    - Buat 3 alert dengan isi: 1. Hello, 2. Nama Lengkap, 3. Hello, World!

In Development.