Bootstrap was published by Twitter as a free framework, so it can be downloaded and used free of charge. With the freely available programming code, more experienced developers are able to adjust the framework to their own needs. The following guide lays out which steps you need to follow before using the Bootstrap CSS and JavaScript templates.
1. Visit the official website getbootstrap.com. Download the Bootstrap package. This contains both the CSS and JavaScript files (one in standard form, one in minimized form) as well as fonts and the optional Bootstrap theme.
2. Unpack the file and drag the Bootstrap folder into the desired project directory
3. The folder contains ‘css’, ‘fonts’, and ‘js’. In the ‘font’ folder, you’ll find more than 250 icons in the font, Glyphicons Halflings, which has been made available to Bootstrap for free. The files in the folder ‘css’ and ‘js’ are described individually below:
bootstrap.css: CSS code in readable form
bootstrap.min.css: minimized CSS code. Content irrelevant for the interpretation of the code, such as spaces, has been removed
bootstrap.css.map: contains CSS source maps that help you find the original source data in LESS format when developing
bootstrap-theme.css: CSS file of optional prepackaged theme
bootstrap-theme.min.css: minimized code of theme
bootstrap-theme.css.map: theme source map
bootstrap.js: JavaScript code in readable form
bootstrap.min.js: minimized JavaScript code
4. If you want to use JavaScript elements then download the additional JavaScript library, jQuery on jquery.com.
5. Once all components are present and familiar, then the real work can begin. For demonstrative purposes, we’ve created an HTML welcome page, which we’ll then turn into a Bootstrap template.
6. Open your preferred code editor, like Notepad++, and add the following code into an empty document: