Mengenal Bootstrap (Seri 1)

 Apakah Bootstrap itu?

Bootstrap adalah sebuah framework atau kerangka kerja dalam membangun sebuah website, yang mana didalamnya terdapat perintah-perintah HTML, dan terdiri dari banyak style-style dalam format CSS (Cascade Style Sheet).

Bootstrap sangatlah bermanfaat ketika kita ingin membangun sebuah website atau situs web, baik itu website Profil Perusahaan, Lembaga, Sekolah, Marketplace buat belanja online (Olshop = Online Shooping).

Ketika kita ingin membuat sebuah website, maka kita harus memahami kode-kode HTML berikut komponen-komponen pendukung lainnya, dan itu akan sangat sulit apalagi bagi pemula yang belum mengenal kode-kode tersebut.

Dengan bantuan Bootstrap, mengerjakan sebuah website menjadi lebih mudah, karena semua kerangka kerja dalam membangun website sudah disediakan, kita tinggal memilih atau bahkan cukup dengan meng-copy dan paste saja.

Semua nya itu tersedia di situs resmi Bootstrap, silahkan klik link nya ini : https://getbootstrap.com.

Tampilan halaman depan Bootstrap.

Bootstrap bersifat Open Source, dan yang namanya Open Source sudah tentu Free alias Gratis, semua kode-kode yang diberikan oleh bootstrap bebas kita meng-edit atau mengubahnya.

Dengan memanfaatkan Bootstrap maka kita tidak lagi kesulitan dalam membangun sebuah website yg informatif namun juga menarik dengan tampilan-tampilannya yg cantik serta tersedia banyak sekali tema-tema, baik yg sifatnya gratis atau berbayar.

Kerangka kerja yang digunakan berbentuk template desain berbasis HTML dan CSS untuk kebutuhan pengembangan navigasi, tombol, tipografi, formulir, dan komponen antarmuka yang lainnya. 

Selain itu, Bootstrap juga memiliki fitur yang mencakup library dari JavaScript. Untuk penggunaan dari framework ini digunakan untuk membantu dalam menyusun program aplikasi pada sisi front end (client – side). Untuk sekarang, Bootstrap sangat diminati oleh berbagai pengembang web melalui platform Github untuk membantu proses pembuatan desain aplikasi atau website yang lebih komprehensif dan modern.

Sampai saat saya menulis blog ini, Bootstrap sudah mencapai versi 5.

Bootstrap versi 5 merupakan perubahan terbaru saat ini, dimana terdapat beberapa tambahan fitur secara cukup signifikan. Diantaranya adalah menghapus dukungan jQuery dan diganti dengan Vanilla JavaScript, migrasi perangkat lunak dokumentasi dari Jekyll ke Hugo, dan fitur yang lainnya. 

Kelebihan dari Bootstrap :

1. Fleksibel : dalam setiap pengembangannya dapat dilakukan dengan mudah oleh developer menggunakan sebuah frame. Sehingga, dalam membangun sebuah website menjadi lebih mudah, cepat, dan efisien.

2. Sederhana penggunaannya : Struktur kerangka kerja atau Framework yang menjadikan proses pengembangan dari tampilan website maupun Aplikasi Web (Web Apps) menjadi lebih mudah.

3. Desain yang dihasilkan menjadi responsif : Saat ini setiap website haruslah dapat merespon dari ukuran layar ketika membuka halaman website kita, dimasa sekarang ini sebuah website juga dapat dibuka menggunakan berbagai gadget seperti menggunakan HP, Tablet sampai ke PC dengan ukuran resolusi layar yang berbeda-beda, tampilan website kita harus dapat menyesuaikan ukuran resolusi layar tersebut, sehingga memudahkan pengunjung untuk melihatnya. Bootstrap sudah memiliki kemampuan untuk responsif.

4. Dukungan terhadap struktur Javascript : untuk mengembangkan sebuah website dengan produk aplikasi yang memiliki tampilan yang interaktif dan menarik, maka dibutuhkan Framework dari Javascript.

Bootstrap juga sudah menyediakan komponen-komponen penting sebagai dukungan dari pembuatan website, diantaranya :

1. Front-end toolkit, peralatan-peralatan yang sudah dibuatkan oleh Bootstrap, kita tinggal pakai saja nantinya.

2. Kumpulan style CSS yang bisa dipakai berulang-ulang, sehingga kita tidak lagi perlu membuat style sendiri.

3. Banyak komponen yang sudah dibuatkan, kita tinggal pakai sesuai kebutuhan, kita tidak perlu lagi repot untuk membuat coding-coding nya.

4. Mudahkan kita pada saat ingin membuat website yang responsif, kita tidak perlu memakai kode-kode media query lagi, cukup memanggil style nya saja)

5. Ini yang paling menarik, Bootstrap gratis.

Selanjutnya, bagaimana caranya untuk dapat memanfaatkan Bootstrap?

Pertama kita harus mengunduh source code dari framework nya, kita dapat mengunduhnya melalui website Bootstrap, klik saja link ini : https://getbootstrap.com .

Lanjutkan dengan meng-klik tombol Download.

Kita akan menuju halaman Unduhan, disini ada beberapa pilihan Download, silahkan klik tombol Download yang pertama (ini cocok untuk pemula).

Tunggu sampai proses mengunduh selesai (ukuran file nya cukup kecil hanya 1,5 MB, jadi prosesnya singkat).

Copykan file yang diunduh pada sebuah folder khusus, contohnya folder ProyekBootstrap.

Kesimpulan :

Bootstrap adalah salah satu kerangka kerja dari CSS yang bermanfaat untuk mempermudah dalam proses pembuatan website berikut aplikasi-aplikasi yang berbasis web.

Semoga tulisan ini bermanfaat dalam menambah pengetahuan kita bersama.

Pada seri berikutnya saya akan menuliskan langkah-langkah memanfaatkan Bootstrap.