As you probably know Bootstrap is CSS framework or toolkit. It can help you speed up building HTML templates or pages by making a set of CSS classes and JavaScript. However, you need to invest some time to get familiar with it. Is that time investment justified when considering end result? And if yes should you use Bootstrap’s version 4 or 5? Let’s find out.
If you didn’t meet with the Bootstrap before, getting to know the environment will require at least 40 working hours to get used to it. You will be able to make something quickly and this is the first trap to make further time investment. For example, you can go to Bootstrap’s example page and find useful code snippets which you can relatively quickly import into your HTML and get going in an hour or two. There is around 25 ready made snippets and you should explore them well to see if any of them is a good fit for your project.
Of course, if you have some project mockups or wireframes, it is most likely you will search for a specific component. Bootstrap’s design is pretty minimalistic but it’s still a dominant app design style so it works for websites and it also can be used in apps.
What I learned early in my coding practice is that if the design is intuitive it’s always a good design no matter what. So you don’t need to follow trends strictly. Many times you may come with better looking solution from your initial idea with just a little tweaking. You may try to fit Bootstrap’s components from examples page into your project’s mockups. If you end up using a lot of them it is a good indicator you should go with learning Bootstrap.
Or, if you are product manager, using Bootstrap will require further investment in your product in later stages. Because using Bootstrap will invoke technical debt in terms of time to maintain additional library in your code. Usually there are breaking changes in code that require you to rewrite some parts of your own code if you want to update your software with a new version of Bootstrap. Also speed of page rendering is usually on the side of native CSS and JavaScript solution.
Bootstrap 5 overcame some of it’s deficiencies like it’s dependency on jQuery, another JavaScript framework. jQuery itself is known as slow and inside Bootstrap adds another code abstraction and more maintenance. With version 5 there’s no more jQuery but still there will be tweaking in the Bootstrap’s version 5 because dropping jQuery will require a developer’s time on the part of Bootstrap team. So in terms of stability Bootstrap 4 could be a bit more stable than 5, but for new products it’s an obvious choice, use version 5.
With Bootstrap 5 you can compile your components package which is also a good thing for optimized websites and apps.
On the other side, you may choose to skip Bootstrap in favor of pure CSS, HMTL and JavaScript. For majority of things Bootstrap offers enough and there is no need for JavaScript at all. The new versions of CSS and HTML provide plenty of features to make anything you want quite easy. Or let’s say there is a good browser support for recent versions of CSS and HTML which is something you need to pay close attention to when using new CSS and HTML features. For example, if you’re making layout CSS Grids are something that is quite simple and pretty powerful and in combination with CSS Flexbox you can achieve any kind of HTML layout template.
Another benefit of using native solution lies in it’s speed – it is as fast as possible. Sure, you can write inefficient code even in CSS but knowledge of native CSS, HTML and JavaScript is always better especially when there’s almost no additional effort than learning Bootstrap.
However there are obvious situations when you should definitely opt forq Bootstrap:
- You need to work on a product that is already made with Bootstrap, but without resources to ditch it
- Your boss is strict on using Bootstrap for a new product, whatever reason may be
- You have to write a quick template for your website or app and it doesn’t matter how it looks and you can easily copy/paste from Bootstrap example page
After spending about 40-50 hours working with Bootstrap my opinion is that it’s only really good for early stages of prototyping in the copy-paste-as-much-as-possible stage or if you want to look like a Twitter which is made with Bootstrap or we can say Bootstrap is made for Twitter.
For a new product (a website or app) I would go with native CSS and HTML. And if you are learning or looking for job Bootstrap is still widely used, so there are open job positions that require Bootstrap knowledge and in that light you can proceed and spend some hours learning it.