Tiga Pilar Utama Pemrograman Web

Saat pertama kali belajar membuat website, kamu pasti akan langsung dihadapkan dengan tiga teknologi utama: HTML, CSS, dan JavaScript. Agar tidak bingung membedakan tugas ketiganya, mari bayangkan kamu sedang membangun sebuah rumah.

1. HTML (HyperText Markup Language) sebagai Rangka Rumah

HTML adalah fondasi dan struktur dari website kamu. Dalam analogi rumah, HTML adalah batu bata, semen, tiang pancang, dan atap. HTML menentukan di mana letak ruang tamu, pintu, dan jendela.

• HTML membuat kerangka konten: teks, gambar, tombol, dan form input.
• Tanpa HTML, website kamu tidak akan memiliki bentuk sama sekali.
• Kodenya menggunakan tag, seperti

  untuk judul besar dan

  untuk paragraf.

2. CSS (Cascading Style Sheets) sebagai Desain Interior

Rumah yang hanya terbuat dari batu bata tentu terlihat membosankan. Di sinilah CSS masuk. CSS adalah cat dinding, keramik lantai, dan dekorasi furnitur. CSS bertugas membuat struktur HTML tadi menjadi cantik dan menarik untuk dilihat.

• CSS mengatur warna, ukuran font, jarak antar elemen, hingga animasi sederhana.
• CSS memastikan rumah (website) kamu terlihat rapi, baik saat dilihat dari laptop (layar besar) maupun smartphone (layar kecil).

3. JavaScript (JS) sebagai Instalasi Listrik dan Air

Rumahmu sudah berdiri dan dicat dengan indah, tapi lampunya tidak bisa dinyalakan dan airnya tidak mengalir. JavaScript adalah instalasi listrik, pipa air, dan sistem pintar di dalam rumah tersebut yang membuatnya berfungsi (interaktif).

• JavaScript membuat tombol memunculkan pop-up saat diklik.
• JavaScript mengambil data terbaru dari server (misalnya mengambil tweet baru tanpa perlu me-refresh halaman).
• JavaScript mengendalikan logika aplikasi, seperti menghitung total harga di keranjang belanja.

Kesimpulan

Sebagai web developer, kamu tidak bisa hanya mengandalkan salah satu dari ketiganya. HTML memberikan struktur, CSS memberikan gaya, dan JavaScript memberikan fungsi. Pelajari ketiganya secara berurutan: mulai dari HTML, percantik dengan CSS, lalu buat menjadi hidup dengan JavaScript.