Bootstrap 3.4.0 released

https://blog.getbootstrap.com/2018/12/13/bootstrap-3-4-0/

by pplonski86 • 8 years ago

206 62 8 years ago

blog.getbootstrap.com

PacifyFish• 8 years ago

I recently started using Semantic UI instead of bootstrap, and I felt productive in ~20 minutes. It was amazing. Never going back!

russian_bot• 8 years ago

What were the benefits over using Bootstrap? Interested. I use bootstrap a lot, so I feel as if it is easy to be productive, but always exploring alternatives.

adpirz• 8 years ago

I find Semantic's React library to be great and it's well maintained, so if you're using React, I think it has a leg up over Bootstrap there, also just more keen on the aesthetic and design choices.

qwerty4561274• 8 years ago

Excuse me for a stupid question, how does Semantic UI compare to React and Angular? I seek to pick up a framework and start developing browser-based GUI apps and don't know which to choose. I want to just layout GUI widgets and code the logic without using any Photoshop or anything like that.

magnetic• 8 years ago

They're different things. Semantic is the UI framework that you can use from React (in fact, there is a react-semantic-ui npm) or other.

React will deal with lifecycle of objects on the screen and state machines to mutate them, but the actual look & feel of the widgetry is defined by whatever ui framework you decide to use (bootstrap, semantic, blueprint, etc).

Techasura• 8 years ago

Well, At first semantic UI is a UI library which helps in providing pre-built UI components. React and Angular are Frontend frameworks, which helps in performance and code modularity. Photoshop is a photo editor, although people used to make layouts with it long ago,,, not anymore, instead people are using Sketch. You can of course code the logic using plain simple JS, HTML, CSS and you can make widgets as well, unless you mean desktop widgets - for that you need electron.

digitaltrees• 8 years ago

Quasar-framework is awesome. It is a Vue library with lots of components.

mcast• 8 years ago

FYI: Semantic UI has one of the largest file sizes for CSS libraries at 730 KB uncompressed, 95 KB gzipped - add in React and you'll reach 1MB in no time.

https://gist.github.com/primaryobjects/64a4e7e3351c646f51eee...

z3t43• 8 years ago

i guess removing unused rules on deployment would reduce the file size. But a few kb is not much today - with auto playing hd videos on Facebook et. al.

sdinsn2• 8 years ago

550 KB minified*

Also, it's unclear if the comparison is actually fair- some of these, like Semantic, contain a shit ton of icons.

cyberEst1919• 8 years ago

use something to remove unused css in your build process. i use purgeCss for that.. https://github.com/FullHuman/purgecss so simple and yet so powerful!

kevmo• 8 years ago

I feel that way with pretty much every CSS library that has at least 1,000 stars on GitHub.

forlorn• 8 years ago

I can say the same about Tachyons.

kondro• 8 years ago

The biggest gotcha for Semantic UI is that it requires FlexBox support which is extremely buggy (or non-existent) in IE 10 and 11. Edge is OK (mostly), but there are a lot of users still on IE 10/11.

acdha2• 8 years ago

That's good to know since they carefully avoid mentioning anything about browser compatibility on their site. Bootstrap 4 also uses flexbox but they have done a good job supporting IE 11, which is good: on a general audience site I see ~2.5% of traffic from IE11 worldwide whereas IE10 is ~0.08% so it's much easier to write off.

I was also disappointed to see zero mention of accessibility, which is a deal-breaker for government and large business sites.

andrewstuart• 8 years ago

Which of the CSS frameworks works best with ReactJS?

dfee2• 8 years ago

Shameless plug: I just put `rbx` 1.0 together which has 100% coverage and fully implements the Bulma framework for React.

Every component has a story, and it’s written in TypeScript (transpiled to JS). I hope to get around to releasing this big update on npm tonight(!) but for now you can use the code straight from GitHub.

Also, the wrapping is complete yet minimal - there are only a couple components with state and you can override those with a `managed` flag.

Also, every component supports ref forwarding (using of course `ref`), and can render as any other component using the `as` prop. For example, if you want to bring your own Form, Link, or Table framework, this will work with that seemlessly.

  <Button color=‘primary’ as={Link} to=‘/‘>Go home</Button>

https://github.com/dfee/rbx

thomasfedb• 8 years ago

Looks promising. Any ideas about handling date/time in a way that's consistent with this and also works across desktop and mobile?

sooheon• 8 years ago

Awesome, love the storybook. Components>Media>Input is broken FYI.

diesal11• 8 years ago

