Cara Cepat Implementasi Bootstrap dengan CDN

Assalamualaikum warahmatullahi wabarakaatuh, Alhamdulillah segala puji bagi Allah ta'ala yang telah memberikan nikmat dan rezekinya sehingga admin dapat kembali hadir memberikan tutorial-tutorial yang InsyaAllah bermanfaat bagi kita semua.

Kali ini admin akan membahas salah satu framework yang terkenal, framework ini biasa digunakan untuk menangani tampilan pada sebuah website, framework apa itu ? yaitu, Bootstrap

Bootstrap

Bootstrap adalah opensource framework yang biasa digunakan untuk menangani tampilan antar muka pengguna, atau bisa kita sebut front-end framework, jadi framework ini berbeda dengan Codeigniter ataupun laravel yang mana digunakan sebagai fraweork back-end. Framework ini berisi template desain berbasis HTML, CSS, dan JS.

Untuk lebih lengkapnya anda dapat langsung berkunjung ke website resminya di https://getbootstrap.com/. Disana dibahas secara lengkap contoh dan dokumentasinya. Tutorial kali ini saya ambil langsung dari websitenya dan saya terjemahkan sesimple mungkin agar para pembaca mudah memahami dan mengimplementasikannya.

Implementasi Bootstrap dengan CDN

Sepanjang yang admin ketahui ada 2 cara menggunakan bootstrap, yang pertama download file bootstrapnya dan disimpan di localhost, atau cara kedua menggunakan CDN. Kali ini admin hanya akan membahas penggunaan bootstrap dengan CDN

• Buat sebuah halaman HTML dengan nama latihan11.html, lalu copy-paste code berikut ini

• Lalu coba kalian jalankan dibrowser, hingga tampilannya seperti di bawah ini

tampilan hello world tanpa bootstrap

• Jika tampilanya seperti di atas, itulah tampilan website yang belum diimplementasi dengan bootstrap. Untuk mengimplemetasikan bootstrap ikuti langkah di bawah ini
• Copy-paste link CSS di bawah ini dan letakkan sebelum tag </head>

• Copy-paste link JS di bawah ini dan letakkan sebelum tag </body>

• Maka script lengkapnya akan seperti di bawah ini

• ctrl+s, lalu jalankan di browser kalian. dan lihatlah hasil yang berbeda dari tampilan sebelumnya.

tampilan hello world dengan bootstrap

Bootstrap menjelaskan bahwa penggunaan CDN adalah cara yang paling mudah. Tertulis di webiste resminya "Looking to quickly bootstrap to your project ? Use BootstrapCDN". Dengan penggunaan CDN kita tidak perlu lagi memasukkan file bootstrap di server kita. CDN memungkinkan mirroring di server cadangan. Tapi perlu akses internet untuk mirroring ke server cadangan tersebut.

Anda juga dapat melihat tutorial mengenai cara penggunaan bootstrap di channel saya. Di video ini saya menjelaskan cara implemetasi bootstrap dengan CDN yang hanya di bawah 5 menit saja.