Welcome to Hakim Official!

Make sure to SUBSCRIBE Hakim Nurubay channel guys



SUBSCRIBE !

October 21, 2020

Artikel ini telah dikunjungi 951×


Apa itu Bootstrap? Pengertian dan Fungsinya itu apaansih?


thumbnail

Bootstrap merupakan sebuah library framework CSS yang telah dibuat khusus untukmengembangkan front end sebuah website. Bootstrap juga dikenal sebagai salah satu framework CSS, HTML, Javascript yang begitu populer di kalangan website developer atau pengembang website. Apa itu bootstrap dan fungsinya? yang pasti bootstrap digunakan untuk mengembangkan website agar lebih responsive.


Dengan adanya bootstrap tersebut tentu saja membuat halaman website bisa menyesuaikandengan ukuran monitor device. Baik jika di akses lewat ponsel, tablet ataupun desktop. Awal mulanya, bootstrap sendiri bernama Twitter Blueprint.

DomaiNesia

Ini dulunya diciptakan dan dikembangkan oleh Jacob Thornton dan Mark Otto yang ada di Twitter untuk perangkat kerja yang bisa mendorong konsistensi pada alat internalnya. Dengan memakai bootstrap tentu saja seorang developer bisa lebih mudah dan cepat untuk membuat front end dalam sebuah website itu sendiri.

Banyaknya user yang menggunakan library di framework mengharuskan adanyaperubahan di berbagai aspek. Hal ini menurunkan konsistensi framework dan menjadi kelemahan tersendiri. Bootstrap pun hadir dan menjawab permasalahan ini.

Dikutip dari Hostinger.co.id Bootstrap adalah framework open-source khusus front end yang awalnya dibuat oleh Mark Otto dan Jacob Thornton untuk mempermudah dan mempercepat pengembangan web di front end.

Menurut para ahli mengatakan bahwa, Bootstrap adalah kerangka kerja front-end gratis untuk pengembangan web yang lebih cepat dan mudah. Mudah digunakan dan siapa saja yang memiliki pengetahuan dasar tentang HTML dan CSS dapat mulai menggunakan Bootstrap.

Dikutip dari Wikipedia Bootstrap adalah kerangka kerja CSS yang sumber terbuka dan bebas untuk merancang situs web dan aplikasi web. Kerangka kerja ini berisi templat desain berbasis HTML dan CSS untuk tipografi, formulir, tombol, navigasi, dan komponen antarmuka lainnya, serta juga ekstensi opsional JavaScript.

Sampai saat ini Bootstrap telah di rilis sampai versi 4. Bagi Kalian ingin menggunakan Bootstrap bisa Klik di sini. Nah untuk Bootstrap yang saya gunakan pada website saya yaitu Bootstrap versi 3.4.1 Oke mari Kita lanjut lagi ke beberapa file utama seperti yang akan disebutkan dibawah ini.


Baca juga : Cara menggunakan Bootstrap

3 File Utama Bootstrap

Bootstrap berisikan sekumpulan sintaks yang menjalankan fungsispesifik, Bootstrap memiliki berbagai tipe file di dalamnya. Berikut tiga file utama yang mengelola interface user dan fungsionalitas website.

Bootstrap.css

Bootstrap.css adalah framework yang mengatur dan mengelola layout website. HTML mengatur konten dan struktur halaman web, sedangkan CSS berurusan dengan layout situs. Oleh karena itu, kedua struktur ini harus bekerja bersama-sama untuk melakukan tindakan tertentu.

Dengan CSS, Anda bisa menghadirkan tampilan yang seragam di banyak halaman website. Semua ini berkat keberadaan fungsinya. Anda pun tak perlu lagi menghabiskan waktu berjam-jam lamanya hanya untuk mengubah, misalnya, lebar desain.

Jika menggunakan CSS, yang perlu dilakukan adalah merujuk atau mengarahkan halaman web ke file CSS. Nantinya semua perubahan dapat dilakukan di satu file saja.

Fungsi CSS tidak terbatas hanya di gaya teks saja, tetapi juga dapat digunakan untuk membuat aspek lainnya di halaman web, seperti tampilan tabel dan gambar.

