Header Ads

  • Breaking News

    Implementasi Template Web ke Dalam Project dengan Bootstrap

    Pemrograman Web II - Dalam membuat sebuah website, Bootstrap merupakan sebuah framework yang paling populer di dunia framework. Bagaimana tidak, dengan adanya bootrstap ini membuat tampilan website lebih responsive.

    Perkembangan Bootstrap kini juga telah ada Bootstrap 4. Kini anda tiak perlu khawatir dengan tampilan website anda. Selain itu, hal ini membuktikan bahwa Bootstrap dipercaya dan diterima oleh banyak pengembang. Ini adalah salah satu alasan mengapa Anda harus belajar Bootstrap.

    Bootsrap

    Bootstrap adalah front-end framework atau framework css yang sengaja dibangun untuk memudahkan pendesain web dalam membuat website atau membuat template website.

    Framework yang dulu pernah dikenal dengan twitter bootstrap ini dilengkapi dengan komponen-komponen website yang sering digunakan seperti breadcrumb, pagination, modal dialog, navigation bar dan lain-lain yang sangat memudahkan pendesain web saat membuat webiste.

    Bahkan bootstrap ini selalu diunggul-unggulkan dengan fitur website responsive-nya yang memungkinkan kita cukup membuat satu template website saja dan kita bisa memperoleh template yang bisa dibuka atau kompatibel diberbagai device (laptop, handphone, atau tablet).

    Sejarah Bootsrap

    Bootstrap, awalnya bernama Twitter Blueprint, dikembangkan oleh Mark Otto dan Jacob Thornton di Twitter sebagai kerangka kerja untuk mendorong konsistensi di perangkat internal yang sesuai.

    Sebelum Bootstrap, berbagai pustaka sudah banyak digunakan untuk pengembangan antarmuka, yang menyebabkan tidak konsisten dan beban pemeliharaan yang berat.

    Setelah beberapa bulan pengembangan oleh sebuah kelompok kecil, banyak pengembang di Twitter mulai memberikan kontribusi untuk proyek ini sebagai bagian dari Hack Week, sebuah pekan ala hackathon untuk tim pengembangan Twitter.

    Nama itu diganti dari Twitter Blueprint menjadi Bootstrap, dan dirilis sebagai proyek sumber terbuka pada 19 Agustus 2011. Hal ini terus dipertahankan oleh Mark Otto, Jacob Thornton, dan sekelompok kecil pengembang inti, serta sejumlah besar komunitas dari para kontributor.

    Bootstrap 2 dan 3

    Pada 31 Januari 2012, Bootstrap 2 dirilis, yang menambahkan sistem layout dua belas kolom grid yang responsif, dukungan built-in untuk Glyphicons, beberapa komponen baru, serta perubahan dari beberapa komponen yang sudah ada.

    Pada 19 Agustus 2013, Bootstrap 3 dirilis, yang didesain ulang komponennya untuk menggunakan desain flat, dan pendekatan mobile-first.

    Bootstrap 4

    Pada 29 Oktober 2014, Mark Otto mengumumkan bahwa Bootstrap 4 sedang dalam pengembangan.Versi alfa pertama dari Bootstrap 4 dirilis pada 19 Agustus 2015.

    Pada 6 September 2016, Mark menghentikan pengerjaan Bootstrap 3 dalam rangka untuk meluangkan waktu untuk pengerjaan Bootstrap 4. Sejauh ini, sudah lebih dari 17.500 kommit yang telah dibuat untuk basis kode Bootstrap 4. Versi beta pertama dirilis pada 10 Agustus 2017.

    Manfaat Bootstrap 

    Seperti yang telah dijelaskan oleh penjelasan di atas template website yang dibangun dengan bootstrap sudah responsif sehingga kita cukup membuat satu buah template lengkap saja dan sudah support atau kompatibel diberbagai browser sekaligus berbagai device baik untuk desktop, laptop, tablet maupun smartphone sekalipun.

    Template yang kita buat dengan bootstrap ini akan langsung menyesuaikan diri dengan lebar layar dari masing-masing device. Fitur responsif ini juga telah menjadi rekomendasi google guna memperkuat SEO mobile dari website yang kita buat.

    Di tutorial bootstrap ini kiata akan mencoba membuat template website dengan layout dua kolom dengan menggunakan fitur teks dari bootstrap dan tentunya akan kita bahas langkah demi langkah selanjutnya.

    TUGAS:

    Coba jelaskan dan jabarkan tentang Bootstap 5, sejarah, definisi, keunggulan, format jawaban:

    Nama:

    Kelas:

    Jawaban:

    tulis di kolom komentar pada jam kuliah agar dapat terecord dengan baik dan benar.

    12 komentar

    Unknown mengatakan...

    Nama : Deika Tree Andini
    Kelas : 3A Sistem Informasi
    Jawaban :
    Sejarah booststrap 5 :
    Di versi framework bootstrap kelima ini menjadi perubahan yang terbaru, dimana ada tambahan fitur yang cukup signifikan.

    Diantaranya ialah dengan menghapus dukungan dari jQuery dimana digantikan oleh Vanilla JavaScript.

    Ada lagi migrasi dari perangkat lunak dokumentasi Jekyll ke Hugo serta beberapa fitur lainnya.

    Definisi :
    Bootstrap 5 adalah versi terbaru dari salah satu front-end framework terbaik yang cepat dan ringan. untuk membantu proses pengembangan website.
    Dengan Bootstrap, Anda tidak perlu menulis kode CSS yang panjang, karena Anda bisa langsung menggunakan semua elemen yang disediakan Bootstrap.

    Keunggulan :

    Anda tidak perlu menulis kode CSS yang panjang, karena Anda bisa langsung menggunakan semua elemen yang disediakan Bootstrap.
    bootstrap 5 ini sudah tidak bergantung lagi pada jquery dan mereka sudah menghentikan dukungan untuk browser internet explorer.

    ningsihts.my.id mengatakan...

    Nama : SRI WAHYUNINGSIH
    Kelas : 3A Sistem Informasi
    Jawaban:
    • Sejarah Bootstrap 5:
    Sejarah Bootstrap
    Framework bootstrap saat ini terus mengalami perbaikan dan juga pembaruan sistem yang dapat memberikan layanan serta fitur yang akan lebih kompleks lagi. Dengan begitu bisa membantu dalam mengatasi permasalahan yang terjadi di para kalangan developer dan dapat mempermudah dalam proses pengembangan produk dari sisi coding.

    • Definisi:
    Pengertian dari apa itu bootstrap ialah sebuah kerangka kerja CSS bersifat tebuka atau open source yang digunakan untuk kebutuhan dalam pembuatan tampilan desain visual dari sebuah aplikasi web ataupun situs website. Kerangka kerja atau framework yang digunakan ini berbentuk template desain yang berbasis CSS dan HTML yang digunakan untuk kebutuhan pengembangan tombol, pengembangan navigasi, formulis, tipografi, dan juga komponen antarmuka jenis lainnya. Selain itu juga framework bootstrap ini memiliki fitur dimana dapat mencakup library yang berasal dari JavaScript.

    • Keunggulan:
    Kelebihan pertama dari framework bootstrap ialah kemudahan struktur dari para penggunaan kerangka kerja dapat membuat proses pengembangan tampilan website menjadi lebih mudah digunakan dan juga maintenance yang dilakukan bisa lebih terstruktur. Kelebihan selanjutnya ialah fleksibel, di setiap pengembangan bootstrap ini bisa dilakukan oleh para developer dengan menggunakan frame. Dengan begitu dalam membangun sebuah website akan menjadi lebih cepat, lebih mudah, dan juga lebih efisien.

    remajakuy mengatakan...

    Nama:Arsyad Sanusi
    Kelas:3A sistem informasi

    Jawaban
    Sejarah
    Bootstrap awalnya bernama Twitter blueprint di kembangkan oleh Mark Otto dan Jacob Thornton di Twitter sebagai kerangka kerja untuk untuk mendorong konsistensi di perangkat internal yang sesuai
    Definisi
    Bootstrap adalah framework web development berbasis HTML, CSS, dan JavaScript yang dirancang untuk mempercepat proses pengembangan web responsive dan mobile-first
    Keunggulan
    Dengan Bootstrap, kamu bisa menciptakan website responsive dengan mudah tanpa perlu melakukan coding dari awal. Tentu saja, hal ini menjadi pilihan banyak pemula yang ingin membangun website berkualitas dengan cepat.

    Anonim mengatakan...

    NAMA: NURKHOFIPAH
    NIM:701210165
    KELAS:3A

    JAWABAN:
    sejarah :Framework open source ini diciptakan pada tahun 2011 oleh Mark Otto dan Jacob Thornton dari Twitter. Itulah kenapa dulunya Bootstrap dinamakan Twitter Blueprint.
    Bootstrap dengan cepat meraih popularitas digunakan oleh 27% website di seluruh dunia. Hal itu karena kesederhanaan dan konsistensi yang ditawarkan Bootstrap dibanding framework lainnya saat itu.
    Framework ini tersusun dari kumpulan file CSS dan JavaScript berbentuk class yang tinggal pakai. Bootstrap 5 adalah versi terbaru Bootstrap yang resmi dirilis pada tanggal 5 Mei 2021. Pada versi ini, beberapa komponen mendapat update agar mempermudah developer saat proses pengembangan website.
    Sebagai salah satu framework CSS terpopuler di dunia, Bootstrap terbukti mampu mempercepat proses coding, menawarkan kemudahan integrasi pada website yang dikembangkan, dan berjalan baik di berbagai web browser modern.

    definisi: Bootstrap adalah framework HTML, CSS, dan JavaScript yang berfungsi untuk mendesain website responsive dengan cepat dan mudah.

    Kelebihan: Kelebihan Bootstrap adalah Anda tak perlu coding komponen website dari nol. Framework ini tersusun dari kumpulan file CSS dan JavaScript berbentuk class yang tinggal pakai.
    Class yang disediakan Bootstrap juga cukup lengkap. Mulai dari class untuk layout halaman, class menu navigasi, class animasi, dan masih banyak lainnya.
    Menariknya lagi, kelebihan bootstrap bersifat responsive berkat grid system yang digunakan. Sistem grid pada bootstrap menggunakan rangkaian containers, baris, dan kolom untuk menyesuaikan bentuk layout dan konten website Anda.
    Dengan kata lain, Bootstrap menjamin tampilan website Anda akan tetap rapi dan konsisten di berbagai perangkat pengunjung. Baik melalui smartphone, tablet, atau laptop.

    Angelia parera mengatakan...

    Nama:Anggelia parera
    Kelas:sistem informasi 3A.

    Bootstrap adalah sebuah framework yang paling populer digunakan untuk membuat sebuah website.


    bootstrap 5 adalah versi terbaru bootstrap yang resmi dirilis pada tanggal t mei 2021,pada versi ini beberapa komponen mendapat update agar mempermudah developer saat proses pengembangan website diantara nya adalah menghapus dukungan jQuery Dan diganti dengan vanilla javascript.
    migrasi perangkat lunak dokumentasi
    Dari jekyll ke hugo Dan fitur lainnya.


    Bootstrap 5 adalah versi terbaru Dari Salah satu front end framework terbaik yang cepat Dan ringan,untuk membantu proses pengembangan website.dengan bootstrap anda tidak perlu menulis kode css yang panjang Karena anda bisa langsung menggunakan semua elemen yang disediakan bootstrap.

    Kelebihan Bootsrap;
    *mudah membaca dokumentasi
    *ringan Dan cepat
    *design yang responsif
    *design yg konsisten
    *support modern browser

    Asinan mengatakan...

    Nama : Ahmad Kurnia putra
    Kelas : 3B Sistem Informasi
    NIM :701210246


    Jawaban:
    • Sejarah Bootstrap 5:
    Sejarah Bootstrap
    Framework bootstrap saat ini terus mengalami perbaikan dan juga pembaruan sistem yang dapat memberikan layanan serta fitur yang akan lebih kompleks lagi. Dengan begitu bisa membantu dalam mengatasi permasalahan yang terjadi di para kalangan developer dan dapat mempermudah dalam proses pengembangan produk dari sisi coding.

    • Definisi:
    Pengertian dari apa itu bootstrap ialah sebuah kerangka kerja CSS bersifat tebuka atau open source yang digunakan untuk kebutuhan dalam pembuatan tampilan desain visual dari sebuah aplikasi web ataupun situs website. Kerangka kerja atau framework yang digunakan ini berbentuk template desain yang berbasis CSS dan HTML yang digunakan untuk kebutuhan pengembangan tombol, pengembangan navigasi, formulis, tipografi, dan juga komponen antarmuka jenis lainnya. Selain itu juga framework bootstrap ini memiliki fitur dimana dapat mencakup library yang berasal dari JavaScript.

    • Keunggulan:
    Kelebihan pertama dari framework bootstrap ialah kemudahan struktur dari para penggunaan kerangka kerja dapat membuat proses pengembangan tampilan website menjadi lebih mudah digunakan dan juga maintenance yang dilakukan bisa lebih terstruktur. Kelebihan selanjutnya ialah fleksibel, di setiap pengembangan bootstrap ini bisa dilakukan oleh para developer dengan menggunakan frame. Dengan begitu dalam membangun sebuah website akan menjadi lebih cepat, lebih mudah, dan juga lebih efisien.

    ameliasapna mengatakan...

    Nama : Amelia
    Nim :701210095
    Kelas : 3B

    Jawaban :

    ✓ BOOTSTRAP 5
    adalah versi terbaru Bootstrap yang resmi dirilis pada tanggal 5 Mei 2021. Pada versi ini, beberapa komponen mendapat update agar memudahkan developer saat proses pengembangan website.

    Sebagai salah satu framework CSS terpopuler di dunia, Bootstrap terbukti mampu mempercepat proses coding , menawarkan kemudahan integrasi pada website yang dikembangkan, dan berjalan baik di berbagai web browser modern.

    Sayangnya, penggunaan Bootstrap 4 untuk website dinilai terlalu berat dan bisa memperlambat kinerja website. Nah, Bootstrap 5 hadir untuk menyelesaikan masalah tersebut.

    Salah satu perubahan besar pada versi terbaru ini adalah dihilangkannya jQuery dan dilarang dengan penggunaan Vanilla JS. Hal ini akan membuat website lebih ringan dan tentu mempercepat loading website.

    ✓ SEJARAH
    Sejarah Bootstrap
    Framework bootstrap saat ini terus mengalami perbaikan dan juga pembaruan sistem yang dapat memberikan layanan serta fitur yang akan lebih kompleks lagi.

    Dengan begitu bisa membantu dalam mengatasi permasalahan yang terjadi di kalangan developer dan dapat mempermudah dalam proses pengembangan produk dari sisi coding.

    Berikut beberapa perubahan yang telah dialami framework bootstrap dari waktu ke waktu:

    Versi pertama
    Dahulu bootstrap dinamakan dengan twitter blueprint dimana dikembangkan oleh Jacob Thornton dan Mark Otto sebagai framework untuk dapat mendorong sistem agar lebih konsistensi di perangkat internal dengan sesuai.

    Pada tanggal 19 Agustus 2011, framework bootstrap secara resmi dikenalkan sebagai proyek yang sifatnya terbuka atau open source.

    Versi kedua dan ketiga
    Pada tanggal 31 Januari 2012, framework bootstrap 2 secara resmi dirilis dengan penambahan fitur yang terkait tata letak sistem dengan menggunakan 12 kolom responsif grid.

    Selain itu juga telah mendapatkan dukungan dari Glyphicons dan beberapa komponen baru.

    Selanjutnya pada tanggal 19 Agustus 2013, framework bootstrap merilis update terbaru yang ketiga dengan penambahan fitur pada sisi flat design dan juga tampilan mobile first dimana sudah lebih responsif.

    Versi keempat
    Di versi keempat ini sudah merupakan versi yang stabil dan memiliki paling banyak fitur serta mengalami banyak perubahan dari versi sebelumnya.

    Versi keempat ini dirilis secara resmi pada tanggal 18 Januari 2018.

    Beberapa komponen yang mengalami perubahan diantaranya pada transisi Less menjadi Sass, perubahan dari piksel menjadi em, perubahan kustomisasi pada navigasi, dan masih banyak komponen lainnya.

    Versi kelima
    Di versi framework bootstrap kelima ini menjadi perubahan yang terbaru, dimana ada tambahan fitur yang cukup signifikan.

    Diantaranya ialah dengan menghapus dukungan dari jQuery dimana dibungkus oleh Vanilla JavaScript.

    Ada lagi migrasi dari perangkat lunak tekstil Jekyll ke Hugo serta beberapa fitur lainnya.

    ✓ DEFINISI
    Pengertian dari apa itu bootstrap adalah sebuah framework kerja CSS bersifat tebuka atau open source yang digunakan untuk kebutuhan dalam pembuatan tampilan desain visual dari sebuah aplikasi web ataupun situs website.

    pembuatan kerja atau framework yang digunakan ini berbentuk desain template yang berbasis CSS dan HTML yang digunakan untuk kebutuhan pengembangan tombol, pengembangan navigasi, formulalis, tipografi, dan juga komponen antarmuka jenis lainnya.

    Selain itu juga framework bootstrap ini memiliki fitur dimana dapat mencakup library yang berasal dari JavaScript.

    Dalam penggunaan framework bootstrap ini biasanya digunakan untuk dapat membantu dalam menyusun aplikasi program yang dari sisi front end atau client side.

    Untuk saat ini bootstrap sangat diminati oleh kalangan pengembang web atau developer melalui platform Github dalam membantu proses pembuatan desain website atau aplikasi yang akan lebih komprehensif serta lebih modern.

    ✓KEUNGGULAN
    1. Lebih Mudah Membaca Dokumentasi
    2. Ringan dan Cepat
    3. Desain yang Responsif
    4. Desain yang Konsisten
    5. Mendukung Peramban Modern

    M. anas mengatakan...

    Nama : M. Anas
    Kelas : 3-B Sistem Informasi

    Sejarah bootstrap 5
    Bootstrap 5 adalah versi terbaru Bootstrap yang resmi dirilis pada tanggal 5 Mei 2021. Pada versi ini, beberapa komponen mendapat update agar mempermudah developer saat proses pengembangan website.
    Di versi framework bootstrap kelima ini menjadi perubahan yang terbaru, dimana ada tambahan fitur yang cukup signifikan. Diantaranya ialah dengan menghapus dukungan dari jQuery dimana digantikan oleh Vanilla JavaScript. Ada lagi migrasi dari perangkat lunak dokumentasi Jekyll ke Hugo serta beberapa fitur lainnya.

    Definisi bootstrap 5
    Bootstrap adalah sebuah framework yang paling populer digunakan untuk membuat sebuah website. Bootstrap membuat front-end developer dapat membuat website dengan cepat, fokus pada responsive mobile, dan membuat website menjadi lebih interaktif tanpa membuat banyak CSS dan JavaScript dari nol.

    Keunggulan bootstrap 5
    Lebih Mudah Membaca Dokumentasi
    Ringan dan Cepat
    Desain yang Responsif
    Desain yang Konsisten
    Support Modern Browser

    Atika Yuliana mengatakan...

    Nama : Atika Yuliana
    NIM :701210097
    Kelas : 3B-Sistem Informasi
    Jawaban :
    Bootstrap, awalnya bernama Twitter blueprint, dikembangkan oleh Mark Otto dan Jacob thornton di Twitter sebagai kerangka kerja untuk mendorong konsistensi di perangkat internal yang sesuai. Sebelum bootstrap, sebagai pustaka sudah banyak digunakan untuk mengembangkan antarmuka, yang menyebabkan ketidak konsistenan dan beban pemeliharaan yang berat. Menurut Mark Otto, pengembang Twitter.

    Bootstrap adalah sebuah framework yang paling populer digunakan untuk membuat sebuah website. Bootstrap membuat front-end developer dapat membuat website dengan cepat, fokus pada responsive mobile, dan membuat website menjadi lebih interaktif tanpa membuat banyak CSS dan javascript dari nol.

    Bootstrap 5 adalah versi terbaru bootstrap yang resmi dirilis lis pada tanggal 5 Mei 2021. Pada versi ini, beberapa komponen mendapat update agar mempermudah developer saat proses pengembangan website. Sebagai salah satu framework CSS terpopuler di dunia, bootstrap terbukti mampu mempercepat proses coding, menawarkan kemudahan integrasi pada website yang dikembangkan, dan berjalan baik di berbagai web browser modern.

    Ada beberapa hal baru di Bootstrap 5 dan update yang bisa Anda temukan, yaitu:
    1. Logo dan Tampilan Dokumentasi Baru.
    2. jQuery Tidak Lagi Digunakan.
    3. Penghentian Support untuk Browser Lama.
    4. Dukungan untuk Tampilan Right-To-Left (RTL).
    5. Bootstrap Icons.
    6. Update pada Elemen Form.
    7. Update pada Grid System.
    8. Update pada Navbar.
    9. Kustomisasi Properties.
    10. Penghapusan Beberapa Class (Class Update).

    Keunggulan Bootstrap 5 :
    1. Lebih Mudah Membaca Dokumentasi.
    2. Ringan dan Cepat.
    3. Desain yang Responsif.
    4. Desain yang Konsisten.
    5. Support Modern Browser

    Unknown mengatakan...

    NAMA :SHELFA ALHAN
    KELAS : 3B-SI
    JAWABAN: BOOTSTAP 5 adalah versi terbaru dari salah satu front-end framework terbaik yang cepat dan ringan.untuk membantu proses pengembangan website.
    SEJARAH
    Perkembangan dar twitter blueprint yang sudah dikembangkan untuk pengembangan antarmuka.setelah beberapa bulan banyak yg memberikan kontribusi untuk proyek ini namanya pun diganti dari twitter blueprint menajdi bootstrap pada 19 agustus 2011 dipertahankan oleh otto,jacob thorton dan sekelompok kecil pengembang inti serta sejumlah besar komunitas dari para kontributor.

    DEFINISI
    Bootstrap adalah salah satu framework html,css,javascript yang sangat populer di kalanganpara pengembang dan pengguna web.

    KEUNTUNGAN
    1.Lebih mudah membaca dokumentasi
    2.ringan dan cepat
    3.desain yang responsip
    4.desain yang konsisten
    5.support modern browser

    selvinarahayu8072@gmail.com mengatakan...

    Nama : Selvina Rahayu
    Kelas: 3a
    Jawaban:
    Sejarah
    Bootstrap 5 adalah versi terbaru Bootstrap yang resmi dirilis pada tanggal 5 Mei 2021. Untuk versi Bootstrap 5 merupakan perubahan terbaru saat ini, dimana terdapat beberapa tambahan fitur secara cukup signifikan.
    Definisi
    Bootstrap sendiri adalah salah satu framework HTML, CSS dan JavaScript yang sangat populer di kalangan para pengembang dan pengguna web.
    Beberapa fitur pada bootstrap 5 adalah:
    1. Menghilangkan jQuery
    2. Sistem grid yang tertulis ulang
    3. Perubahan dari Jekyll ke Hugo untuk digunakan sebagai dokumentasi bootstrap.
    4. Dihapusnya dukungan untuk internet Explorer 10 dan juga internet Explorer 11.
    5. Ditambahkannya beberapa kumpulan SVG icons.

    Muhammad Denny mengatakan...

    Nama : Muhammad Denny Oktavia
    Nim : 701210015
    Prodi/Kelas : SI-3B

    Bootstrap adalah framework HTML, CSS, dan JavaScript yang berfungsi untuk mendesain website responsive dengan cepat dan mudah

    Post Bottom Ad