Bootstrap adalah framework CSS untuk membaut tampilan web. Bootstrap meneydiakan class dan komponen yang siap dipakai, sehingga kita tidak perlu menulis kode CSS dari nol.

Bootstrap awalnya dikembangkan oleh developer Twitter, lalu dibuat open source agar semua orang dapat berkontribusi di dalamnya.

Bootstrap kini sudah mencapai versi 4 dengan fiturnya lebih canggih dari yang sebelumnya.

Menyiapkan Project Bootstrap

Cara menyiapkan project Bootstrap sebenarnya tergantung dari lingkungan development yang akan kita gunkan.

Misalnya, kita mengembangkan web menggunakan Nodejs. Maka Bootstrap bisa kita intall dengan npm dan bower.

Namun, pada tutorial ini kita tidak akan menggunakan tool semacam itu.

Lalu cara apa yang akan kita gunakan?

Kita akan download manual bootstrap, lalu mengekstraknya ke dalam direktori project. Lalu menyisipkannya ke dalam HTML.

Baiklah, sekarang silahkan buat direktori baru.

mkdir belajar-bs4

Setelah itu download Bootstrap dari website resminya:

Kita akan mendapatkan file zip, silahkan ekstrak file tersebut ke dalam direktori belajar-bs4.

Maka struktur direktori kita akan menjadi seperti ini:

Setelah itu, silahkan buka direktori belajar-bs4 dengan teks editor adalanmu. Saya di sini menggunakan VS Code.

Membuat Halaman index.html

Nah sekarang mari kita coba membuat halaman index.html untuk mengetes Bootstrap-nya.

Silahkan buat file baru bernama index.html, lalu isi dengan kode berikut:

Silahkan buka melalui browser untuk melihat hasilnya.