Developing components with stories

The value of Storybook is that you don't have to set up an application to start hacking components. Or, if you already have an application under development, you don't have to figure out how to integrate in-progress components into your app. Storybook is a tool that enables experimentation. Through the use of add-ons, you can test almost any aspect of your component before worrying about integrating it into your application.

Experimenting with props

Perhaps, the most straightforward way to get started with developing components in Storybook is to start experimenting with different property values. To do so, you just have to create different stories of your component, each with different property values.

First, let's take a look at the component that you're working on:

import React from 'react'; 
 
const MyComponent = ({ title, content, titleStyle, contentStyle }) => ( 
  <section> 
    <heading> 
      <h2 style={titleStyle}>{title}&lt...