Skip to content
Menggunakan Bootstrap Offline – Untuk Anda yang berprofesi sebagai web developer atau pernah mempelajari hal-hal seputar web tentu pernah mendengar Bootstrap. Bootstrap adalah library framework CSS yang dibuat khusus untuk bagian pengembangan front-end website.
Bootstrap menjadi salah satu framework HTML, CSS dan javascript yang populer serta banyak digunakan oleh web developer. Bootstrap memberikan kemudahan kepada web developer. Di samping itu Bootstrap juga sangat cepat, sebab kita hanya perlu menambahkan class-class tertentu untuk membuat suatu elemen, seperti tombol, navigasi, grid dan lain sebagainya.
Kelebihan Bootstrap
Ada beberapa kelebihan dari Bootstrap yang membuatnya diminati banyak orang. Berikut adalah beberapa keunggulan bootstrap:
- Pemakaian bootstrap lebih hemat waktu
- Tampilan bootstrap tampak modern
- Tampilan bootstrap juga mobile friendly, artinya bootstrap mempunyai tampilan yang responsif untuk semua perangkat, baik PC, smartphone maupun tablet
- Sangat ringan, sebab bootstrap dibuat dengan sangat terstruktur
Baca juga: Cara Menggunakan Font Awesome
Cara Menggunakan Bootstrap
Berikutnya kita bahas bagaimana cara menggunakan Bootstrap pada suatu website. Sebelum mulai, pastikan Anda telah mengunduh dan melakukan instalasi Bootstrap. Anda bisa mendownload Bootstrap pada situs resminya di http://getbootstrap.com/getting-started/.
Bootstrap terbaru yang tersedia di website resminya adalah versi 4.5.2. Sebelum mengunduh Bootstrap nantinya Anda bisa menentukan sendiri atau melakukan kustomisasi sesuai dengan keinginan. Adapun struktur isi Bootstrap terbaru adalah sebagai berikut:
|
bootstrap/
├── css/
│ ├── bootstrap.css
│ ├── bootstrap.css.map
│ ├── bootstrap.min.css
│ ├── bootstrap.min.css.map
│ ├── bootstrap–theme.css
│ ├── bootstrap–theme.css.map
│ ├── bootstrap–theme.min.css
│ └── bootstrap–theme.min.css.map
├── js/
│ ├── bootstrap.js
│ └── bootstrap.min.js
└── fonts/
├── glyphicons–halflings–regular.eot
├── glyphicons–halflings–regular.svg
├── glyphicons–halflings–regular.ttf
├── glyphicons–halflings–regular.woff
└── glyphicons–halflings–regular.woff2
|
Instalasi Bootstrap
Install Bootstrap dengan npm, composer dan bower
Tahap berikutnya adalah melakukan instalasi Bootstrap. Cara install Bootstrap ada beberapa macam. Kita bisa melakukan instalasi dengan composer, bower, ataupun dengan npm. Selain itu kita juga bisa menginstal Bootstrap secara online ataupun offline.
Jika menggunakan bower, kita bisa menginstal Bootstrap dengan perintah berikut:
bower install bootstrap
Lalu jika ingin menginstal Bootstrap dengan npm bisa dengan mengetikkan perintah:
npm install bootstrap
Sementara instalasi Bootstrap dengan composer adalah dengan perintah di bawah ini:
