People Innovation Excellence
 
Feature Image

Pengenalan Bootstrap

Bootstrap merupakan salah satu jenis framework untuk CSS (Cascading Style Sheet) yang digunakan untuk perancangan situs website. Pengunaan bootstrap sangatlah membantu progammer dalam membangun tampilan sebuah website. Hal tersebut tertulis di buku Bootstrap: Responsive Web Development karangan Jake Spurlock. Menurut Jake Spurlock keunggulan dari penggunaan Bootstrap adalah dapat menyesuaikan dengan kebutuhan website, dimana dapat memilih fitur CSS dan JavaScript sesuai dengan kebutuhan. Contohnya CSS pada Bootstrap juga menyediakan fitur form, tombol, navigasi dan komponen-komponen lainnya dan JavaScript yang membantu pembuatan antarmuka lebih mudah dan stabil. Bootstrap juga menyediakan banyak sekali class-class CSS dan plugin yang siap dipakai untuk membantu dalam membuat tampilan sebuah website. Karena sangat membantu, maka Bootstrap menjadi salah satu front-end framework yang paling banyak digunakan.

Walaupun sebagai sebuah framework, penggunaan bootstrap juga harus dikolaborasikan dengan penggunaan stylesheet. Hal tersebut dikarenakan class-class dan plugin yang tersedia didalamnya belum bisa memenuhi semua kebutuhan programmer. Jika semua progamme hanya mengandalkan bootstrap dalam pembuatan tampilan sebuah website, dapat dipastikan bahwa akan terjadi kemiripan antara tampilan website satu dengan lainnya.

Untuk menerapkan bootstrap, perlu adanya penambahan code berikut ini pada lembar HTML:

Di bawah ini merupakan contoh class pada bootstrap yang dapat digunakan untuk membua tsebuah button.

Dengan menerapkan potongan kode diatas, output yang dihasilkan adalah sebagai berikut:

Dengan penggunaan class yang berbeda pada gambar di atas, didapatkan hasil yang berbeda pula. Class yang digunakan dapat disesuikan dengan kebutuhan yang ada. Untuk memaksimalkan penggunaan bootstrap, maka harus diimbangi dengan penggunaan style sheet yang dapat dibuat secara manual yang disesuikan dengan kebutuhan.

REFERENSI:

Spurlock, J. (2013). Bootstrap: Responsive Web Development. Sebastopol: O’Reilly Media, Inc. Dipetik November 09, 2018, dari https://books.google.co.id/books?id=LZm7Cxgi3aQC&printsec=frontcover&dq=bootstrap&hl=en&sa=X&ved=0ahUKEwiIp5KJ3sbeAhVJb30KHUmICTQQ6AEIMTAB#v=onepage&q=bootstrap&f=false

https://www.w3schools.com/bootstrap4/bootstrap_buttons.asp

Penulis:
1901480583- TesyaFeby Lestari

Supervised by:
D5318 – Jeklin Harefa


Published at :
Written By
Jeklin Harefa, S.Kom.,M.T.I
Deputy Head of Computer Science Program | School of Computer Science

Periksa Browser Anda

Check Your Browser

Situs ini tidak lagi mendukung penggunaan browser dengan teknologi tertinggal.

Apabila Anda melihat pesan ini, berarti Anda masih menggunakan browser Internet Explorer seri 8 / 7 / 6 / ...

Sebagai informasi, browser yang anda gunakan ini tidaklah aman dan tidak dapat menampilkan teknologi CSS terakhir yang dapat membuat sebuah situs tampil lebih baik. Bahkan Microsoft sebagai pembuatnya, telah merekomendasikan agar menggunakan browser yang lebih modern.

Untuk tampilan yang lebih baik, gunakan salah satu browser berikut. Download dan Install, seluruhnya gratis untuk digunakan.

We're Moving Forward.

This Site Is No Longer Supporting Out-of Date Browser.

If you are viewing this message, it means that you are currently using Internet Explorer 8 / 7 / 6 / below to access this site. FYI, it is unsafe and unable to render the latest CSS improvements. Even Microsoft, its creator, wants you to install more modern browser.

Best viewed with one of these browser instead. It is totally free.

  1. Google Chrome
  2. Mozilla Firefox
  3. Opera
  4. Internet Explorer 9
Close