Hallo Semuanya, Selamat Datang di Channel Ngoding Mastery, pada video kali ini kita akan membuat sebuah Website Landing Page pada segmen Landing Page yang Ke 2 dengan menggunakan Framework CSS yang bernama BOOTSTRAP, versi BOOTSTRAP yang akan kita pakai yaitu versi BOOTSTRAP yang terbaru yaitu BOOTSTRAP 5.
Dan tak lupa kita juga akan menambahkan sebuah Animasi dengan menggunakan Animate Style dan Animate On Scroll, ketika Webite di Refresh atau misalkan kita masuk kedalam sebuah Website maka akan ada Animasinya dengan menggunakan Animate Style, kemudian ketika Website di Scroll maka kita akan menambahkan Animasinya dengan menggunakan Animate On Scroll.
- Highlight pada video kali ini -
1. Bootstrap 5 Projects untuk Pemula yaitu Landing Page.
2. Best Practice menggunakan Bootstrap 5.
3. Tips and Trick menggunakan FLEX dan GRID di Bootstrap 5.
4. Tips and Trick menggunakan Row dan Col di Bootstrap 5.
5. Cara menggunakan Accordion Component di Bootstrap 5.
6. Cara menambahkan Icon dengan Font Awesome.
7. Menambahkan Fungsi merubah Warna Background pada Navbar dengan menggunakan Javascript Vanilla (native).
8. Cara menambahkan Animasi ketika onload dengan Animate Style.
9. Cara menambahkan Animasi ketika Scroll dengan Animate On Scroll.
- Extension Vs Code -
1. HTML CSS Support
2. Color Highlight
3. Color Info
4. Prettier - Code formatter
5. Auto Rename Tag
6. css-auto-prefix
7. Material Icon Theme
8. Andromeda
9. Error Lens
10. Better Comments
11. Live Server
- Extension Chrome -
1. What Font
2. Mobile Simulator
- chapter -
00:00 - Intro
00:40 - Overview Project yang akan dibuat
02:14 - Membuat Struktur Folder / File
04:24 - Starter Tamplate Bootstrap 5
05:42 - Menambahkan Font Poppins
06:44 - Menambahkan Font Awesome CDN
07:30 - Mengganti Fav Icon
10:00 - Membuat Navbar
20:12 - Membuat Section Hero
29:06 - Membuat Section About
36:49 - Mengubah Warna Background pada Navbar ketika Scroll
45:02 - Membuat Section Projects
54:35 - Membuat Section Services
1:09:15 - Membuat Section FAQ
1:26:10 - Membuat Section Footer
1:42:32 - Membuat Link Direct ke setiap Section
1:44:28 - Menambahkan Animate Style dan Animate On Scroll
1:46:32 - Menambahkan Animasi dengan Animate Style
1:52:04 - Menambahkan Animasi dengan Animate On Scroll
2:01:21 - Penutupan
-----------------------------------------------------------------------------
Like dan Subscribe jika teman - teman Suka ????
-----------------------------------------------------------------------------
