Out with boilerplate, in with scripted interactions!

Storybook is based on one core construct: the story. Everyone that uses Storybook writes stories for their component examples. Component Story Format is our expressive, platform-agnostic format that’s used across the industry from Netflix to Shopify and beyond.

I’m excited to announce Component Story Format 3.0. It’s the next major iteration of CSF that harnesses a year’s worth of community feedback to dramatically reduce boilerplate and allow you to focus on the essence of your stories.


Optimized for UI development

Storybook is the industry-standard UI development workshop for components and pages. It’s used by Dropbox, Shopify, Stripe, and thousands more teams.

Developers choose Storybook because it helps them focus on one thing: the user interface. There’s already a mountain of complexity in app development, Storybook makes your job is simpler by isolating UI concerns from the noise of backend, APIs, and data.

In 6.3, we examined the tasks UI developers do everyday — styling and testing — to see how they can be streamlined. …


Lightning-fast development with native ES Modules

Remember Javascript fatigue? It was 2015, and every few hours a new framework/boilerplate/build tool would burst onto the scene, one-upping the previous contender and shooting to the top of Hacker News.

Eventually, React and Webpack became a de facto standard and a relative peace fell across the land. Frontend devs were able to relax and get real work done rather than frantically switching tools every few weeks.

Today, the web tooling world is undergoing a new upheaval, with compelling new Webpack alternatives rocketing up the charts. Snowpack, ESBuild, Vite, SWC, Rome, Parcel, Rollup… the list goes on.

At Storybook, the…


Storybook, the most popular component workshop, is getting its biggest Angular upgrade ever. Storybook for Angular has been completely reworked and improves every facet of the experience from the rendering engine to the auto-documentation support.

The new release, available in Storybook 6.3, includes:

This is all in addition to the large ecosystem of development, testing, and documentation addons already available to Angular users. Read on for a full tour of the new features!


Future-proof component development

Storybook is the industry standard UI development workshop for components and pages. It’s used by Netflix, Slack, Target, Shopify, Stripe, and thousands of teams around the world.

As a modern frontend developer, you’re in a constant cat-and-mouse game to stay on top of ecosystem changes. Every Storybook release contains hundreds of adaptations to try to make that easier for you, whether you’re upgrading a library, or migrating from one framework to another.

Storybook 6.2 is a giant leap towards future-proofing your UI development workflow that includes significant improvements and new features.


The workshop for cybernetically enhanced components

Storybook, the most popular component workshop, is getting its biggest Svelte upgrade ever. Storybook for Svelte has been completely reworked and improves every facet of the experience from the way you write stories to the underlying implementation.

The new release, available in Storybook 6.2, includes:

This is all in addition to the large ecosystem of development, testing, and documentation addons already available to Svelte users. …


Supporting the next-gen progressive JS framework

Vue 3 is the latest major installment of Vue.js that features better ergonomics, better performance, and new APIs for managing large apps.

Storybook is an open source tool for building UI components. It speeds up UI development, generates documentation, and automates testing. This versatility makes it the tool of choice at Netflix, Twitter, GitHub, Slack, and Microsoft.

Thousands of Vue 2 projects already use Storybook to build UIs faster. We’re excited to ship official Vue 3 support for the next-gen framework. All of Storybook’s core features are included.


Engineered for rapid UI development

Storybook is the industry standard UI component workshop. It organizes components and their states to structure UI development, testing, and documentation. It’s used by teams at Twitter, Slack, Airbnb, Shopify, Stripe, and Microsoft.

As Storybook grows in popularity, companies are building more components in it than ever before. Atomic components, full blown pages, and everything in between.

Performance becomes a problem when you’re dealing with hundreds of components. That’s why Storybook 6.1 is focused on improving performance:

The need for speed

When Storybook launched in 2016, hot…


Production-grade component development

Storybook is the world’s favorite component workshop, widely adopted by industry giants, startups, and open source projects alike. It organizes components and their states to structure UI development, testing, and documentation for every major view layer.

The 6.0 release retools Storybook for professional frontend developers.

We researched leading teams at companies like BBC, IBM, Cisco, and Shopify. These teams have successfully scaled component libraries and pioneered their own best-practices.

The new Storybook incorporates these best practices so that all teams can benefit. What’s more, we removed boilerplate and configuration to streamline your developer experience. It includes:


Level up your component development platform

This step-by-step guide gets you upgraded to Storybook 6.0 (SB6).

Every year we release a major version of Storybook. Last Spring, that was Storybook 5.0, an incredible makeover of the user interface. This year, we’ve radically improved Storybook’s developer experience. We’ve turned it into a best-in-class documentation tool, and have completely overhauled configuration and story authoring in the process.

This guide takes you through:

We assume you’re coming from a 5.0 project and tell you everything you need to know to upgrade. If you’ve been tracking the…

Michael Shilman

energetic engineer 👷 frequent flyer 🚀 eternal optimist ❤️

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store