Apa Itu Twitter Bootstrap

Sudah lama nggak update, kali ini saya mau menyuguhkan sajian ringan di malam hari ini. Mari kita berkenalan dengan penghuni lain di dunia Web Development, Bootstrap Framework. Agak melenceng memang dari artikel kemarin tentang cara mengatasi invalid compiler di CodeBlocks. Mungkin sebagian dari Anda sudah tahu tentang Bootstrap. Saya sendiri baru mengenal Bootstrap pada awal bulan Januari lalu dari teman. Jadi, mohon maaf kalau apa yang saya sampaikan di artikel ini ada yang salah. Seperti biasa, acara perkenalan kita mulai dengan beberapa pertanyaan. Siapakah dia? Apakah dia teman ultraman atau musuh batman? Apa tujuan dia datang ke dunia maya? Dan apa saja yang telah dia lakukan untuk para penggemarnya? Untuk selengkapnya simak artikel berikut.

Bootstrap adalah jebolan dari Twitter yang dikembangkan oleh Mark Otto dan Jacob. Bootstrap merupakan front-end toolkit open source yang digunakan dalam pengembangan aplikasi berbasis Web. Pada dasarnya Bootstrap merupakan CSS yang dikembangkan dengan Less Framework. Less digunakan untuk mempermudah dan meringkas kode CSS yang digunakan dalam mendesain suatu Website. Dengan begitu, penggunaan kode CSS akan semakin ringkas dan dapat diimplementasikan untuk pengembangan Website yang lain. Untuk keterangan lengkap tentang Less silahkan Anda googling sendiri.

Lalu, apa fungsi dari Bootstrap? Bootstrap berfungsi untuk membantu designer dan pengembang dalam mendesain sebuah halaman web dengan cepat dan tampilan yang bagus aka ciamik. Sehingga, waktu yang digunakan untuk mendesain tampilan Web dapat dikurangi dan dialihkan untuk minum kopi dan makan snack. Saat ini bootstrap sudah kompatibel dengan beberapa browser terkenal, seperti Firefox, Chrome, IE+7 dan lainnya.

Salah satu kelebihan Bootsrap menurut saya adalah Responsive Design. Responsive Design merupakan suatu istilah yang digunakan untuk sebuah tampilan atau design website yang dapat diadaptasikan pada perangkat mobile atau tablet. Jadi tampilan Web kita akan disesuaikan dengan tampilan ukuran layar yang terdapat di HP. Selain itu, juga bisa kita lihat, tampilan Web ketika browser dikecilkan juga akan menyesuaikan. Contohnya bisa dilihat pada salah satu buatan saya yang nggak bagus bagus amat, cek di sini. Coba jendela browsernya dikecilkan, ukuran halaman dan isinya akan menyesuaikan, termasuk gambar yang ada.

Tampilan asli di browser
Klik kiri untuk memperbesar

Setelah ukuran jendela browser diperkecil
Klik untuk memperbesar

Bagi saya pribadi menggunakan Bootstrap itu gampang-gampang susah. Susah kalau yang nggak tahu mau buat apa dan mudah bagi yang sudah mengerti HTML dan CSS. Selain itu, untuk mempermudah para pengguna Bootstrap, tim pengembang telah memberikan beberapa panduan dasar dalam menggunakannya. Panduan dasar ini bisa kita lihat pada menu halaman webnya di Github. Panduan dasar ini terdiri atas Get started, Scaffolding, Base CSS, Components dan Javascript.

Cara menggunakan Bootstrap cukup mudah, tinggal download paketnya, masukkan ke dalam projek kita, lalu panggil filenya ke halaman Web yang kita buat. Setelah itu, tinggal kita manfaatkan kelas dan toolkit yang ada sesuai kebutuhan. Nantinya dalam paket bootstrap ini akan terdapat 3 direktori. Diantaranya, CSS, Javascript dan Image. Untuk direktori image hanya berisi gambar icon dari Glyphicons yang dapat kita gunakan.

Sudah banyak website yang mengimplementasikan bootstrap ini. Beberapa contohnya bisa dilihat di unofficial Tumblr atau Premium Bootstrap Template di Theme Forest (berbayar). Contoh yang lain bisa Anda cari di Google. Kalau dilihat hasil tampilannya sangat bagus, bahkan untuk membuat struktur yang sederhana sekalipun. Sekian artikel Apa Itu Twitter Bootstrap dan terima kasih. Happy surfing !!!

Referensi :

https://dev.twitter.com/blog/bootstrap-twitter

http://twitter.github.io/bootstrap/