over 6 years ago from James Lane, UI Designer [Moderator]
I was going to put a direct link, but they have put up a good blog post. So...
Homepage: https://getbootstrap.com/
Blog Post: http://blog.getbootstrap.com/2017/08/10/bootstrap-4-beta/
The question is, does anyone care anymore? How do you work on this for 2 years and don't realize the need for namespacing? What is up with the load of utility classes that do one thing?
I have often used Bootstrap in the past but I am moving away from it completely. Just have to find a good popover/modal/tooltip replacement and I'm good to go with a clean BEM/ITCSS setup.
The more proficient and experienced you become as a developer the less need you should have for Bootstrap.
I disagree, Bootstrap is a great tool to - you guessed it - bootstrap projects. To say Bootstrap is just for people starting out is simply invalid. It's not all about writing the most perfect BEM/atomic/component based CSS, it's also about how easy you can onboard new people onto that project, particularly in a commercial context.
Nailed it
Basically. I work for various design agencies and almost all new employees, contractors, etc know bootstrap so onboarding them with the agency projects is very easy - compared to say, using an estoric framework.
The arguments that Bootstrap gets you started quickly and allows you to onboard new devs easily are true, but some web app projects tend to have codebases that have to be maintained for years. The initial simplicity then becomes a double-edged sword, where some choices within the framework that were made to keep things simple actually make things a lot harder. One doesn't simply refactor after some choices have been made - why can't we have good ones from the start?
I didn't say it's only for people starting out. I was addressing this;
I have often used Bootstrap in the past but I am moving away from it completely.
I think this is a natural and common progression.
Bootstrap is not always the best tool for the job. The more experienced you are the better your ability to decide when something like Bootstrap is appropriate and when it isn't should be.
This doesn't always happen. I've worked alongside people who have been in development for years and still rely on Bootstrap for things that absolutely do not require it (jQuery is also bad for this) and therefore using it adds a lot of bloat and can actually be harder/more time consuming to maintain.
I care.
Thank you, same here. Been using Bootstrap for years. Have tried other frameworks, but Bootstrap is just perfect to bootstrap new projects. Even if I am required to sometimes not use Bootstrap, I end up calling the classes the same (e.g. btn btn-lg etc) so it is easy to onboard other people later.
Y'all are the best, thanks for the kind words. Please don't hesitate to holler with feedback!
I'm a long time supported of BEM/ITCSS and having your CSS classes follow the pattern of your HTML, but after reading this article: https://adamwathan.me/css-utility-classes-and-separation-of-concerns/ I have a newfound respect for functional CSS and utility classes and keeping their concerns separated.
That doesn't mean I want to use Bootstrap, but just that utility classes are not as bad as I once thought.
does anyone care anymore?
Seriously? Bootstrap is one of the most widely adopted front-end frameworks on the web and will continue being widely used for quite some time. It might not be the ideal choice for a scalable design system, but it's a kickass tool for building websites.
They might not be up to date on the latest technical advancements and the naming convention du jour, but having a framework of this proportion dropping IE8, using flexbox and moving to Sass will be a major advancement to the web.
Not to mention this is an open source project where Mark & team poured years of free work to serve the community. We all owe a lot to Bootstrap, and your comment could definitely get some chill.
Shucks, thanks Daniel. <3
What is up with the load of utility classes that do one thing?
Functional / Atomic CSS is the jam, especially for designing/ideation in the browser and visual consistency. Don't knock it 'til you try it :)
I tried it and boy some people are going to be disappointed when they have to refactor code like f5 ph7 wtf19. They've added an impossible dependency tree to keep track off in their projects.
Just because you don't need it anymore doesn't mean someone else doesn't :). Bootstrap is used by millions of people, many of whom don't know front-end development as well as you or I. It's not a solution for everything, but it's a solution to a lot of problems out there.
How do you work on this for 2 years and don't realize the need for namespacing?
We've missed on a ton of things over the last couple years. It's tough to find time to do it all when we're also working full-time. I myself managed a 30 person team at GitHub :).
What is up with the load of utility classes that do one thing?
We have responsive utilities like Tachyons and more to help with commonly repeated property-value pairs. Makes for super fast development and ideally can help folks reduce their custom CSS.
I would like to take a moment to acknowledge the work that been put into Bootstrap, especially from you. From a "default design" perspective it's one of the few frameworks that makes the best visual choices that will work in a wide variety of contexts.
So don't take my comment the wrong way. Lots of <3 for Bootstrap, and when compared to the other frameworks, Bootstrap's the best.
I guess I am "beyond Bootstrap" in the territory where I have more needs.
A lot of people care.
There's back-end developers who doesn't know front, but the pattern and it's docs facilitate to create an easy and fast platform. Not every site need to be unique, some sites are a basic CRUD to manage information to whenever he needs.
And bootstrap has a pretty good example that can teach a lot of developers.
I've used bootstrap a lot, and learn a lot also. New front-end developers can learn a lot with bootstrap.
Bootstrap is a great tool - it's helped raise the visual design level of so many projects born of a small dev-only team.
What does depress me increasingly is how many orgs see it as a replacement for valuing front-end, and even as a substitute for CSS.
On a recent project we were told to insert the entire bootstrap css from a CDN into a mature live site. All counter-arguments about conflicts and bloat were overruled because "You can hire devs who know bootstrap" :-/
I was the first one to recommend not to use Bootstrap on IRC or IRL, I usually suggested to start from scratch because of more control and ad-hoc solutions. Also, I complained about the bloat.
But now that I work with more real world applications (in the context of a large amount of users), and look back to old projects, it became clear that Bootstrap is a really useful tool, and should be embraced by anyone that cares about cross browser compatibility, accessibility, and easiness to maintain/onboard new devs.
Just the time that I have spent making old projects more accessible, just that, it makes it worth to use bootstrap for any new project.
I appreciate the detail they have put on accessibility and thank @mdo and the collaborators for that.
Looks sharp! Glad to see they've taken a more "functional" approach with respect to alignment / spacing.
Still going to stick with Tachyons for the remainder, tho...
CSS Grid Layout. 'nuff said.
This is a very underrated answer. While not production ready (IE anyone?), CSS grids will be amazing in a few months.
Agreed! And that's why we didn't implement it :).
Totally the right call. Maybe in the future. I'm already using 4.0.0-alpha6 for https://cointrackr.com and some other projects in production. Great work you guys!
Nice, that looks great! :D
Thank you Mark, appreciated! Good luck with the beta, I will certainly try to update from the alpha.
I do have a love/hate relationship with Bootstrap, but it's great that this has been released. Congrats to the team.
My main issue with Bootstrap comes to hiring new developers. Over the years I have seen a huge influx of developers who rely too much upon Bootstrap as the foundation they lay their knowledge on. I've been burnt in the past by developers who simply didn't understand how css worked, but were able to build sites, because they could copy and paste. Reliance upon frameworks like this is often overkill (IMO), and leads to lazy developers, who would struggle to build even the simplest three column layout without a framework.
Bootstrap definitely has it's place, and has done huge amounts to drive the design industry forward, I just think it's overused....
almost 3 years to release beta version 4 something is not going well
Why's that?
In the last 3 years so much in the world of development has changed. There may have been things that were implemented earlier on, only to find they were becoming deprecated in a few months. Same for things like flex. Whilst flex has been around for a while, it's only recently become supported by default in most browsers.
For you to say that something is not going well means that you haven't been using the alpha versions and just assume a Beta is the first version of a release.
Wonderfull news! Downloaded the beta to test it BUT is seems that column offset has left the building in this beta. In Alpha 6 it was still there but now, after placing the beta versions on my test site column offset no longer seems to be be there or has been renamed again...
.col-{breakpoint}-{modifier}-{size} to .{modifier}-{breakpoint}-{size} for simpler grid classes. For example, instead of .col-md-3.col-md-push-9 it’s .col-md-3.push-md-9.We'll very likely be bringing it back. I underestimated the appeal and usage of it when I removed them :).
I really appreciate this!
I really love this framework. I've been using it almost daily since the first alpha and am so pleased with how much it's grown and evolved. I feel it's also helped me become a much better more organised front-end dev. The new documentation site is great too.
My only pain point with the Beta is the loss of visibility classes. I'm really going to miss writing: (eg)
hidden-md-down
compared to now:
d-none d-lg-block
It's a minor thing, and I understand the decision to remove those verbose classes - but for me it was so much easier to scan and quickly understand the intent, on large projects at least.
Anyway thanks Mark and your team for all the effort, you guys are awesome!
This is pretty important.
I can't find this in the docs, can you point me to it?
@ShashwatAmin It's briefly mentioned here and here in the docs. It would have taken me by surprise if I wasn't following the release notes.
There was a brief discussion on it here recently.
The .hidden classes presented an issue where we would need their own variants for every single display value—inline, inline-flex, inline-block, block, flex, table, etc. And, we'd need that in two directions—up and down.
With the new approach, you have the same singular set of classes that are more descriptive given their CSS property and value names. For example: d-none d-lg-flex vs d-flex hidden-lg-down. The former is a single direction of mobile-first classes working together, whereas the latter is two directions and two class names.
Hope that helps explain things a bit!
Thanks Mark, makes sense, I appreciate the explanation.
Is there an easy way of not using rem/em's in B4? I just want to use the breakpoint pixel method instead of rem/em's.
No, I'm afraid not—components are sized in rems. Some ems from time to time. However, breakpoints are actually still in pixels.
Anyone know of a good reference guide for updating a BS3 site to BS4?
Of of the stuff is still the same, depending on how much you used. I'm sure there are migration guides but what I did was simply moving to BS4, seeing what breaks and fixing it.
This is probably your best bet right now. I'm sure some migration guides will start popping up, but just getting 4.0.0-alpha6 over to 4.0.0-beta is gonna be a bit of a pain for me on some projects I have in the wild. I'm sure bs3 to bs4 is going to require taking some in-depth dips into your code vs. the docs.
Hype!
Mark Otto's "tweaser"
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now