If you have any sort of interest in web development, you’ve likely heard of Bootstrap. According to the official website, Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web. Sounds great! Now how do I use it?
It would be easy to send you over to their Getting Started page and call it a day. Their setup guide is indeed a host of useful information – links to CDNs, explanations on how to install with Bower, npm, and Composer, information on integration with Autoprefixer and LESS, a bunch of templates, licenses, and translations – but it is certainly not a step by step guide to getting started (which very well might be in the spirit of autodidactism).
I thought this could serve as a first look into Bootstrap for beginners, so there won’t be going into LESS and Sass integration, which are more intermediate/advanced concepts. While it’s written for the current, stable version Bootstrap 3, the concepts will remain the same for future versions. I heard 4 is gonna be out soon?
- Basic knowledge and understanding of HTML and CSS
What is Bootstrap?
Bootstrap can be boiled down to three main files:
- bootstrap.css – a CSS framework
- glyph icons – a font (an icon font set)
Everything else you might happen across while studying the Bootstrap documentation – Grunt, Gulp, Sass, LESS, bower, npm, etc – is not necessary to get started with Bootstrap. These are task runners, preprocessors, installation aids, and package managers, so don’t be discouraged if you don’t know how to use any of them yet. (I’ll probably try to cover them like later?)