Introduction to Front End Development

Front end adalah sisi client (namanya juga "front"). Client di sini adalah pengguna / kita / client. Saat kita membuka browser seperti Google Chrome atau Mozilla Firefox, seluruh tampilan visual dan antarmuka yang kita lihat adalah sisi client / front end.

Back end adalah sisi server. Server bertugas mengelola data, berinteraksi dengan database, dan memproses logika di balik layar. Contohnya saat proses login, validasi akun dan pengecekan kredensial ditangani oleh back end. Fokus materi ini adalah front end.

Tiga Pilar Front End

Pengembangan front end dibangun menggunakan tiga pilar: HTML, CSS, dan JavaScript.

HTML

HTML adalah kerangka halaman. HTML menentukan struktur dan konten apa saja yang ada di web, seperti teks paragraf, tombol, tautan, atau gambar. Pada tahap ini, elemen belum memiliki gaya visual khusus dan masih menggunakan tampilan bawaan browser. Menggunakan analogi rumah, HTML adalah fondasi serta kerangka bangunannya.

CSS

CSS bertugas mengatur tampilan visual dan desain. Jika HTML adalah kerangka rumah, maka CSS adalah cat tembok, penataan ruangan, dan dekorasi yang membuat rumah tersebut rapi dan menarik.

JavaScript (bukan Java yah)

JavaScript menambahkan interaktivitas dan logika di sisi client. Halaman yang hanya berisi HTML dan CSS bersifat statis. Saat pengguna menekan tombol dan sistem perlu memunculkan pop up, membuka menu drop down pada tampilan mobile, atau merespons tindakan pengguna di layar, JavaScript yang menjalankannya.

Apakah HTML & CSS bahasa pemrograman?

HTML dan CSS bukan bahasa pemrograman. HTML adalah Hypertext Markup Language, yaitu bahasa markup untuk menstrukturkan dokumen. CSS adalah Cascading Style Sheets, yaitu aturan gaya untuk mengatur presentasi visual. Sebuah bahasa pemrograman membutuhkan konsep dasar seperti variabel, fungsi, percabangan logika, dan manipulasi data. HTML dan CSS tidak memiliki kemampuan komputasi tersebut.

JavaScript adalah bahasa pemrograman karena memiliki variabel, fungsi, logika kondisi, serta manipulasi data.

Perlu dicatat bahwa Java dan JavaScript adalah dua bahasa yang sepenuhnya berbeda. Perbedaannya ada pada tujuan penggunaan dan ekosistemnya. Java umumnya digunakan di sisi server atau aplikasi enterprise. JavaScript awalnya dirancang khusus untuk berjalan di browser atau sisi client, meski saat ini JavaScript juga bisa digunakan di sisi server berkat Node.js.