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:

  • 🖼 Ivy rendering support
  • 🎛 Auto-generated controls, documentation, dynamic source snippets
  • 🎁 Zero-config setup w/ built-in TypeScript support
  • 📚 Updated tutorials and documentation
  • 📦 Webpack5 support

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.

  • 🚀 Frameworks: Vue 3, Svelte Native story format
  • 📦…


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:

  • 🎁 Zero-config setup w/ built-in TypeScript support
  • 📝 A Svelte-native story format for capturing component states
  • 🎛 Auto-generated controls and documentation
  • 📚 Updated tutorials and documentation

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.

  1. Zero-config setup w/ built-in TypeScript support
  2. Auto-generated controls and documentation
  3. Automated snapshot…


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:

  • 🔍 Fast search and navigation UX
  • ⚡️ Foundational performance improvements
  • ⚛️ React 17 compatibility with fast refresh

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:

  • 💎 Essentials: Zero-configuration setup


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:

  1. Upgrading the Storybook packages
  2. Dealing with breaking changes
  3. Updating to current best practices

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…


Simple setup, instant productivity

Storybook’s greatest strength is also its weakness.

Thousands of leading teams from Airbnb to BBC choose Storybook because it works with diverse frameworks and tech stacks. Unfortunately, the abundance of configuration options can make Storybook tough to set up.

As maintainers, our goal is to get you setup quickly while preserving robust config options for advanced teams. That’s why I’m excited to share new 6.0 features that are a giant leap forward towards zero config Storybook.

  • 🧰 Built-in TypeScript support: Out of the box TS compatibility.
  • 💎 Storybook Essentials: Best practice addons for every project.
  • 🔌 Project Integrations: Presets for…


Live edit UI components with no code

Storybook is the world’s most popular UI component workshop. It’s used by Airbnb, Slack, Lyft, IBM, and thousands of top teams across the industry.

Storybook helps you build UI components in isolation and save their states as stories. A story is a simple function that renders a component given a set of arguments (props, inputs, slots, etc.).

But components are complicated. It’s hard to predict how a component will react to different values and write stories for all meaningful combinations. So it’s super useful to be able to explore the state space interactively.

That’s why I’m excited to announce Controls…


Next-gen, dynamic component examples

Storybook is the world’s most popular UI component workshop. It’s used by Airbnb, Slack, Lyft, IBM, Shopify, and thousands of top teams across the industry.

At its core, Storybook is a catalog of stories: small Javascript functions that capture isolated UI component states, making them incredibly useful for interactive development, testing, and documentation.

Now in Storybook 6.0, we’re excited to introduce Storybook Args, a foundational improvement to writing stories. Args allows stories to receive dynamic data as input arguments, unlocking a new level of story ergonomics, portability, and reuse.

Args are compatible with your existing stories but unlock new capabilities:

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