I've been using reactstrap[0], it's everything you'd expect from bootstrap react bindings and has been great while i've been leaning React this year.

No doubt there would be better solutions more tailored to react out there.

[0] http://reactstrap.github.io/

manigandham• 8 years ago

If you're using a frontend view engine like React then I'd recommend looking into component-based CSS frameworks like https://tachyons.io/ or https://tailwindcss.com/ where you have classes for the basics and add them together for the final output. It's a natural fit to view components.

androidgirl• 8 years ago

+1 for tachyons. Tachyons + React is very powerful.

cygned• 8 years ago

I have tried both with quite complicated applications and I have to say that I prefer tailwind.

With PostCSS in your pipeline, you can add the tailwind plugin and start composing CSS. This way, you can use your configuration even in places where you are required to write CSS (e.g. for transitions or media queries):

    @screen xs {
      .item {
        @apply border-b border-blue-darker;
        transition: background-color 0.2s;
      }
    }

kowdermeister• 8 years ago

Take a look at: https://ant.design/

It's a UI library with all imaginable widgets.

bpicolo• 8 years ago

I picked ant.design for a recent project - it's pretty darn sweet.

element (in vue) is also pretty terrific: https://element.eleme.io/

kmlx• 8 years ago

More than just CSS, we use Material UI: https://material-ui.com/

Achshar• 8 years ago

None, go vanilla.

dlbucci• 8 years ago

Surprised to see this, but good on them for fixing the XSS issues!

appleiigs2• 8 years ago

Yeah a lot of people, including me, were waiting that. Not able to rebuild to Bootstrap 4 at this point in time. Google Lighthouse was complaining about that Bootstrap 3 was not secure.

tamalsaha001• 8 years ago

We have switched to https://bulma.io/ recently. Combined with Vue.js we can finally get rid of Jquery.

tekknolagi• 8 years ago

Your link is wrong because there's no space between the project URL and your adverb.

CraftThatBlock• 8 years ago

You can use Bootstrap without jQuery too. For instance, reactstrap doesn't use jQuery.

adevx• 8 years ago

There is also bootstrap-vue.js.org/ which does not use jQuery.

soci• 8 years ago

What is the main problem of the Jquery dependency that existed in Bootstrap before v4 ?

fyfy18• 8 years ago

If the developers read this, one thing I really liked about Bootstrap (v3 anyway, they've changed it for v4) is that the documentation is a few long HTML pages[0]. As a user, it makes it really easy to see what components are available and to search the documentation (I can just use Ctrl-F).

[0] https://getbootstrap.com/docs/3.3/components/

arvidkahl• 8 years ago

This is great. I appreciate an open-source project looking at the amount of developers working on locked-in legacy projects where dependency upgrades take years.

This is a rare moment of empathy in an industry that - judging from other comments here - is ALWAYS on the hunt for the next best thing. Bootstrap has brought me joy and made my life as a developer much easier. Thank you to @mdo & team for keeping it that way.

winrid2• 8 years ago

Yeah definitely appreciated. We are still stuck on angular bootstrap 0.13...

boredpudding• 8 years ago

Do you mean this package or something else? https://www.npmjs.com/package/angular-bootstrap

Bahamut• 8 years ago

A prior maintainer of that lib here - that library is a behemoth.

Unfortunately I ran out of time to be able to continue to maintain it, and now work for one of those big tech companies that requires a lot of approvals to participate in open source anymore unfortunately :( . There are a lot of good fixes pre-2.0 though if you can upgrade to it!

Probably one of the biggest disincentives for continuing to me though were some of the users - some were outright abusive.

chaitanya• 8 years ago

You can use bootstrap without jquery today with bootstrap native:

https://github.com/thednp/bootstrap.native

It supports most (if not all) of bootstrap’s components, and works well enough that even large-ish projects can do without bootstrap.js (which needs jquery).

fuckthecops• 8 years ago

Ant Design is the best UI library in 2018. The amount of components you get out of the box has no comparison.

sergiotapia• 8 years ago

I thought Bootstrap 4 was released months ago? :S

amatera• 8 years ago

And then you thought that millions of websites, a lot of commercialy crafted for customers, adopted it in no time? So an update, to the most used version which has even security isseus is not nessacary? You live in a nice world :)

tannhaeuser2• 8 years ago

Link to bootstrap-sass for 3.4 404's.

tannhaeuser2• 8 years ago

It's working now. Congrats to the Bootstrap team for outstanding free maintenance. Looking forward to v5.

Bootstrap 3.4.0 released

Related Stories