#Storybook
I have spent two solid days updating #Storybook to the latest version from vDidComputersEvenExistBackThen
#TechnicalDebt : #JustSayNo kids.
Honestly so impressed with how far #storybook has come.
Previously it was because of their interaction testing release. Now?
I just added it to a project using #Chakra #UI and it's automatically included every component and variant. Brilliant.
Looking through some random #frontend unit tests that’ve been failing for the past few months. Nothing serious, just mainly bs #css tests :thinking_rms: looking through them, I don’t think they actually ever worked. They all fail but the #storybook runs fine. Did the previous developer just make a bunch of one line unit tests that never worked? :itisamystery: that’s what I call code coverage! :NSFW_Stamp: #softwaredevelopment #qa
I have to admit, I’m not the most active frontend developer, my focus is backend. But I’ve really taken to using Storybook in my current project as I haven’t even touched building the actual app, just the components, and effectively “clicking” them in to place with the layouts has been so nice.
art by Charles Robinson (b.1869-d.1954) #art #arts #artists #artist #retro #vintage #books #book #bookstodon #illustration #fantasy #fantasyart #storybook #artlovers #storybooks #artnet #imagination #imagine #paintings #painting #retro #vintage #inspiration #motivation
angularday | 24th November 2023 | Verona (https://2023.angularday.it/):
"Love Story - Testing #angular components with #Storybook and #Playwright" was @TallyBarak 's talk at #angularday22.
Tally is Senior full stack developer at @Yoobic.
📽️https://t.co/1QES8VbbfA
Submit your talk prosposal for #angularday23
👉https://t.co/usbGktVhx9
Announcing the #AarhusJS September 14th meetup
- 🪑 Plenty of seats
- 🗣️ 2 awesome in-person talks #Microfrontends #Storybook
- 👥 Network with our #Community
- 🥪 Food and drinks
- 🎸 Live music by The Beach Berserkers
Sign up at https://meetu.ps/e/MgWFF/zVbZY/i
Introducing StoryLite, a lightweight alternative to #StoryBook built with #React and #Vitejs
https://blog.itsjavi.com/introducing-storylite-a-lightweight-alternative-to-storybook
This is a story of the Raven that flies alone in a forest that is no longer safe until it's unexpectedly wounded and its life enters a new dimension with the Dryad who finds it. But since she can't handle keeping the Raven, she takes it to her friend the Princess in the castle but...
I hope you enjoy my animation book!
Don't forget to send me your comments and criticisms below 😉✌️
#animationbook #storybook #terraria #animation #terrariaanimation #raven #lost #story #darkstory #scarystory
Yesterday I was working in #storybook and had the docs split to the side.
I had another window with #lemmy #elk and #freshrss split on my other screen. It was naice.
@shaedrich I do love Component explorers/galleries, but #storybook is just a huge and slow dependency. Last time I checked it was about 6 MB and slow as hell. I prefer Ladle (https://github.com/tajo/ladle) – but it has a lot less functionality.
It's been nearly a year since I updated my #storybook... and after a day's work it's still not complete, but I'm still proud of it!
Assuming you need one for your #QML work, fill your boots! It's #WebAssembly & #Emscripten ready for #Qt 6.x+:
My storybook is still for sale! I wrote and illustrated it myself! #books #book #storybook #author #illustrator #fox #dog https://www.lulu.com/shop/tesla-philipson/a-home-for-roxie/paperback/product-vzyjzq.html?q=A+home+for+roxie&page=1&pageSize=4
A long time ago, me and two of my pals made up some characters that were just little storybook animals that went on little adventures together. I decided they needed to continue existing and drew them again!
Mine's the Otter, and the Quokka and Axolotl are my friends!
#sfw #furry #anthro #chibi #storybook #otter #axolotl #quokka #art
I’ve recently been writing new addons and codemods for #storybook users.
Would anyone be interested in me living coding some more of this stuff on a stream to build cool stuff together? I’ve always wanted to try the format out but never got around to it.
#typescript #frontend #development
Hey friends 👋
I owe you an #introduction
My name is Shaun Evening, a software engineer located in Hamilton, Ontario, Canada. I'm also a #storybook maintainer.
I was diagnosed with ADHD and OCD in my mid 20s which would explain why I collect hobbies like stamps and hop to the next one when things don't feel right 😆
Other than that, I'm also a singer & bass player for a band, I have two Great Danes and a Pomeranian, and I love D&D
Hi team!
Here's how to share tests between Javascript frameworks for use in Storybook and unit tests! Examples show this working with React, Preact, Vue, and Svelte.
https://dev.to/scottnath/sharing-ui-tests-between-javascript-frameworks-2l6n
Who would have thought linking to another Web page was so difficult… 🤷♂️
https://github.com/storybookjs/storybook/issues/8618
Happy Friday!
Here's my next piece in my series on writing shared UI tests. This time on sharing tests between Storybook Interaction Tests and Vitest, Vite's native test runner.
Cheers!
https://dev.to/scottnath/sharing-interaction-tests-between-vitest-and-storybook-2pj2
Hi folks -
Here's an article I wrote breaking down how to locally run a composed Storybook instance that shows components from React, Vue, Preact and Svelte at the same time.
Cheers!
https://dev.to/scottnath/running-a-local-multi-framework-composition-storybook-506l
For those of you looking for #NuxtJS support in #Storybook, there's now an addon to do just that!
Sharing Interaction Tests Between Components
reduce your UI testing footprint while increasing coverage
https://dev.to/scottnath/sharing-interaction-tests-between-components-12b8
oh neat, bsky's #Storybook / #DesignSystem is viewable at staging.bsky.app/sys/debug (no account needed to view)
📖 If you're waiting for the right moment to join us, and also have a passing knowledge of #JavaScript and #Storybook then wait no more! Upgrading to v7 of Storybook is proving frustrating because of our use of SCSS modules. Help!
Reduce your testing footprint while increasing coverage with shared tests
https://dev.to/scottnath/shared-tests-how-to-write-reusable-storybook-interaction-tests-489c
Working on a new UI today.
It's a grind reimplementing the functionality #storybook already provides, but we need full control of static site generation to get ReactCAD component docs the way they should be: working without js, with prerendered preview jpegs and precomputed brep files and meshes for fast first render.
#Storybook 7.0 has been officially released, with an obligitory hype video: https://youtu.be/UF3d34a6kqg
Read the announcement for the deets on all the goodies like:
- First-class @vite support
- Zero-config Sveltekit
- Zero-config Next.js
- Improved #TypeScript type safety
- Full #pnpm support
Do you know of any beautiful examples of Component Libraries built with #storybook or #histoire? Preferably for #vue or #nuxt projects.
RTs / Boosts welcome 🙏
Hi fediverse,
I wrote this article about a new tool I created that makes Storybook a microservice!
https://dev.to/scottnath/storydocker-storybook-but-its-a-microservice-4ij1
I really really like Storybook.
I started a new project this week and other than a bit of time yesterday spent on prototyping some backend tech, I've spent the entire time in Storybook building my components.
Thrilled to be presenting at Storybook Day today (3/14), the first-ever #Storybook user conference! I’ll be sharing my process of creating a “Digital Garden” in Storybook with #React, #SVG, and #FramerMotion animation.
Conference is streaming here starting at 10:00am PDT, and my talk is at 12:43pm PDT:
Join me for Storybook Day tomorrow (March 14). I'll be talking about the performance improvements we've made in #storybook, how we achieved first-class #viteJS support, and what we've done to reduce the storybook install size.
See the full schedule at https://storybook.js.org/day/schedule, and join us in Discord to discuss and ask questions. https://discord.gg/storybook
Are you a Junior React Dev? Check our new article to improve your developer experience and make your code more maintainable and easier for others to collaborate
There's a new and faster way to create #storybook reproductions or experiments. Visit https://storybook.new/ and choose from one of the 32 templates to fire up a @stackblitz with the latest StoryBook versions.
Big thanks to the StackBlitz team for helping us get this set up. 🥳
And also to @astro for the inspiration with their excellent https://astro.new/ site.
Good news for #svelte / #sveltekit users out there who want to try out #storybook: https://storybook.js.org/blog/storybook-for-sveltekit/
@secondlife Stop reading my mind. I was just there this morning. #SecondLife #LostUnicornGallery #Storybook #Metaverse #VirtualWorlds #VirtualPhotography
📊 For fun and practice, I started making a tiny charts library. And I wrote about it!
https://herrherrmann.net/react-mini-charts/
Just set up a new personal project. Trying #Vitejs for the first time, and my first upgrade to #Storybook 7. Excited to be working with both. Was up and running in 5 minutes after watching this talk from @IanVS (thank you!)
For those still using
#Storybook v6, two things:
1) Why? Storybook v7 is much nicer. If you have problems upgrading, let me know.
2) Version 0.4.1 of the Vite builder finally supports @vite version 4, @vitejs/plugin-react-swc, and doesn't add @vitejs/plugin-react to all frameworks.
https://github.com/storybookjs/builder-vite/releases/tag/v0.4.1
I'm so happy about this. #Storybook 7 has proper #TypeScript support, including type safety using `satisfies`. Kasper Peulen has written up an excellent blog post explaining how to use it and the differences from the older Storybook typing: https://storybook.js.org/blog/improved-type-safety-in-storybook-7/
I gave a short 7 minute talk about it a while back, though it's not as detailed or up-to-date as the blog post. https://www.youtube.com/watch?v=5mAS7jXPrLk
2/x. Working in a Rush-managed repo with TypeScript, TSDX, design tokens, MUI, and an SVG library SVGR. It has been a week of writing a prototype, then solidifying into React components, testing in Storybook, and figuring out the naming. #React #Storybook
#icicles against a #cement wall in St. Mary’s #stmarys #Ontario #Canada that somehow also look like the #portal to a child’s #storybook world. #photography
After a long struggle to clean up dependencies, #Storybook no longer installs core-js into your node_modules, saving 13 mb or so.
Make sure to register for Storybook Day to hear more about this and other improvements in 7.0: https://storybook.js.org/day.
There are so many changes and improvements in #Storybook 7.0 that the migration guide was getting a bit out of hand. I took a shot at organizing it, hopefully it's easier to read now: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md
@viteconf @vite This talk was a ton of fun to put together, and I am honored to have been a part of #Viteconf.
#Storybook 7 is in a mostly-stable beta version now, so try it out! (See the end of the talk for the commands to run). And let me know if you have any questions!
Man, @astro has such a slick example picker at http://astro.new. I think #storybook could have something similar. We already have 30 #stackblitz templates set up, we just need a fancy picker page. Anyone interested in building it?
@SaragossaManuscript One of the things that helped me learn #accessibility was testing my components (and forms, and pages) in #Storybook using #TestingLibrary: https://storybook.js.org/blog/test-component-interactions-with-storybook/.
In order to test effectively, I needed to be sure to associate components together properly and use the correct roles, etc. I got good components, good tests, good documentation, and learned #a11y all at the same time. win win win win. :)
Question for my #WebDev and #WebDesign friends:
Do you use #Storybook?
Would love a reply explaining your answer.
Please boost if you also have developer and designer friends.
I'm honored to be counted among the "2022 core team" for #Storybook from my work on the #ViteJS builder. It's been a blast working with the team, 2022 brought tons of improvements, and I'm excited to see what we can do in 2023!
Read the latest blog post for a wrap-up of the year and look-ahead at what's next: https://storybook.js.org/blog/future-of-storybook-in-2023/
The latest #storybook 7.0 beta has a handful of small #pnpm fixes that I worked on over the last few days. Thank you to those who reported problems.
`pnpx sb@next init` to try it out.
https://github.com/storybookjs/storybook/releases/tag/v7.0.0-beta.19
Has anyone found a good way to automatically assign maintainers to #github issues based on how an issue template is filled out? I'd love to get assigned to #viteJs issues in the #storybook repo, for instance. So far this doesn't seem possible "off-the-shelf", but maybe someone has written an action to do something like this?
Pretty stoked to announce Storybook Day! It's March 14th and comes with free stickers. https://storybook.js.org/day
Storybook is having their first-ever user conference to celebrate the launch of #Storybook 7.0. I've got my ticket, and might be talking a bit about the built-in support for #ViteJS. Grab your free ticket to be a part of it as well.