🔹 1. HTML (HyperText Markup Language)

HTML adalah bahasa markup yang digunakan untuk membuat struktur dasar sebuah halaman web.

• HTML bukan bahasa pemrograman, melainkan kumpulan tag/elemen yang memberi tahu browser bagaimana menampilkan konten.
• Elemen HTML biasanya terdiri dari tag pembuka <tag>, konten, dan tag penutup </tag>.
• Beberapa tag penting dalam HTML:
  • <h1> sampai <h6> → untuk judul.
  • <p> → untuk paragraf.
  • <a> → untuk hyperlink (tautan).
  • <img> → untuk menampilkan gambar.
  • <table> → untuk membuat tabel.
  • <form> → untuk membuat formulir input.

📌 Contoh HTML dasar:

2. CSS (Cascading Style Sheets)

Kalau HTML hanya membuat kerangka, CSS digunakan untuk memperindah tampilan.

• CSS bisa ditulis langsung dalam file HTML (inline atau internal) atau di file terpisah .css (external).
• CSS bekerja dengan selector (misalnya tag, class, id) dan property-value.
• Dengan CSS, kita bisa mengatur:
  • Warna (color, background-color)
  • Ukuran dan gaya teks (font-size, font-family)
  • Posisi elemen (margin, padding, position)
  • Layout (flexbox, grid)
  • Animasi dan transisi

📌 Contoh CSS sederhana:

3. JavaScript (JS)

JavaScript adalah bahasa pemrograman yang membuat halaman web menjadi interaktif dan dinamis.

• Kalau HTML itu tulang, CSS penampilan, maka JS adalah otak dan otot website.
• JavaScript bisa:
  1. Mengubah konten HTML secara langsung (misalnya mengganti teks).
  2. Merespons aksi pengguna (klik, ketik, scroll, dll).
  3. Mengontrol CSS (misalnya mengubah warna saat tombol diklik).
  4. Berinteraksi dengan server (mengambil/mengirim data tanpa reload, lewat AJAX/Fetch API).
  5. Membuat animasi dan efek-efek keren di halaman web.

📌 Contoh JavaScript sederhana:

Hubungan HTML, CSS, dan JavaScript

Ketiga teknologi ini biasanya digunakan bersama-sama dalam pembuatan website.

1. HTML → Menentukan struktur dasar.
2. CSS → Membuat tampilan lebih menarik.
3. JavaScript → Memberikan interaksi dan logika.

📌 Contoh mini project yang menggabungkan semuanya:

Kesimpulan

• HTML = kerangka halaman web.
• CSS = mempercantik tampilan.
• JavaScript = memberi otak dan interaktivitas.

👉 Tanpa HTML, tidak ada konten.
👉 Tanpa CSS, website akan terlihat polos dan tidak menarik.
👉 Tanpa JavaScript, website tidak akan interaktif dan terasa “mati”.

Ketiga teknologi ini adalah fondasi utama pengembangan web (sering disebut Front-End Web Development).