Bootstrap

Bootstrap

1. Use

   • CDN
     • This is the recommended way to use bootstrap through a CDN which contains static files like our CSS File which we can reference from our own site
   • Package Manager
   • Download
     • You can download the css files from bootstrap.com and use from your local files

2. Features

   • Grid Layout
     • Fundamental system that will allow our pages to look good no matter in what size of the screen we are looking
     • Concepts
       • Container: Used to initialize the grid system, normally a page will only have one container but it could have more than one if it desires so
       • Rows And Colummns: We will apply classes to put elements in a colummn or row Breakpoints: Page widths known to bootstrap , and based on the width of your browser window there will be a different layout
     • Responsiveness
       • This will be 
       • Classes
         • row: used to created a new row in the container col-xx-#: used to indicate a new colummn inside a row, it can be followed by a breakpoint(xx) indicating the minimum width it should have to be show this layout if its below it will to the default meaning one element on top of another. It can also be followed by a number, since rows can have a maximum of 12 cols, the # number means the number of colummns said element will be occupying.
   • Components
     • Ready to use building block to use in your site, with the correct styling already applied
     • They cover common scenarios including a navigation bar, customizable buttons, form elements and taps
     • JavaScript
       • Some of the components use javascript for interactivity with the user
   • Style Utilities
     • CSS classes that you can apply on pages to handle common things such as margin alligigning, aside from the other normal functions 
   • Theme Support

3. Font Awesome

   • This library will allow us to use svg logos from popular brands and generic icons aside from fonts to stylize our web app even more. To use it we will have to download the library and use the i tag plus the class of the icon we want to use, for example: