Minggu, 01 Oktober 2017

Cara Penggunaan Framework

Apa itu bootstrap?

Bootstrap adalah platform baru yang dikembangkan tim twitter. Pertama kali muncul pada ajang hackweek dan kini sudah mulai penyempurnaan. Platform ini hanya menggunakan sedikit coding CSS dan JavaScript namun tetap bisa membuat website yang powerfull mengikuti perkembangan browser. Website yang menggunakan bootstrap akan menjadi website yang fleksibel, nyaman dan tentu saja cepat.

Bootstrap juga memudahkan pengaturan website bagi mereka yang kurang mahir coding atau tidak punya waktu banyak. Sekumpulan javascript dan CSS yang dibutuhkan untuk banyak sekali widget ada dalam satu file yang terus di update oleh pengembang. Pemilik website tidak akan lagi disibukkan dengan pengaturan css atau javascript berlebihan. Mereka hanya perlu menentukan gadget atau elemen apa yang ingin ditampilkan dalam bentuk HTML standart bootstrap yang sangat simple.

OK. Cukup segitu aja. untuk selengkapnya silahkan baca2 di wiki..atau web resminya.

Sekarang kita lanjut ke tutorial cara penggunaan bootstrap.

1. Download dulu bootstrapnya Disini. versi terbaru untuk saat ini yaitu bootstrap 3.2

2. Ektrak dan taruh dalam satu folder. biarkan strukturnya seperti dibawah ini.

3. Buka text editor seperti notepad, notepad++ ,sublime text dsb.

yang dikira nyaman aja di pake, kalau saya sendiri menggunakan notepad++(karena sekarang cuma ada itu, biasanya pake sublime )


4. klik New dan buat tag html,head,body seperti biasa.


5. Klik Simpan(CTRL+S) lalu tempatkan di file bootstrap yang sudah di ektrak tadi. beri nama
misalkan latihan.html


6. Nah sekarang kita panggil CSS bootstap dengan perintah eksternal.
Apa itu perintah external? baca2 dulu disini.


7. Masukkan code berikut diantara tag <head> dan </head>


Sehingga akan terlihat seperti ini.


bootstrap

8. Setelah itu masukkan code berikut diatas tag </body>


Penampakannya akan seperti berikut ini.

bootstrap
9. Sekarang Kita buat tulisan di diantara tag <body> dan </body>
Ex:

Tampilan HTML biasa tanpa bootstrap

Tampilan HTML yang sudah menggunakan bootstrap

itulah tutorial sederhana cara menggunakan bootstrap untuk pemula. Adapun keuntungan apabila kita menggunakan framework css bootstrap adalah kita tidak perlu repot-repot lagi mendesain web dengan css dari awal, cukup gunakan class-class yang sudah di sediakan oleh bootstrap.