Langsung ke konten utama

Pengertian Bootstrap, Perbedaan Bootstrap.css, Bootstrap.min.css, Bootstrap-grid.css, dan Bootstrap-grid.min.css

Apa itu Bootstrap ?

Bootstrap adalah sebuah framework yang sangat populer di dunia pemrograman web. Dengan menggunakan boostrap tampilan atau front end sebuah web akan terlihat lebih hidup. Tidak hanya sampai disitu, bootstrap juga mengedepankan tampilan untuk mobile sehingga web yang dibuat akan lebih responsif.

Ketika mendownload bootstrap di website resminya https://getbootstrap.com/ pengguna akan diberi file berformat ".rar", isi dari file ini adalah css dan juga js. Cara menggunakan bootstrap juga sangatlah mudah. Ada dua cara yang bisa anda gunakan yaitu secara offline atau onlia.

Untuk cara offline cukup download file bootstrap di website resminya yang berekstensi rar kemudian ekstrak file "rar" tersebut kedalam folder website anda. Setelah itu anda bisa memanggilnya menggunakan perinta :

//UNTUK CSS
 <link rel="stylesheet" type="text/css" href="ISI_LOKASI_BOSTRAP">
 //UNTUK JS
 <script type="text/javascript" src="ISI_LOKASI_BOSTRAP"></script>


Cara kedua yang bisa digunakan adalah dengan cara online. Pengguna cukup menuliskan perintah berikut pada bagian <head> website.

//UNTUK CSS
 <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css">
 //UNTUK JS 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script>


Perbedaan antara Bootstrap.css, Bootstrap.min.css, Bootstrap-grid.css, dan Bootstrap-grid.min.css

Didalam folder CSS anda akan menemukan beberapa file di antaranya :


  • bootstrap.css - ini adalah file normal css bootstrap, dimana semua kode tersusun kebawah. File ini bisa anda gunakan bila anda hendak mengembangkan atau ingin menambah isi dari bootstrap ini.
  • bootstrap.min.css - sangat saya sarankan untuk menggunakan file ini bila anda tidak ingin menambahkan apa-apa kedalam file bootstrap. Karena file ini lebih ringan dan tentunya akan berpengaruh pada kecepatan. Isinya sama saja dengan bootstrap.css hanya saja bentuk penyajiannya yang bedah. Bootstrap.min.css ini memanjang ke samping, hanya menggunakan satu baris saja dimana spasi dan enter sudah dihilangkan.
  • bootstrap-grid.css - seperti namanya css bootstrap yang satu ini hanya berisi sebagaian kecil, dan hanya ditujukan untuk pengaturan grid/tampilan berupa kolom dan baris.
  • bootstrap-grid.min.css - isinya sama dengan bootstrap-grid.css hanya saja spasi dan enter dalam kodenya sudah dihilangkan.
  • bootstrap-reboot.css - seperti namanya yaitu reboot atau "mengulang" artinya isi dari file ini adalah mengulang semua bentuk dari element yang ada di web. Didalam file ini tidak digunakan class-class tetapi langsung menggunakan nama tag element seperti html,body,article, aside, hr, dll.
  • bootstrap-reboot.min.css - isi file ini sama halnya dengan bootstrap-reboot.css hanya saja spasi dan enter sudah dihilangkan.


Jika anda orang yang baru belajar menggunakan bootstrap maka anda pasti bertanya-tanya file mana yang harus anda gunakan. Jadi untuk pengguna baru sebaiknya anda menggunakan bootstrap.min.css, karena ukuran yang kecil serta tidak mudah untuk merubah kode-kode di dalamnya.

Perbedaan antara Bootstrap.js, Bootstrap.min.js, Bootstrap-bundle.js, dan Bootstrap-bundle.min.js

Pada folder js pada bootstrap terdapat 4 file yaitu :



  • bootstrap.js - file javascript utama dalam folder js bootstrap. File menghimpun semua fungsi-fungsi yang bootstrap butuhkan.
  • bootstrap.min.js - isi dari file ini sama dengan bootstrap.js yang membedakan spasi dan enter file ini sudah dihilangkan. File ini yang paling sering dipanggil ketika ingin menggunakan js bootstrap sebab ukurannya lebih kecil sehingga kecepatannya tentu bertambah.
  • bootstrap.bundle.js - ini berisi kode js yang mana sudah terinclude dengan popper yaitu sebuah librari js.
  • bootstrap.bundle.min.js - isinya sama dengan bootstrap.bundle.js hanya spasi dan enter dihilangkan.


