Dalam pembuatan website dan pengembangan website tentunya tidak hanya membutuhkan kemampuan dasar menampilkan interface dengan HTML dan pengolahan data agar dinamis, PHP misalnya. Namun, perlu ada tambahan beberapa hal supaya web terlihat lebih rapi dan enak dipandang. Maka dari itu, perlu pengetahuan tentang CSS dan JS ( JavaScript ).
Namun, muncul permasalahan lain. Tidak semua orang mampu memahami langsung tambahan-tambahan dalam pembuatan website. Akhinya muncullah solusi dari masalah ini yaitu menggunakan template. Template sendiri merupakan kumpulan dari berbagai baris kode yang dikumpulkan jadi satu dan cukup memanggilnya bila diperlukan.
Salah satu template yang lumayan banyak digunakan dalam pembuatan web dengan Laravel adalah Bootstrap. Dengan bootstrap, UI yang dibuat menjadi lebih rapi bahkan menjadi solusi saat muncul permasalah responsivitas. Cukup menggunakan fitur grip yang ada di dalam bootstrap, masalah selesai! 😁
Beberapa hal yang didukung oleh bootstrap dalam pengembangan web antara lain :
- Navigasi
- Form
- Tombol
- Sistem Grid
- Modal Dialog
- Thumbnail
- Breadcrumb
- Jumbotron
Bootstrap biasanya tidak include langsung dalam projek Laravel. Ini merupakan file terpisah yang perlu di unduh mandiri melalui website resminya
Website Resmi Bootstrap | Unduh Langsung
Terdapat dokumentasi lengkap tentang bagaimana menggunakan bootstrap juga di dalam website resminya
Penggunaan template inipun terbilang sangat mudah, tidak perlu konfigurasi banyak hal. Kemudian cukup menyertakan atribut class di markah atau tag HTML yang akan diberi polesan UI berbeda.
Cukup dengan menyertakan fail bootstrap, baik via CDN atau langsung di tempel ( simpan ) dalam projek. Maka Laravel siap langsung menggunakan berbagai fitur yang dimiliki oleh bootrstrap. Dan yang paling penting semua fitur yang dimiliki oleh bootstrap bisa di akses gratis.
Dengan CDN letakkan di dalam markah <head> dan </head>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Peletakan Bootstrap CDN</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
</head>Sedang untuk langsung tempel ( simpan )
Setelah itu, eksekusi program Laravel dengan bootstrap siap dilakukan 😎
Bagaimana ?
Tertarik mencoba menggunakan bootstrap !?