Histoire: A new way to write stories, powered by Vite
histoire.dev
histoire.dev
In short: The "stories" here are frontend components that are being rendered in isolation, with the ability to play with their params. It's also a nice way to document custom components in a project (this would be the "book" I guess). Storybook¹ is the mature project in this area.
As for Vite it's an alternative to Webpack which has gained rapid popularity - I've enjoyed using for its relatively light configuration and very fast live reloading support.
⸺
¹https://storybook.js.org/ (much better landing page)
I do like Vite a lot, but I don't really see the relevance of the "powered by Vite" unless the whole thing is basically a sales pitch for Vite.
1. If you’re already using Vite, you know it will integrate easily
2. If you’re not using Vite, if you know what Vite is, you at least know it’s fast and easy to configure
3. The fact that it’s made by a Vue core dev means it’s likely very good. There are a number of such “powered by Vite” tools with good reputations
I'm mainly saying this because I had a similar mentality to you -- I didn't see the point -- but I now use it even on personal projects. It's nice to be able to easily see my various widgets isolated, on their own and tweakable without needing to navigate five layers deep into my application to alter them.
It should probably never have been so productized, because it is way more complex than it needs to be. Again, it’s a very simple idea, and in my experience, many teams use only the most basic setup, and have never really considered why they took on a VC-funded dependency just to render some components.
I'm fine with just the standard most appropriate generic word, whether it be module, component, database, etc.
What a clever naming scheme! Nobody reads stories or books anymore, so when they see the word “story” they’ll automatically assume you mean UX Story! This isn’t ridiculously confusing at all.
And to be clear when I say write I mean like a novel or blog post. Like with the English language.
Overloading is fine. Ambiguous use of an overloaded term is not. What is one to think of when they see words like "write", "stories", and God forbid, "book"?
Storybook stories, of course.
At most you can critique the HN headline drawing in randoms, which is a legitimate complaint, but I don’t see a problem with their copy especially for a brand new OSS project. Marketing sites are usually an after thought that improve after the first year.
Unless, you know, you think this new volunteer project should be selling you on using well documented component libraries or something.
Sarcasm aside, I actually do like Vite quite a bit. And I still think my main point stands that a framework that exists to document components co-opting the word “book” is ridiculous.
Even the use of french. Why French? Because it's really so exotic?
> With the release of Vue 3, a Storybook alternative named Histoire has gained some traction. In this blog post, we’ll explore how to create interactive documentation of UI components for Vue 3 projects. As with Storybook, Histoire is designed for making your life much easier to create living style-guides and component showcases.
> Write stories to showcase and document your components.
Until having used it, I was having similar questions about the domain of Storybook.
But this sentence (first paragraph below the header and menu) sums it up clearly for every frontend developer IMO.
Also this is linked and goes into more detail about what a "story" is:
Then I thought it was a tool for writing books.
Then finally I discovered that it's a Storybook alternative. I think.
Is this considered a story? https://vue3.examples.histoire.dev/story/tailwind?variantId=...
It seems to me — as someone who uses these tools but has no inside knowledge of the Vue community — that this community just has a really well-developed engineering culture and is producing tools in line with that culture that are all really good and integrate well together. It’s hard to understand why you wouldn’t want that if you could get it!
I always check for committed and professional open source devs before I consider a project. The devs behind this one are experienced Vue folks.
Looking forward to giving it a try.
- the project is Vite forward
- looks like React and Solid (and Angular) are in the roadmap
Seeking input from experts: how long until that day? Or is this that tool…?
However, the tool does look nice, if the 'hook' for the site isn't that explanatory. I might like to try it on svelte, I wonder how hard it'd be to integrate with laravel+livewire+alpine stack, because there's nothing like this for that. Probably a big value too.
It does look like a great tool, I would definitely give it a try first before going to storybook.