Sama halnya seperti dalam memilih css, ketika memilih js bootstrap anda sebaiknya menggunakan bootstrap.min.js, karena file ukurannya lebih kecil dan tentunya cepat.


Label:

Komentar

Posting Komentar

Postingan populer dari blog ini

Panduan Rinci Cara Membuat Website

Website adalah suatu kumpulan halaman berbentuk digital yang dapat diakses menggunakan perangkat lunak yang disebut Browser, dengan bantuan jaringan Internet. Penjelasan mengenai apa itu website telah dijelaskan sebelumnya di dalam postingan : Mengenal Apa Itu Web dan Hal yang Perlu di Perhatikan dalam Membangun Web . Didalam postingan tersebut sudah dijelaskan apa saja yang perlu diperhatikan dalam pembuatan web atau website. Selanjutnya pada postingan ini akan dijelaskan secara rinci bagaimana cara membuat sebuah website. Sebelum membuat sebuah website anda harus memutuskan terlebih dahulu akan membuat website seperti apa. Jika anda sudah menentukan tema web anda sekarang anda perlu menentukan aplikasi apa yang ingin anda gunakan. Apakah anda akan membuatnya secara native, menggunakan framework, atau menggunakan CMS. Pada postingan ini yang dijelaskan adalah langkah-langkah membuat sebuah website baik secara native, framework, ataupun menggunkan CMS. Silahkan anda simak langkah demi ...
Posting Komentar
Baca selengkapnya

Mengenal Sejarah Bahasa Pemrograman C++

C++ merupakan bahasa pemrograman tingkat menengah yang banyak dijadikan sebagai dasar pembelajaran dalam dunia pemrograman. Bahasa ini bisa dibilang mudah dipelajari sebab sudah menggunakan bahasa yang mirip dengan bahasa manusia dibandingkan dengan bahasa Assemble yang merupakan bahasa tingkat rendah. Salah satu keunggulan dari bahasa ini adalah kecepatannya dalam melakukan kompilasi kedalam bahasa mesin, selain itu bahasa c++ banyak dijadikan sebagai acuan untuk bahasa-bahasa pemrograman baru. Sejarah Awal Pembuatan Bahasa Pemrograman C++ Bahasa C++ dibuat oleh Bjarne Stroustrup yaitu seorang ilmuwan komputer dan profesor di bidang ilmu komputer di Texas A&M University. Profesor yang berasal dari Denmark ini dulunya tergabung dalam Computer Research Institute of Cambridge University dimana dia menghabiskan hari-harinya mengabdikan diri untuk meneliti perangkat lunak yang berjalan pada sistem terdistribusi. Sistem terdistribusi merupakan sistem dimana banyak komputer yang terhubu...
Posting Komentar
Baca selengkapnya

Mengenal Apa itu Android Studio

Android Studio merupakan tools IDE ( Integrated Development Environment ) yang digunakan untuk membuat aplikasi android. Fungsi utamanya adalah sebagai editor yang menyediakan berbagai kebutuhan dalam membangun aplikasi android seperti widget, library, dll. Android Studio versi terbaru telah mendukung 2 bahasa pemrograman yaitu Java dan Kotlin. Sebelumnya hanya mendukung bahasa Java. Android Studio hadir sebagai pengganti Eclipse ADT ( Android Development Tools ) yaitu tools utama sebelumnya. Tools Android Studio ini dibangun di atas aplikasi yang sudah populer sebagai editor programer yaitu JetBrains IntelliJ IDE. Selain itu Android Studio di lengkapi dengan Emulator sendiri. Sama halnya seperti Eclipse, Android Studio juga memerlukan SDK ( Software Development Kit ) untuk membangun aplikasi android. Bedanya Android Studio didukung penuh oleh Google sebagai pengembangnya serta menggunakan grandle dalam melakukan build. Baca juga : Perbedaan Membuat Aplikasi Android Menggunakan Ecli...
Posting Komentar
Baca selengkapnya