Apa Bootstrap dan Bagaimana Cara Menggunakannya?

0
2

goddessmystic – Jika Anda memiliki minat dalam pengembangan Design Online dalam web, Anda mungkin pernah mendengar tentang Bootstrap. Menurut situs web resmi, Bootstrap adalah framework HTML, CSS, dan JS paling populer untuk mengembangkan proyek-proyek pertama yang responsif dan mobile di web. Kedengarannya hebat! Sekarang bagaimana saya menggunakannya?

Akan lebih mudah untuk mengirim Anda ke halaman Getting Started dan menyebutnya sehari. Panduan penyiapannya memang sejumlah informasi yang berguna – tautan ke CDN, penjelasan tentang cara memasang dengan Bower, npm, dan Komposer, informasi tentang integrasi dengan Autoprefixer dan LESS, sekumpulan template, lisensi, dan terjemahan – tetapi tentu saja bukan panduan langkah demi langkah untuk memulai (yang sangat mungkin dalam semangat autodidactism).

Ketika saya menemukan Bootstrap beberapa tahun yang lalu, desain responsif masih mendapatkan popularitas, dan belum tentu norma yang diharapkan. Setelah hanya membuat situs web dari awal, saya sedikit bingung tentang seluruh konsep kerangka kerja. Saya membayangkan itu bahkan lebih membingungkan untuk pemula yang sekarang diharapkan untuk belajar konsep desain responsif dan perpustakaan Bootstrap dan JavaScript, selain HTML, CSS, dan JS.

Panduan ini dimaksudkan sebagai tampilan pertama ke Bootstrap untuk pemula, jadi tidak akan masuk ke integrasi KURANG dan Sass, yang merupakan konsep menengah / lanjutan. Meskipun ini ditulis untuk versi Bootstrap 3 yang stabil saat ini, konsepnya akan tetap sama untuk versi yang akan datang.

Mengapa kerangka kerja itu penting? Apakah saya perlu menggunakannya?
Anda benar-benar tidak perlu menggunakan kerangka kerja – saya baru-baru ini menulis sebuah artikel yang berjudul Anda Tidak Perlu Kerangka: Memahami Dasar-dasar Desain Responsif, yang saya sarankan baca jika Anda ingin mempelajari lebih lanjut tentang desain responsif. Namun, kerangka kerja sangat populer dan memiliki banyak manfaat, jadi penting untuk belajar cara bekerja dengan mereka.

Beberapa cara yang dapat membantu kerangka kerja Anda:

Cegah pengulangan antar proyek
Manfaatkan desain responsif agar situs web Anda dapat beradaptasi dengan berbagai ukuran layar – seluler, desktop, dan segala sesuatu di antaranya
Tambahkan konsistensi untuk desain dan kode antar proyek dan antar pengembang
Cepat dan mudah prototipe desain baru
Pastikan kompatibilitas antar-browser
Secara umum, setiap proyek web yang Anda kerjakan harus responsif dan berfungsi dengan baik pada semua browser utama, dan kemungkinan memiliki beberapa fallback untuk browser yang lebih lama. Bootstrap memiliki komunitas sumber terbuka besar yang berfungsi untuk menutupi ini sehingga Anda tidak perlu melakukannya. Selain itu, ketika beberapa pengembang semua tahu sistem yang sama, mereka dapat bekerja dalam keharmonisan yang lebih baik – dan itu juga mempermudah pendatang baru dalam proyek untuk mendapatkan kecepatan.

Grid mungkin merupakan salah satu aspek paling penting dari framework. Ini adalah dasar di mana seluruh tata letak dibuat. Selain itu, CSS inti Bootstrap juga akan menambahkan gaya yang bermanfaat untuk bentuk, tabel, tombol, daftar, dan gambar, serta bilah navigasi yang berfungsi penuh, sementara JavaScript inti akan menambahkan kode bermanfaat untuk membuat modals, komidi putar, lansiran, munculan, tarik-turun , dan akordion.