Study Program of Information Systems Faculty of Engineering and Computer Science SY. 2020-2021 Andi Nurkholis, S.Kom., M.Kom. October 26, 2020
2
3 Bootstrap is a powerful toolkit - a collection of HTML, CSS, and JavaScript tools for creating and building web pages and web applications. It is a free and open source project, hosted on GitHub, and originally created by (and for) Twitter.
4 The most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
Bootstrap 4 is the newest version of Bootstrap that saves you from writing lots of CSS code 5
The main reason Bootstrap is so popular in the web design industry with market share of over 16%. Its unique and compelling features that empower developers to build well-functioning, fully responsive websites without any hassle. 6
• The Powerful Grid System • Rapid Development • Browser Compatibility • Customization! • Good documentation 7
Bootstrap has one of the best responsive, mobile-first grid systems available. It’s built with Flexbox and it’s easy to use. It helps in scaling a single website design from the smallest mobile device to high-definition displays, logically dividing the screen into 12 columns 8
Bootstrap comes complete with many reusable CSS and JavaScript components that can help achieve the functionality needed in almost any kind of website. You just have to use some HTML to plug them into your template, with no need to spend huge amounts of time writing complex CSS and JavaScript.9
10 Bootstrap is compatible with the latest, stable releases of all major browsers and platforms. With regard to the Windows platform, Bootstrap works in Internet Explorer versions 10–11 and Microsoft Edge.
Bootstrap offers many ways to customize its default design. You can override all of its CSS and default JavaScript behavior. 11
Bootstrap also provides a great documentation with examples and demo that only make it more easier for even someone new. 12
There are two ways to install bootstrap framework: • Download all bootstrap files • Insert bootstrap file link via CDN (note: web development is done online) 13
14
We can use bootstrap framework by inserting CSS file (using the link tag) and JS file (using the script tag), then calling the classes provided 15
Andi Nurkholis, S.Kom., M.Kom. September 28, 2020October 26, 2020 Study Program of Information Systems Faculty of Engineering and Computer Science SY. 2020-2021

Web Programming - 6 Bootstrap Framework

  • 1.
    Study Program ofInformation Systems Faculty of Engineering and Computer Science SY. 2020-2021 Andi Nurkholis, S.Kom., M.Kom. October 26, 2020
  • 2.
  • 3.
    3 Bootstrap is apowerful toolkit - a collection of HTML, CSS, and JavaScript tools for creating and building web pages and web applications. It is a free and open source project, hosted on GitHub, and originally created by (and for) Twitter.
  • 4.
    4 The most popularHTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
  • 5.
    Bootstrap 4 isthe newest version of Bootstrap that saves you from writing lots of CSS code 5
  • 6.
    The main reasonBootstrap is so popular in the web design industry with market share of over 16%. Its unique and compelling features that empower developers to build well-functioning, fully responsive websites without any hassle. 6
  • 7.
    • The PowerfulGrid System • Rapid Development • Browser Compatibility • Customization! • Good documentation 7
  • 8.
    Bootstrap has oneof the best responsive, mobile-first grid systems available. It’s built with Flexbox and it’s easy to use. It helps in scaling a single website design from the smallest mobile device to high-definition displays, logically dividing the screen into 12 columns 8
  • 9.
    Bootstrap comes completewith many reusable CSS and JavaScript components that can help achieve the functionality needed in almost any kind of website. You just have to use some HTML to plug them into your template, with no need to spend huge amounts of time writing complex CSS and JavaScript.9
  • 10.
    10 Bootstrap is compatiblewith the latest, stable releases of all major browsers and platforms. With regard to the Windows platform, Bootstrap works in Internet Explorer versions 10–11 and Microsoft Edge.
  • 11.
    Bootstrap offers manyways to customize its default design. You can override all of its CSS and default JavaScript behavior. 11
  • 12.
    Bootstrap also providesa great documentation with examples and demo that only make it more easier for even someone new. 12
  • 13.
    There are twoways to install bootstrap framework: • Download all bootstrap files • Insert bootstrap file link via CDN (note: web development is done online) 13
  • 14.
  • 15.
    We can usebootstrap framework by inserting CSS file (using the link tag) and JS file (using the script tag), then calling the classes provided 15
  • 16.
    Andi Nurkholis, S.Kom.,M.Kom. September 28, 2020October 26, 2020 Study Program of Information Systems Faculty of Engineering and Computer Science SY. 2020-2021