Buefy: UI Components for Vue.js Based on Bulma
buefy.org
buefy.org
If you happen to fall within the aforementioned niche, Buefy is definitely worth a try. The Form components alone are worth their weight in kilobytes and greatly simplify your templates. The components, props, and events use logical naming conventions and the examples in the docs work out of the box and are easy to customize.
I love how readable this is as opposed to a series of nested divs and classes:
<b-field label="Email"
type="is-danger"
message="This email is invalid">
<b-input type="email"
value="john@"
maxlength="30">
</b-input>
</b-field>
import { Table } from 'buefy/dist/components/table'
import { Input } from 'buefy/dist/components/input'What's the alternative to declaring our UI using pseudo-html elements and string-matching on css class proxies from the currently-in-favour CSS framework which sits on top of the javascript framework of the moment which, after going through several transpilation steps to become plain old javascript, then sits on the client manipulating a shadow-DOM, to finally render plain old html?
No idea. Hopefully some nice solutions will arise from other languages which compile to wasm - I would expect all the major players to be looking at coming up with something to that effect now that the world seems ready for Silverlight 2.0 and everyone loves writing frameworks.[1]
Until then, any solution will unfortunately probably involve adding yet another level to the house of cards, maybe one which compiles down to buefy or the Vue bootstrap components..
[1] yeah, I see the irony in that it's just another stack which will probably be just as insane in many ways, but at least it will compile in less than 5mins.
I get the feeling that Buefy's approach is to use custom elements instead of native elements? So something like an <input> element becomes some <b-field> thing?
I am sceptical if that is a good thing. I would not want to swap out all regular html for some fantasy elements of a library.
Nevertheless, in the more restricted question of using custom elements to replace CSS classes, you may have a point; many libraries that try to do this typically end up with a far more restricted use case since a custom components library is less open to extension than CSS classes, and custom components authors often fail to anticipate ways in which CSS frameworks are used. (e.g. using a CSS class with a standard HTML tag, and then, using a CSS class with a custom component)
Working with custom "fantasy" elements is quite
typical of modern frontend development
To use a more accurate analogy, they are akin to building an ALU with the use of a an adder (a fantasy component abstracting away the NAND gates) rather than completely in NAND gates.
Sure, maybe we just met (2 seconds ago) but we sure as hell are not jumping into the bed that quick.
You know what I mean? Made me close the page immediately.
As far as I can see, it is basically doing almost exactly what jQuery does in Bootstrap...can someone perhaps set me straight with this?
A lot of projects/products get posted to HN with promotional titles. If we always went with their own descriptions, HN's front page would be a lot noisier and less to our readers' taste. They prefer factual and neutral language.
It's true that the word 'lightweight' in the title above wasn't that bad, but if one reader complains, it's likely that some others feel the same way. We've learned to trust such community reactions.