Belajar membuat Toko Online dengan menggunakan Boostrap v5.0

Apa itu Bootstrap?

 

Bootstrap  merupakan framework paling populer di dunia untuk pengembangan web yang lebih cepat dan lebih mudah. Ini termasuk template desain berbasis HTML dan CSS untuk membuat komponen antarmuka pengguna yang umum seperti membuat form, container, navigasi, dropdown, alert, modals, tab, akordeon, carousel, tooltips, dan sebagainya.

Dengan Bootstrap pekerjaan anda ketika membuat suatu desain Front end website jadi lebih mudah dan lebih cepat,

Bootstrap awalnya dibuat oleh seorang desainer dan pengembang di Twitter pada pertengahan 2010. Sebelum menjadi kerangka kerja bersumber terbuka, Bootstrap dikenal sebagai Cetak Biru Twitter.

Anda dapat menghemat banyak waktu dan tenaga ketika membuat suatu desain website.

Yang Dapat Anda Lakukan dengan Bootstrap Versi 5

 

Ada lebih banyak hal yang dapat Anda lakukan dengan Bootstrap.

• Anda dapat dengan cepat membuat navigation menu
• Anda dapat dengan mudah membuat komponen seperti akordeon, modals, dll. Tanpa menulis kode JS apa pun.
• Anda dapat dengan mudah membuat tab dinamis untuk mengelola konten dalam jumlah besar.
• Anda dapat dengan mudah membuat keterangan alat dan popovers untuk menampilkan teks petunjuk.
• Anda dapat dengan mudah membuat korsel atau penggeser gambar untuk menampilkan konten Anda.
• Anda dapat dengan cepat membuat berbagai jenis kotak informasi peringatan
• Anda dapat dengan mudah membuat situs web yang responsif.
• Anda dapat dengan cepat membuat tata letak multi-kolom dengan kelas yang telah ditentukan sebelumnya
• Anda dapat dengan cepat membuat berbagai tipe tata letak formulir.

Manfat yang di dapat Ketika menggunakan  Bootstrap

Jika Anda sebelumnya pernah menggunakan kerangka kerja front-end apa pun, Anda mungkin bertanya-tanya apa yang membuat Bootstrap begitu istimewa. Berikut  keuntungan yang akan anda dapat ketika akan menggunakan Bootstrap:

• Menghemat banyak waktu – Anda dapat menghemat banyak waktu dan tenaga menggunakan template dan kelas desain Bootstrap yang telah ditentukan sebelumnya dan berkonsentrasi pada pekerjaan pengembangan lainnya.
• Fitur responsif – Dengan menggunakan Bootstrap Anda dapat dengan mudah membuat situs web responsif yang muncul lebih tepat pada perangkat dan resolusi layar yang berbeda tanpa perubahan markup.
• Desain yang konsisten – Semua komponen Bootstrap berbagi template dan gaya desain yang sama melalui perpustakaan pusat, sehingga desain dan tata letak halaman web Anda akan konsisten.
• Mudah digunakan – Bootstrap sangat mudah digunakan. Siapapun dengan pengetahuan dasar HTML, CSS dan JavaScript dapat memulai pengembangan dengan Bootstrap.
• Kompatibel dengan browser – Bootstrap dibuat dengan mempertimbangkan browser web modern dan kompatibel dengan semua browser modern seperti Chrome, Firefox, Safari, Internet Explorer, dll.
• Open Source – Dan bagian terbaiknya adalah, ini sepenuhnya gratis untuk diunduh dan digunakan.

 

Kursus Website

Kursus React 

 

Cara menggunakan Bootstrap Online

untuk menggunakan Boostrap online kita harus akses terlebih dahulu situs resmi dari Bootstrap https://getbootstrap.com/docs/5.0/getting-started/introduction/

 

Kemudian Klik menu Introduction

untuk lebih jelasnya seperti gambar seperti di bawah ini:

kemudian silahkan copy script html nya ,

 

Langkah selanjutnya buka text editor anda , disini saya. menggunakan Visual studio Code:

kemudian buat folder dengan nama Boostrap

 

selanjutnya buat file dengan nama index.html

 

langkah selanjutnya kita lihat dlu di browser apakah css dan js nya sudah berhasil ke load , bagi temen-temen yang menggunakan versi CDN Pastikan ada koneksi internet ya , karena kita menggunakan versi online

 

berikut tampilan di browser