Bootstrap.js

File ini merupakan bagian inti dari Bootstrap. Di dalamnya terdapat file JavaScript yang bertanggung jawab atas interaktivitas website.

Developer menggunakan jQuery untuk menghemat waktu karena tidak perlu menulis sintaks JavaScript berulang kali. jQuery sendiri adalah open source yang populer dan juga library JavaScript lintas platform yang memperbolehkan usernya untuk menambah berbagai fungsionalitas ke website.

Berikut contoh fungsi dan kegunaan jQuery:

  • Menjalankan permintaan Ajax, seperti mengurangi (subtract) data dari lokasi lain secara dinamis.
  • Membuat widget menggunakan koleksi plugin JavaScript.
  • Membuat animasi menggunakan CSS property.
  • Membuat konten website terlihat lebih dinamis.

Walaupun Bootstrap dengan CSS property dan elemen HTML-nya bisa berfungsi normal, tetap saja framework ini mebutuhkan jQuery untuk membuat desain yang responsif. Jika tidak, Anda hanya bisa menikmati CSS yang statis dan datar.

Keunggulan Bootstrap

Setelah tahu apa itu bootstrap dan juga fungsinya untuk website, kini Anda juga harus tahu apa saja keunggulan menggunakan bootstrap ini. untuk Anda yang ingin menggunakannya, berikut beberapa keunggulan yang ditawarkan:

1. Lebih efisien waktu

Bootstrap sendiri menyediakan banyak sekali library yang isinya berbagai macam script yang sudah siap saji untuk dipakai oleh programmer ketika mengembangkan website bagian depan. Sehingga pihak developer tidak lagi membuat waktu untuk menulis berbagai script SCC dari awal. Tentu dengan memakai potongan script tersebut, maka akan sangat menguntungkan untuk website.

Struktur website bisa lebih produktif di tangan seorang programmer handal tadi. Perlu Anda tahu bahwa bootstrap versi terbaru sudah dibangun dengan fitur LESS. Yang artinya, bootstrap mempunyai banyak aspek menguntungkan dalam hal website desain sehingga sangat mempermudah para programmer.

2. Lebih fleksibel

Penggunaan bootstrap website juga membuat pekerjaan developer dan programmer bisa lebih fleksibel. Ya karena framenya memang bisa digunakan sesuai keinginan dan bebas saja. Anda bisa lebih mudah untuk memodifikasikan berbagai script yang telah ada didalamnya. Tidak ada ketentuan khusus untuk memanfaatkan bootstrap twitter ini.

Hal inilah yang membuatmu lantas bisa berkreasi dalam bentuk sesuai keinginan dengan memanfaatkan berbagai macam tool yang sudah ada di bootstrap twitter itu sendiri. Inilah yang membut para pengembang lebih fleksibel ingin membangun website yang ia miliki.

3. Desain yang oriented

Bootstrap untuk keperluan website umumnya mempunyai sebuah sistem baku yang sangat bagus, sistem ini disebut dengan nama grid sistem. Grid merupakan sebuah struktur dua dimensi yang menjadi perpaduan antara sumbu vertikal dan juga horizontal yang membentuk kolom serta baris. Kolom dan baris tersebut lantas merepresentasikan dimensi yang telah tersedia di sebuah browser.


Baca juga: Apa itu JavaScript?


Untuk versi awalnya, bootstrap ini menyediakan grid yang ukuran layarnya adalah 940px dan juga margin 20px. Namun untuk era sekarang, ukuran bootstrap sendiri juga sudah mempunyai ukuran yang cukup lebar karena layarnya 768px sampai 1200px. Tentu saja ukuran tersebut bisa dimodifikasi oleh para penggunanya sendiri.

Model untuk mengatur desainnya memang diatur dengan sistem yang sudah otomatis. Sehingga para developer tinggal melakukan pemanggilan kelas CSS dan juga meletakkan konten di script dan juga sintaks HTML yang telah dikerjakan sebelumnya.

4. LESS is More

