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 autodidactic).
This guide is meant, as a first look into Bootstrap for beginners, so won't be going into LESS and Sass integration, which are more intermediate/advanced concepts. While it is written for the current, stable version Bootstrap 3, the concepts will remain the same for future versions.
Learn what a front-end framework is and how it can be useful
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
glyphicons - 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.
Why is a framework important? Do I need to use one?
You absolutely don't need to use a framework - I recently wrote an article called You Don't Need a Framework: Understanding the Fundamentals of Responsive Design, which I would recommend reading if you want to learn more about responsive design. However, frameworks are very popular and have many benefits, so it's important to learn how to work with them.
Some of the ways that frameworks can help you:
Prevent repetition between projects
Utilize responsive design to allow your website to adapt to various screen sizes - mobile, desktop, and everything in between
Add consistency to design and code between projects and between developers
Quickly and easily prototype new designs
Ensure cross-browser compatibility
Generally, every web project you work on will need to be responsive and work properly on all the major browsers, and likely have some fallbacks for older browsers. Bootstrap has a huge open source community that works on covering this so you don't have to. Additionally, when multiple developers all know the same system, they can work in better harmony - and it also makes it easier for newcomers on a project to get up to speed.