Thanks for recommending Bulma, looks like something I could really use over Bootstrap has some nice design qualities and components..I'm more of a backend guy myself, but looks easy enough to grep and use on some side projects I build.
>I especially like the spacers[1] for adding padding/margins
Looks just like the ones out of Bootstrap 4.
The "Embed Responsive" component appears to be a clone of BS4's.
Kanbasu's grid system looks much worse
>Widths are percentages represented by fractions. All classes are constructed like .w-{nominator}/{denominator}. By default you have halves, thirds, quarters, fifths and sixths.
>Note that only the smallest fractions are generated; for example .w-2/4 doesn’t exist when both quarters and halves are in the settings, .w-1/2 take over it.
...wait, what? Seems way more complex than Bootstrap. The responsive example is even worse:
.grid--center>.grid__item
Yikes, appears to be BEM in naming conventions only, doesn't include the specificity flattening that makes BEM so nice. So when I want to overwrite this I need to use the > combinator?!
It also appears to be totally lacking in JS components? Also missing many of the mixins that make Bootstrap more useful.
I mean Bootstrap 3 looks a bit samey but I'd attribute that to being a victim of its own success.
Bootstrap 4 gives the fonts a once over, adds some extra components [1] plus some contemporary starter templates [2] [3]. All-in-all I think v4 strikes a good balance of modern and sensible design.
Yes. It's not as trendy as it once was (if it ever was trendy to begin with), but it's still a stable framework used by a lot of small scale agencies and companies making their sites in house.
That's because:
1. It's well known, so anyone who joins the project will know how the framework works or how to use it. A less popular framework will require teaching new developers about it before it's really usable.
2. It has options. For most frameworks, it seems the only responsive design options are 'full screen' and 'mobile' with nothing in between. In Bootstrap, you can have the layout gradually change as the screen size gets smaller, which is useful.
3. They're used it. Seriously, it may surprise some people here, but a lot of web developers (and developers in general)are not particularly interested in technology or learning about shiny new platforms and tricks and will just stick to whatever they already know to pay the bills. For a lot of those 9-5 developers, Bootstrap (and Foundation) are just 'good enough' for their purposes.
So it's still relevant, especially outside of the startup bubble where developers don't care about anything other than a pay check.
> 1. It's well known, so anyone who joins the project will know how the framework works or how to use it. A less popular framework will require teaching new developers about it before it's really usable.
This presumes using a framework. Why create a grid system with bootstrap, vs just creating a grid using the CSS that all current browsers support?
Old browsers might be a good answer, but many of us don't have the budget to support such a small amount of devices.
> This presumes using a framework. Why create a grid system with bootstrap, vs just creating a grid using the CSS that all current browsers support?
Speaking from agency world, big win for Bootstrap it's that its so much more than grid system, so once app is exposed to client's IT, they are able to pick it up and build upon it easier than they would've been able to with custom components.
>vs just creating a grid using the CSS that all current browsers support?
Because the users that contribute to my conversions don't strictly use Chrome and Firefox? Because even if you are using CSS Grid a framework for it would still be a time-saver?
>but many of us don't have the budget to support such a small amount of devices
I don't have the budget to alienate my users using these devices.
Grid works in Safari and edge too. The only thing you get with old browser support these days is IE people. And sure if they're 90% of your conversions, as mentioned in the comment you're replying to, that's great and go for it.
Yes, absolutely. Most people aren't using it for the UI kit, but for its very powerful grid system, well understood semantics, and browser compatibility. The documentation is fantastic and it has been a boon for writing accessible front ends.
Yes, wow, a million times yes. I can't imagine starting a project from scratch, I've been using tweaked parts of BS4 in production and I can't imagine going back to writing my own media-query mixins, modal components, etc. Even in alpha it's rock-solid and HUGE time-saver.
I find it to be beyond compare, indeed many other frameworks will copy its component offerings and naming conventions.
Compared to 3, BS4 is really well-refined and solves a lot of issues. That + the flexbox enhancements make it a joy to use, personally.
Who doesn't use bootstrap on new projects? takes no time, and bringing devs up to speed is quick. I think at this point there aren't many devs who actually work in the industry who don't know how bootstrap works.
The issue tracker has been at 99,9% with 2-3 open issues left for two months now.
The plan now is to test things and see if there's anything else that will need to change but changing of which in betas would be especially annoying to end users.
28 comments
[ 0.22 ms ] story [ 79.8 ms ] threadAlso, it's not 2011 anymore, browsers support a lot of cool css features which a lot of times makes these frameworks useless.
Bootstrap is the jQuery of CSS. It's not really needed anymore.
>an open source CSS framework based on Flexbox and built with Sass
So, like BS4?
Spectre seems to lift most of the components directly from Boostrap, the grid system and naming conventions appear identical.
In some cases they are using some terrible practices, like the "CSS only" carousel that involves hidden radio buttons!
I especially like the spacers[1] for adding padding/margins without having to define separate CSS classes every time.
[0] http://kanbasu.liip.ch/
[1] http://kanbasu.liip.ch/02-helpers.html#spacings
Looks just like the ones out of Bootstrap 4.
The "Embed Responsive" component appears to be a clone of BS4's.
Kanbasu's grid system looks much worse
>Widths are percentages represented by fractions. All classes are constructed like .w-{nominator}/{denominator}. By default you have halves, thirds, quarters, fifths and sixths.
>Note that only the smallest fractions are generated; for example .w-2/4 doesn’t exist when both quarters and halves are in the settings, .w-1/2 take over it.
...wait, what? Seems way more complex than Bootstrap. The responsive example is even worse:
Yikes, appears to be BEM in naming conventions only, doesn't include the specificity flattening that makes BEM so nice. So when I want to overwrite this I need to use the > combinator?!It also appears to be totally lacking in JS components? Also missing many of the mixins that make Bootstrap more useful.
Bootstrap 4 gives the fonts a once over, adds some extra components [1] plus some contemporary starter templates [2] [3]. All-in-all I think v4 strikes a good balance of modern and sensible design.
[1] https://v4-alpha.getbootstrap.com/components/card/#card-deck...
[2] https://v4-alpha.getbootstrap.com/examples/album/
[3] https://v4-alpha.getbootstrap.com/examples/carousel/
You mean the default theme for 3? Eh, ok, make your own. I've never used the default theme.
>browsers support a lot of cool css features which a lot of times makes these frameworks useless
BS4 integrates these technolgies? I could write all my components using flexbox from scratch, but why would I when BS4 already has them?
>Bootstrap is the jQuery of CSS
The mixins, functions, helpers and utilities?! What have you replaced them with?
That's because:
1. It's well known, so anyone who joins the project will know how the framework works or how to use it. A less popular framework will require teaching new developers about it before it's really usable.
2. It has options. For most frameworks, it seems the only responsive design options are 'full screen' and 'mobile' with nothing in between. In Bootstrap, you can have the layout gradually change as the screen size gets smaller, which is useful.
3. They're used it. Seriously, it may surprise some people here, but a lot of web developers (and developers in general)are not particularly interested in technology or learning about shiny new platforms and tricks and will just stick to whatever they already know to pay the bills. For a lot of those 9-5 developers, Bootstrap (and Foundation) are just 'good enough' for their purposes.
So it's still relevant, especially outside of the startup bubble where developers don't care about anything other than a pay check.
This presumes using a framework. Why create a grid system with bootstrap, vs just creating a grid using the CSS that all current browsers support?
Old browsers might be a good answer, but many of us don't have the budget to support such a small amount of devices.
Speaking from agency world, big win for Bootstrap it's that its so much more than grid system, so once app is exposed to client's IT, they are able to pick it up and build upon it easier than they would've been able to with custom components.
Bootstrap is MUCH much more than a grid system
>vs just creating a grid using the CSS that all current browsers support?
Because the users that contribute to my conversions don't strictly use Chrome and Firefox? Because even if you are using CSS Grid a framework for it would still be a time-saver?
>but many of us don't have the budget to support such a small amount of devices
I don't have the budget to alienate my users using these devices.
I find it to be beyond compare, indeed many other frameworks will copy its component offerings and naming conventions.
Compared to 3, BS4 is really well-refined and solves a lot of issues. That + the flexbox enhancements make it a joy to use, personally.
The issue tracker has been at 99,9% with 2-3 open issues left for two months now.
The plan now is to test things and see if there's anything else that will need to change but changing of which in betas would be especially annoying to end users.
The other 2 are meta-issues which track hundreds of other issues.
Just sth. I noticed. Not at all relevant to the topic :P