⚡ JavaScript Dasar
Level: Beginner
JavaScript adalah bahasa pemrograman yang membuat halaman web menjadi interaktif.
Jika HTML adalah kerangka rumah, CSS adalah cat dan dekorasi, maka JavaScript adalah listrik yang membuat rumah hidup dan berfungsi.
📖 Konsep Dasar JavaScript
- Menambahkan JavaScript
<script>
alert("Halo Dunia!");
</script>
- Variabel → tempat menyimpan data.
let nama = "Doddy";
const umur = 25;
- Tipe Data → string, number, boolean, array, object.
- Operator → +, -, *, /, %, ==, ===, &&, ||.
- Fungsi → blok kode yang bisa dipanggil ulang.
function sapa(nama) {
return "Halo " + nama;
}
console.log(sapa("Doddy"));
- Event → aksi pengguna (klik, input, hover).
<button onclick="alert('Tombol diklik!')">Klik Saya</button>
🛠️ Praktik Kecil
Buat file HTML dengan JavaScript sederhana:
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<title>JS Dasar</title>
</head>
<body>
<h1>Belajar JavaScript</h1>
<button onclick="ubahTeks()">Klik Saya</button>
<p id="pesan">Teks awal</p>
<script>
function ubahTeks() {
document.getElementById("pesan").innerHTML = "Teks berhasil diubah!";
}
</script>
</body>
</html>
👉 Saat tombol diklik, teks paragraf akan berubah.
🎮 Mini Challenge
Buat halaman HTML dengan JavaScript yang memiliki:
- Input teks untuk nama pengguna.
- Tombol "Sapa" yang menampilkan pesan sapaan di bawahnya.
- Gunakan fungsi JavaScript untuk mengambil nilai input dan menampilkannya.
Tugas tambahan: Tambahkan validasi: jika input kosong, tampilkan pesan error.