Pelatihan 5: Memulai Frontend dengan Bootstrap

Rabu, 06 Oktober 2021. Dikantor Mediatech Lombok Solution. Materi hari ini merupakan bagian dari Web Development. Pemateri hari ini yaitu M. Hafizul Khaeri  & M. Rizalul Umami yang saat ini menjadi Web Developer di Mediatech Lombok Solution membawakan materi tentang Bootstrap.

Aktivitas peserta saat mengikuti kegiatan. Sumber: Dokumentasi Pribadi

Bootstrap merupakan salah satu library framework CSS yang telah dibuat khusus uintuk mempermudah pengembangan 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.

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. 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 frame nya memang bisa digunakan sesuai keinginan dan bebas saja. Kita bisa lebih mudah untuk memodifikasikan berbagai script yang telah ada didalamnya. Tidak ada ketentuan khusus untuk memanfaatkan framework ini.

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.

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.

Penyampaian Materi Pelatihan. Sumber: Dokumen Pribadi

Dalam pelatihan kelima ini, peserta magang akan dibantu memaksimalkan tampilan User Interface Website yang dimilikinya dengan memanfaatkan framework bootstrap. Selain mudah dan cepat, juga tentunya lebih aman dan maintainable.

Sumber : https://qwords.com/blog/apa-itu-bootstrap/

About Harrylicious

An IT Enthusiast. Founder Sanggar IT Lombok & Agromina.id. System Analyst. Android Programmer. IT Consultant. Writer on blog.lombokit.com

Leave a Reply

Your email address will not be published. Required fields are marked *