Matt Rudge, a Senior Product Developer with Code Institute, has a long history with Bootstrap. However, what are his reasons for still loving this technology? In this blog, Matt tells us his five main reasons for still loving Bootstrap.
Why I still love Bootstrap
Hidden somewhere in the darkest and, mercifully, untouched corners of the Internet Archive’s Wayback Machine lies the first-ever website I created. Actually, that’s not quite true. It’s the second version of the first website I ever created, because it was indexed in May 1996, and the first version went live in July 1994.
Bootstrap – aka Blueprint
Then, of course, CSS arrived and made everything simultaneously easier and more difficult. Things could now be positioned with pixel accuracy, and the quality of web development improved rapidly. I do still favour writing CSS from scratch. However, it can feel like you’re playing a particularly tense game of Buckaroo where one false move can bring everything crashing down. One solution to endless CSS adjustments is to use a front-end framework, or library, where the heavy lifting has been done for you. And, of all the different frameworks currently available, Bootstrap is the one I always reach for.
Bootstrap started life as a Twitter project back in 2011. It was initially called “Blueprint”, a name I prefer! Mark Otto, the developer who initiated the project, said; “A super small group of developers and I got together to design and build a new internal tool and saw an opportunity to do something more. Through that process, we saw ourselves build something much more substantial than another internal tool. Months later, we ended up with an early version of Bootstrap as a way to document and share common design patterns and assets within the company.”
Consistency in appearance
In fact, Bootstrap became an internal style guide at Twitter. This is because generic Bootstrap projects have the same look and feel.
If you’ve read articles about Bootstrap before, then this consistency in appearance is also one of the things that is often viewed as a reason not to use it. One of my students even created a parody webpage to showcase everything wrong with generic Bootstrap designs.
I don’t think that’s an entirely fair characterisation of Bootstrap. Here are five reasons why I still love using it, and why I think you should too:
1. Super-fast development
The easy-to-understand, flexible grid system, as well as the vast library of plug-in components, means that you can create a functional, responsive website in a short space of time. It is easy to make elements appear or disappear, depending on the screen size. Bootstrap is built on the concept of mobile-first development, so your content will scale perfectly to a mobile device without you needing to do too much. You can then decide what components should be visible or how the content should adjust as the screen size changes. Right out of the box, you can get a project off the ground very quickly. This, of course, means that you have a generic-looking Bootstrap site, but that brings us on to the second reason why I like Bootstrap.
2. It is easily customised
With a little CSS know-how, all visual elements in Bootstrap are customisable. This means that a generic-looking Bootstrap project doesn’t need to stay like that. You can re-design the buttons, modals, navigation bars, links and menus, and many larger organisations do this to personalise the user experience. The website for Forbes India (link: forbesindia.com) uses vanilla Bootstrap. Even the main Forbes website (link: forbes.com) uses a customised version of Bootstrap 3. So, with a little work, a Bootstrap project doesn’t need to look like a Bootstrap project, which segues nicely into my third reason:
3. You don’t have to use all of it
Committing to using Bootstrap doesn’t mean that you need to use it all. If you don’t like Bootstrap’s default buttons, then design your own in CSS and keep Bootstrap around for the super-easy responsive grid. It’s straightforward to custom-design parts of your project and to sprinkle Bootstrap in where necessary.
4. It has a massive library of interactive components
Collapsible mobile menus? Interactive carousel sliders? Styled, pop-up modals? Scroll-spy as you go down a single-page application? Popovers and spinners? They’re all included in Bootstrap. Now, some of it is – in my opinion – overused. I could rant about the carousel for longer than you’d like to continue reading; however used properly and judiciously, you can create beautifully styled, interactive components on your site with little-to-no coding. Most of them just require a simple class name to be added to a <div> element. All of these components are customisable too, so you can fit them into your site’s overall theme. And, finally, if you get stuck when customising these components:
5. There is a considerable community actively developing for Bootstrap
There are thousands of templates and examples of how you can customise Bootstrap available. Take a look at examples on CodePen (link: https://codepen.io/search/pens?q=bootstrap) to see the creative ways in which Bootstrap can be customised and – with correct attribution, of course – try some in your own projects. With a little help from the community, you can bring your Bootstrap project to the next level.
In conclusion, Bootstrap has come a long way since its establishment as a style guide for internal Twitter projects. It is now a mature, powerful front-end library that allows you to focus on executing your vision. At the same time, it carries out the hard work of resizing your content to look good on different screen sizes underneath. Just because your site is based on Bootstrap, doesn’t mean that it has to look “Bootstrappy”. Yes, that is a word I just invented.
If Bootstrap had been available when I was developing my first website back in 1994, then, who knows? I might even have been happy to share the link.