Cara Menggunakan Framework Bootstrap
Di Artikel kali ini kita akan membahas sedikit tentang framework Bootstrap
APA ITU BOOTSTRAP ???
APA YANG HARUS DISIAPKAN SEBELUM MENGGUNAKAN BOOTSTRAP ??
BAGAIMANA CARA MENGGUNAKANNYA ?
Okeee langsung saja kita bahas … .. .
APA ITU BOOTSTRAP ??
BOOTSTRAP ITU APAA SIH ?? , Bootstrap adalah sebuah framework CSS , yang diadalamnya terdapat banyak “CLASS” ,yang dapat kita gunakan atau kita panggil pada saat kita membuat sebuah layout , dengan menggunakan framework BOOTSTRAP , tugas kita sebagai web developer saat melayout sebuah halaman WEB , akan terasa lebih mudah , karna kita hanya perlu memanggil “CLASS” atau copas source code untuk membuat fungsi tertentu yang disediakan oleh framework BOOTSTRAP .
APA YANG HARUS DISIAPKAN SEBELUM MENGGUNAKAN BOOTSTRAP ??
Sebelum anda menggunakan framework BOOTSTRAP , ada baiknya anda terlebih dulu menguasai atau mampu melayout dengan menggunakan CSS native , selain itu anda juga harus paham tentang javascript dan Jquery , meskipun di dalam BOOTSTRAP 5 sudah tidak menggunakan lagi Jquery ,dan diganti dengan menggunakan Javascript Modern , minimal anda pernah melayout dengan menggunakan CSS native dan javascript , jika anda pernah membuat sebuah navbar yang responsive di berbagai ukuran layar menggunakan CSS flexbox,JS dan Jquery anda akan terbayang betapa banyak sekali baris code CSS yang harus dibuat , dan harus menambahkan baris code Javascript lalu menghubungkan ke Jquery , dengan menggunakan BOOTSTRAP anda cukup copy paste “CLASS” atau code yang di sediakan oleh BOOTSTRAP ,
tujuan menggunakan framwork adalah agar memudahkan kita sebagai web developer dalam mengerjakan suatu projeck , bukan malah menjadi rumit , begitu juga jika anda menggunakan framework lain seperti framework Codeigniter/Laravel dll pada bahasa pemrograman PHP , sebelum anda menggunakan framework Codeigniter/Laravel dll, anda diwajibkan harus paham dasar – dasar memprogram menggunakan PHP Native , minimal anda sudah pernah membuat program menggunkan PHP yang berorientasi dengan objeck dan paham tentang MVC (Model View Control) , karna jika kita tidak cukup menguasai dasar – dasarnya dan tetap berambisi ingin menggunakan framework maka saya yakin , akan menjadi sangat sulit , intinya adalah kuasai dulu CSS dan Javascript ,lalu coba menggunakan framework BOOTSTRAP untuk memudahkan dalam mengerjakan sebuah projeck .
BAGAIMANA CARA MENGGUNAKANNYA ?
Untuk menggunakan BOOTSTRAP anda harus mengunjungi website BOOTSTRAP , https://getbootstrap.com ini untuk bootstrap versi 4 ,https://v5.getbootstrap.com ini untuk bootstrap versi 5 , sedikit info bahwa pada bootstrap versi 5 ini sudah tidak lagi menggunakan Jquery sebagai library dari Javascript ,
Untuk menggunakan atau agar dapat terhubung ke BOOTSTRAP ,ada 2 cara yaitu secara online ataupun secara offline .
- Cara Online
setelah kita masuk kehalaman utama bootstrap , pilih menu dokumentasi dinavbar dan pilih start template , setelah itu anda tinggal copas HTML start template yang disediakan bootstrap , dengan cara ini anda sudah terhubung kebootstrap dengan cara online , artinya jika anda ingin membuka halaman yang anda copas start template langsung dari bootstrap , harus terkoneksi dengan internet, - Cara Offline
jika anda ingin tetap bisa menggunakan bootstrap tanpa harus terhubung dengan internet , anda bisa download semua file yang terhubung didalam halaman file HTML dari bootstrap .
jika sudah terhubung dengan cara Online ataupun secara Offline , selanjutnya tinggal cari apa yang anda butuhkan pada menu dokumentasi di navbar, hal ini untuk mengetahui “Class” mana yang ingin anda pakai atau source code mana yang ingin anda copas , sebagai contoh jika anda ingin membuat sebuah navbar yang responsive , anda bisa seacrh Navbar , lalu akan muncul berbagai macam navbar yang bisa anda gunakan , dan anda tinggal copas source code yang sudah disediakan , semua navbar yang ada di BOOOTSATRAP, sudah responsive diberbagai ukuran layar dan anda tidak perlu menggunakan tambahan CCS lagi , kecuali jika memang ingin ada bebrapa element yang harus diubah stylenya seperti warna atau background color , karna BOOTSTRAP versi 4 memang cukup terbatas dalam pilihan warna , mungkin hanya ada beberapa saja seperti bg-primary,bg-secondadry,bg-success,bg-dark,bg-warning, bg-danger untuk warna background , begitu juga dengan warna font yang cukup terbatas, jadi jika anda ingin mengubah warna pada font yang disediakan BOOTSTRAP bisa saya contohkan seperti ini , “ < p Class=”text-dark”>www.fajarekapratama.my.id/< /p> “ jika menggunakan Class “text-dark” , maka warna fontnya akan berubah menjadi warna dark . atau jika ingin mengubah warna background bisa saya contohkan seperti ini ,
< div Class=”container bg-warning”>
< b>belajar bootstrap< /b>
< h5>https://www.fajarekapratama.my.id< /h5>
< /div>
Jika kita memberikan Class bg-warning pada div , maka background colornya akan berwarna kuning . Pada saat kita menggunakan BOOTSTRAP , kita diwajibkan untuk selalu membaca dokumentasi pada website bootstrap , kecuali jika anda sudah hafal Class – Class yang anda akan panggil , itu tidak diwajibkan , tapi untuk seorang yang baru mencoba menggunakan BOOTSTRAP pada pembuatan projecknya maka saya sarankan untuk selalu membaca dokumentasinya .
Okee saya rasa cukup disini dulu pembahaasan tentang belajar bootstrap dan terima kasih sudah membaca artikel ini .
Komentar
Posting Komentar