The Missing Bootstrap 5 Guide, Review

Bootstrap is one of the world's most popular and easy-to-use frontend UI toolkits for building responsive websites. It can save a lot of design and development time as it has the basic building blocks in place - and it looks quite nice as it is. With a few additions, though, Bootstrap can go from nice (but bland) to incredible looking - there's nothing wrong with the standard Bootstrap 5. It's all nice looking. But if you're not customising that, then you end up with websites that could all look the same. It's there for simplicity but also for customising.

For those that don't know how to get the most out of its vast range of components, utilities, JavaScript plugins, and other features, there's The Missing Bootstrap 5 Guide from Jeppe Schaumburg Jensen. This is a book that will help you customise Bootstrap 5 with Sass to achieve a layout that stands out from the crowd. It will enable you to create something unique that doesn't necessarily look like it was created with Bootstrap. Taking advantage of its features and resources but adapting them.

Jensen has put together a comprehensive guide on how to use Bootstrap. I've used Bootstrap for years. It's a wonderful tool. So I was intrigued as to what I would get out of this book. What am I missing with my developments that I could learn from this? What could I use going forward? Is there a better way of doing something than I have been?

Straight off the bat, I had a concern as the first part mentions methods of how to customise Bootstrap - the first of which was editing the Bootstrap CSS files directly. Not good advice if you ever plan to update Bootstrap in the future. But thankfully, it's a short paragraph stating that it makes it hard to update in the future and "this approach is not recommended". Phew. The second option, using a custom CSS file, is how I tend to work. The third is using Sass, which is what the book will mainly cover. This means I was set to learn a fair bit, which was a delight, as I've always stayed away from Bootstraps Sass, and I'm always up for learning.

If, like me, you've tended to go with traditional CSS over Sass, then there's a handy chapter going through it. The chapter is a great overview of Sass, showing how it's used compared to the more traditional CSS and providing plenty of working examples - what the code looks like and the CSS that it will produce. There are also important notes added, like how the use of @import is being discouraged by the Sass team as it's to be phased out. However, as Bootstrap still uses it, it's being used here instead of the @use rule. It's as comprehensive as it needs to be, covering what Bootstrap makes use of and why.

There are a few important notes scattered throughout to explain why certain Sass rules might not be used or why in this case, one is being used as opposed to more recommended rules.

It's not just about CSS, though. There are chapters on using advanced JavaScript features. There's always more than one way to do things. There's the default way to use data attributes in HTML, or you can use JavaScript. This again makes me look back at how I do things whenever I use Bootstrap, and I always use data attributes. Both methods are shown with multiple examples to show how it all works.

An important section for any developer is on optimising. Essentially, optimise Bootstrap after you've finished creating your website. Having read through it, it's definitely something that I'll have to revisit again sometime. Some of it is a bit much, but it all comes down to preference. You can do some simple optimising as shown. Or, you can go that extra mile to save some extra lines and bytes of code. You get a little example of going the extra mile in optimising by trimming used utilities, but not much as realistically that could be a big task. Other options mentioned aren't too much work and can make a huge difference. This alone is a huge selling point for the book as it's essential if you want to make your websites that little bit faster.

Realistically, the only thing that I'd have liked to make this book better is some colour on the code to make large blocks a bit easier to read. It's all clearly laid out, so it's not a big deal. But it can make some pages look bland at times and reminds me of some times when I've updated code using boring old Notepad. I've gotten too used to colour themes with text editors. Using some colour on the code parts would have made everything on the page pop and made some of it a bit easier to read. Although, some places are bolded to highlight a particular part, so maybe it's because that wouldn't have the same impact when there are multiple colours going on.

If you don't want to type out all the examples yourself, you can download and experiment with them to help grasp some concepts. But for me, I find typing them out myself is a great way to learn, even if I know the basic HTML used.

Overall, The Missing Bootstrap 5 Guide is an interesting book with a ton of great examples and ideas on how to improve your use of Bootstrap. The order of the chapters has been well thought out as you're introduced to more advanced concepts and tricks. It's not so much a book for beginners with Bootstrap - it's probably a good idea to have a decent background in using it before going into some of the concepts this book talks about. It is a great book for improving your Bootstrap skills and taking what you know to the next level. I know I went in arrogantly thinking that there'd be a few things I'd learn, but the reality is that I still have a lot to learn. I'm definitely going to reference this book the next time I start building a website with Bootstrap 5.

Rating: 4.5/5

If you'd like to check this out, you can purchase The Missing Bootstrap 5 Guide on Amazon.