Ini merupakan hal yang begitu populer di kalangan programmer dan juga web developer karena alasan tertentu. Alasan tadi adalah kaitannya dengan fungsi responsive yang dimiliki oleh bootstrap itu sendiri. Dengan memakai bootstrap ini website yang Anda miliki juga lebih responsive dan bisa ditampilkan untuk semua website dengan baik.

5. Javascript

Di dalam bootstrap sendiri sudah dilengkapi dengan yang namanya Library JavaScript yang sesuai dengan struktur dari bahasa pemrograman Javascript standar. Tentu saja dengan adanya komponen tersebut akan membuat website bisa lebih powerfull dibanding sebelumnya.

Kesimpulan

Bootstrap adalah framework front-end gratis yang belakangan ini semakin populer di kalangan front-end developer. Selain mudah digunakan, framework ini juga mempersingkat pekerjaan developer sehingga tidak perlu menulis sintaks secara manual dan berulang kali.

Framework ini juga fleksibel dan mendukung hampir semua keperluan pengembangan front-end website. Fungsi Bootstrap tidak terbatas pada tampilan website yang menarik saja, tapi juga memberikan fitur responsif agar halaman website bisa bekerja secara optimal di semua ukuran layar perangkat.

Sekarang Anda sudah mengetahui pengertian Bootstrap dan cara menggunakannya. Inilah saatnya kalian untuk mulai memakainya!

Jika Kalian ingin Request membuat artikel, silakan tuliskan di kolom komentar di bawah ini!
Sekian dari saya. Terima Kasih telah berkunjung ke artikel ini.
kunjungan anda adalah Tamu Kami!
Salam !DOCTYPE

Avatar
𝓗𝓪𝓴𝓲𝓶 Nurubay

I'm a beginner web programmer, and I like to learn new things, and my passionate is about Music. you can subscribe to My YouTube Channel Hakim Nurubay. Thank you for you guys who have subscribed My YouTube Channel, and I'm glad for it. Greetings !DOCTYPE


Apa itu JavaScript? Pengertian dan Fungsinya itu apaansih? apakah JavaScript Punya Sejarah?


JavaScript adalah bahasa pemrograman tingkat tinggi dan dinamis.
Read More


Apa itu HTML? apakah HTML Punya Sejarah? apa Perbedaannya HTML dengan HTML5?


Hypertext Markup Language adalah bahasa markah standar untuk dokumen yang dirancang untuk ditampilkan di peramban internet.
Read More


Apa itu CSS? Pengertian dan Fungsinya itu apaansih? Apakah ada Sejarahnya about CSS?


CSS atau Cascading Style Sheet merupakan aturan untuk mengatur beberapa komponen dalam sebuah web
Read More


6 Rekomendasi Aplikasi Edit Foto Terbaik dan Terbaru untuk Smartphone Tahun 2021


Berikut ini 6 rekomendasi aplikasi edit foto terbaik yang bisa Kalian coba
Read More


Flag Counter

ads

ads



DomaiNesia

Related Posts


posts

Pengertian dan Cara Menggunakan Bootstrap

Seperti yang kalian ketahui Bootstrap adalah kerangka kerja CSS yang sumber terbuka dan bebas untuk merancang situs web dan aplikasi web.

Lihat

posts

Cara Membuat Website Sederhana Hanya dengan HTML dan CSS saja!

seperti yang kalian ketahui HTML adalah singkatan dari Hypertext Markup Language. kalian di sini akan melihat tutorial membuatnya.

Lihat

posts

Cara Embed Website ke halaman Website Sendiri Responsive

Kalian ingin meng-Embed sebuah website ke halaman website Kalian sendiri, dan Kalian tidak tahu cara membuatnya? di sini saya akan memberi tahu caranya meng-Embed Website

Lihat

posts

Cara Embed Video YouTube AutoPlay Terbaru ke halaman Website Sendiri Responsive

Kalian ingin meng-Embed video YouTube kalian ke sebuah halaman website? dan juga ingin membuatnya AutoPlay? Yuk Sini saya beri source code nya!

Lihat