Web Programming Bootstrap CSS

Belajar Bootstrap 5: Ngoding Web Responsif Secepat Kilat

Selamat tinggal kode CSS murni yang rumit! Kuasai Bootstrap 5 untuk merakit website yang 100% responsif di layar HP maupun Laptop hanya dengan merangkai class HTML.

Heru Iryanto
Heru Iryanto
Teacher, Content Creator and Full-Stack Developer

🔰 Deskripsi

Apakah Anda pernah merasa frustrasi saat menata posisi elemen HTML di tengah layar? Atau Anda sering kesal karena website yang terlihat rapi di laptop Anda, tiba-tiba menjadi berantakan saat dibuka di layar Handphone?

Jangan salahkan diri Anda! Menulis CSS murni (Vanilla CSS) dari nol memang sangat menyita waktu dan membutuhkan perhitungan matematika piksel yang memusingkan.

Inilah mengapa industri teknologi menciptakan CSS Framework. Dan di antara semua framework yang ada di bumi ini, Bootstrap adalah rajanya.

Dengan Bootstrap versi terbaru (Versi 5), Anda tidak perlu lagi menulis kode CSS yang panjang. Anda cukup menempelkan “Kata Sandi” (Class HTML) tertentu, dan elemen Anda akan berubah seketika!

  • Ingin membuat tombol biru yang cantik? Cukup ketik <button class="btn btn-primary">.
  • Ingin membuat margin atas sebesar 3 tingkat? Cukup ketik class="mt-3".
  • Ingin membuat menu navigasi HP (Hamburger Menu)? Cukup copy-paste kode yang sudah disediakan!

Apa yang akan saya pelajari ?

  • Pengenalan revolusi Bootstrap 5 (Yang kini sudah membuang jQuery sehingga jauh lebih ringan!).
  • Rahasia utama Bootstrap: Sistem Grid 12 Kolom (Kunci utama membuat website menyusut otomatis di layar HP).
  • Mempelajari Utility Classes untuk pewarnaan (Primary, Danger, Success).
  • Menghafal Utility Classes untuk jarak Margin dan Padding secara instan.
  • Menggunakan komponen Card untuk membuat katalog berita atau produk.
  • Menambahkan Navbar yang interaktif.
  • Membuat efek Animasi seperti Pop-up (Modal) dan Slider Gambar (Carousel) hanya dengan memanggil Class rahasia.

Project apa yang akan saya buat ?

Setelah memahami semua fungsi Class rahasia tersebut, di Bab terakhir kita akan menumpahkan semua ilmu yang ada untuk membangun Situs Web Portofolio (Satu Halaman / One-Page).

Web ini akan dilengkapi dengan Jumbotron/Hero Image di bagian atas, Grid Layout untuk galeri proyek Anda, dan Formulir Kontak yang semuanya dijamin 100% rapi saat dibuka di HP calon klien Anda!

💎 Materi

Siapkan editor teks Anda, dan mari kita mulai merakit website tanpa perlu menangis karena CSS Flexbox yang rumit! Mari menyingkat waktu coding Anda hingga 10x lipat! 🚀

    Belajar Bootstrap 5: Ngoding Web Responsif Secepat Kilat Rp 0 Rp 99.000 / tahun 🍔 Belajar Sekarang