For many web developers, Bootstrap is the way to go when you have to create a Website or App. But in the five years I have making websites, I have found things that made me change my decision of using Bootstrap at all, and I've changed the way I create websites almost completely.
Hi! My name is Codedgar and today I wanted to talk of why I don't use Bootstrap anymore. Since it's a question that students, coworkers, and people, in general, have been asking me a lot recently: Why I don't use Bootstrap?
Let's start with my history (I'm gonna be short, promise C: ) When I started working on frontend web development, the first thing I crossed upon was Bootstrap. And with that, I thought I had frontend developing mastered, it was easy, fast to use and it has a lot of components! Nice!
But as my work progressed and the websites became more and more custom, I started to find Bootstrap a little bit unuseful, and that's when I came to a conclusion as to why I would not be using Bootstrap in my new works.
For easier understanding, I have divided this post in the reasons of why I don't use it, enjoy:
1- Weight
2- Components and Utilities
3- Styling
1- Weight:
"Weight? But Bootstrap is less than 500KB". Yes, I'm aware of that. But let's take on consideration how much of Bootstrap we actually use. And using Bootstrap means that you have to use also jQuery, so if you were to create a landing page with Bootstrap, you would have to use jQuery, Bootstrap CSS, and Bootstrap JS. All of these resources will not be used even in half if you use Bootstrap. And that brings me to my next problem.
2- Components:
"Lack of?" Nope, not at all, is actually the opposite. Bootstrap has so many components and utilities, that you are almost certain to never use even half of them. And you may argue that with NodeJS you can compile and use only the CSS that the website uses, but with plain HTML for a server with Cpanel, this is not possible (At least that I know). So there's this vast quantity of components that you will maybe not use and they will be there anyway.
This is not a problem just of Bootstrap, but of many frameworks I've seen, like Materialize or UiKit, where there are components that most people wouldn't use and there are classes that can be broken down into only one style, like:
.modal-top-left{top:5%;left:5%}
And so on for modal-top-right, modal-bottom-left, modal-bottom-right. If you wanted to change the position of the modal you could totally do it with only one class, adding these classes is just dumb.
3- Styling:
While Bootstrap is easy to use, it's not so easy to customize as you might think. Some components will require you to use !important several times, which is not ideal when creating CSS. And having to override the default styles of Bootstrap is just like having to create your own CSS from start.
What do I use then?
Most people at this point just say " So what? You make CSS from start and don't use any framework?" And well, I don't create my CSS from scratch, and I do use a framework, but only for managing the columns of the website. The framework I use is called Flexbox Grid and it justs comes with columns and rows, nothing more. And it only weights 1.9KB! So, on a website with 1 homepage and 4 subpages, the total CSS (including Flexbox Grid) is only 5KB. For me, that's amazingly fast!
And should I use Bootstrap?
Well, there's something I can't deny and it's that if you need to develop something incredibly fast you can use Bootstrap. And if you are thinking if you should, or should not use Bootstrap, ask yourself:
1- Will I use several components of Bootstrap?
2- Am I in a rush to develop this frontend?
3- Is the design important for this?
If your answers are: Yes, yes, and no; Go ahead and use Bootstrap without shame.
Extra: Do I hate Bootstrap?
Of course not. I think that is amazing to develop websites quicker and easier, but I just would not be using it anymore because I prefer to make my own components and craft almost everything by hand. I know that Bootstrap will live along a still be used by a lot of people, and that's totally fine :)
What do you think? Do you use Bootstrap?
Oldest comments (144)
A lot of projects I end up working with use Bootstrap in some form, just because it comes with a lot of WordPress themes. Personally though, I really like Tailwind.
I want to move away from Bootstrap and use Tailwind, I am just finding it a learning curve in how it works, but I can completely see the benefits.
It always depends what you want to do. I agree that for a simple web-page there's no need for bootstrap. But there's life after, for those who don't get stuck in developing basic stuff. E.g. we're developing enterprise apps for airlines - revenue management, pricing, inventory management, etc. Your're not going to do that with a simple table but require some solid templates and components. And that's what bootstrap is for.
A contract value of those prices does not normally come with its own customized templates? It seems weird they would shell out that kind of money and immediately accept that performance hit.
I checked out a couple air line home pages to see:
AA: Modernize/jQuery
Delta: Just Bootstrap.js
United: React (without css framework that I could find)
In my experience, big contracts and companies often require documented and standardized solutions so the project can be maintained, improved, and fixed easily at any point in its lifetime. No one knows how long a software project will be around, and they know you won't be around forever (they don't want you to, as that would mean spending more money). There is of course a considerable amount of customized work to be done, but using public or private/paid solutions that are easily available and that anyone can pick up is a common practice.
Is it possible to use bootstrap to develop Project management application?
I donβt see how not?
I've built dashboards with bootstrap framework. Overall - it's just a framework. It'll help you lay out your components, and using the utility classes are helpful for a lot of the visual elements in common Project Management software.
If the bottleneck was CSS file size (which it rarely is on the projects I've built), It would be difficult to refactor the project out of bootstrap because of how dependent a lot of the code is on bootstrap. But that's not a con -- it was a fast deployment VS many many more work hours to find all the right visual libraries to display data.
So basically you are saying you're can't create a good design with bootstrap?
Sorry, but that's just...well, dumb.
I'm not saying you can't do good designs with Bootstrap (You totally can lol), what I'm trying to imply is the fact that if you are going to use Bootstrap and the design will force you to overwrite most of the styles of Bootstrap, you shouldn't use it.
Read the third part (Styling) to know what I mean better π
That's great! I've been doing my own CSS stuff for I dont know how long and the one thing I've seen the most when people find bootstrap/materialize is that they never learn to understand HOW it actually works. Getting some basic knowledge about CSS will help you in the long run!
I think these frameworks add a layer of abstraction and encapsulate the inner workings which will be imperative if the developer would know what goes on under the hood. To have better understanding and control over their workflow rather than been opinionated about it. I agree to the fact that bootstrap and other frameworks are sometimes unnecessary especially for smaller apps, no need for unnecessary dependencies. But I also totally agree that when you need to get the job done faster you can go ahead and use it. But in addition to that you can create your own custom components and work with it when you want. But I think its more of a personal decision though, but as for me the projects I do now are intentionally customized and require me to have more control so I do alot of styling from scratch but I use sass preprocessor and the BEM design pattern.
I will have to agree that bootstrap might be unecessary and even unwanted for smaller project but I would argue also for big or very customized layouts or designs.
A rule of thumb could be that if you find yourself undoing most of the style structures that bootstrap gives you and you are constantly using !important keyword to get things done I think it is time to start considering your life without bootstap.
I would personally use bootstrap only if the job/client required it or if the project was already based on bootstrap and did not want to make a major overhaul. I would probably use a framework for columns/grid but even that is probably not needed.
I find it that in all cases plain old CSS (actually new CSS3) will give you all power and flexibility to create what you need to create exactly what you want to accomplish.
my 2c
One positive about bootstrap is that if another developer needs to modify your code they can understand bootstrap faster than working on custom components since it's got well established rules and docs
I've also decided that personally I'll use bootstrap by default and become proficient at it, if the client wants a radically different look then I'll charge more for it since it takes more time to do custom and make it polished
I find this way of thinking critical for any developer, regardless if working with Frontend or Backend. You need to weigh your needs with what the library does and how much it carries that you don't need. Sometimes wanting to build something fast, people forget that it will eventually need to be maintained. Which means if you are only using a small portion of a library all the extras it carries can get in the way of maintenance.
Off topic but i snapped the pic used on the cover, totally was surprised to find it in the wild.
Holy hecc! Hahahaha Nice pic man it's amazing
Some comments may only be visible to logged-in visitors. Sign in to view all comments.