CSS Framework dengan Tailwind CSS

Menata halaman langsung dari class di HTML, tanpa bolak-balik ke file CSS terpisah.

Deskripsi

Course lanjutan setelah CSS dasar dikuasai. Mulai dari cara kerja utility class, spacing, warna, layout flex dan grid, sampai responsive design dan dark mode. Modul terakhir masuk ke proyek sungguhan: memasang Tailwind lewat CLI, menentukan warna dan font sendiri dengan @theme, dan menangani class yang berulang. Semua contoh memakai editor langsung di halaman, jadi class-nya bisa diubah sendiri dan hasilnya terlihat saat itu juga.

Apa yang akan dipelajari
  • Menata halaman langsung dari utility class di HTML
  • Mengatur spacing, ukuran, warna, teks, border, dan shadow lewat class
  • Menyusun layout dengan Flexbox dan Grid versi Tailwind
  • Membuat tampilan responsive dengan prefix breakpoint, serta menangani hover, focus, dan dark mode
  • Memasang Tailwind lewat CLI dan menentukan warna serta font sendiri dengan @theme
Kurikulum
  1. 01 Dasar Tailwind: Bekerja dengan Utility Class 3 lesson · 50 menit
  2. 02 Layout dan Responsive 3 lesson · 1 jam
  3. 03 Tailwind di Proyek Nyata 3 lesson · 1 jam