Browser: HTML, CSS, DOM, dan Aksesibilitas

Yang akan kamu pelajari

• Menulis HTML semantik yang jalan dengan keyboard dan screen reader
• Menyusun layout halaman dengan flexbox dan grid tanpa menebak-nebak
• Menjelaskan box model, cascade, dan specificity
• Menemukan dan mengubah elemen apa pun di halaman dengan DOM API
• Menangani event, termasuk bubbling dan delegation

Pelajaran

1. 01

   HTML yang punya makna

   Kenapa `<button>` selalu lebih baik daripada `<div>` yang bisa diklik.

   Baca 25 menit
2. 02

   Aksesibilitas: bukan opsional

   Navigasi keyboard, label, focus, dan kontras. Murah kalau dibangun dari awal, mahal kalau ditambal belakangan.

   Baca 28 menit
3. 03

   Dasar CSS: box model, cascade, specificity

   Kenapa style-mu diabaikan, dan tiga aturan yang menjelaskannya.

   Baca 30 menit
4. 04

   Layout dengan flexbox dan grid

   Satu sumbu atau dua. Pilih yang tepat dan layout berhenti jadi coba-coba.

   Baca 32 menit
5. 05

   Tailwind: CSS sebagai utility class

   Pendekatan styling yang dipakai proyek ini, kenapa banyak tim memilihnya, dan disiplin design token di baliknya.

   Baca 28 menit
6. 06

   DOM: halamanmu sebagai object

   Pohon yang dibangun browser dari HTML-mu, dan bagaimana JavaScript menjangkaunya.

   Baca 28 menit
7. 07

   Event, bubbling, dan delegation

   Bagaimana sebuah klik berjalan melewati halamanmu, dan kenapa itu penting nanti di React.

   Baca 25 menit
8. 08

   Form dan validasi di browser

   Platform-nya bisa lebih banyak dari yang kamu kira — dan kenapa validasi browser saja tidak pernah cukup.

   Baca 25 menit