1 of 10

Bootstrap

2 of 10

What is Bootstrap?

  • Bootstrap is a free front-end framework for faster and easier web development
  • Bootstrap includes HTML and CSS based design templates for typography, forms, buttons, tables, navigation, modals, image carousels and many other, as well as optional JavaScript plugins
  • Bootstrap also gives you the ability to easily create responsive designs

​

3 of 10

HTML5 doctype

  • <!DOCTYPE html>�<html lang="en">�   <head>�     <meta charset="utf-8"> �   </head>�</html>

4 of 10

Mobile-first Style

    • <meta name="viewport" content="width=device-width, initial-scale=1.0">
    • A <meta> viewport element gives the browser instructions on how to control the page's dimensions and scaling.
    • The width=device-width part sets the width of the page to follow the screen-width of the device (which will vary depending on the device).
    • The initial-scale=1.0 part sets the initial zoom level when the page is first loaded by the browser.

​

5 of 10

Containers

    • Bootstrap also requires a containing element to wrap site contents.
    • There are two container classes to choose from:
    • The .container class provides a responsive fixed width container.
    • The .container-fluid class provides a full width container, spanning the entire width of the viewport

6 of 10

Bootstrap Grid System

    • Bootstrap's grid system allows up to 12 columns across the page.

​

7 of 10

Bootstrap Grid System (Cont..)

8 of 10

For self learning

​

9 of 10

Entity Framework

    • An Object/Relational Mapping (ORM) framework
    • Enables developers to work with relational data as domain-specific objects.
    • Eliminating the need for most of the data access plumbing code that developers usually need to write.
    • Uses LINQ

10 of 10