Search⌘ K
AI Features
Home
Courses
Quick Start Full Stack Web Development

storiesOf() and Placeholders

Explore how to use the storiesOf API and placeholders in Storybook to build and test reusable React components. Understand how to manage global styles with addDecorator and enhance UI testing for React and React Native applications.

We'll cover the following...

Different approaches to show stories

The stories so far have been shown in the Component Story Format (CSF). This approach’s main benefit is that the created ...

Node.js
import React from 'react';
import { storiesOf } from '@storybook/react';
import { Collatz } from '../App.js';
storiesOf('Collatz sequence', module)
    .add('For 8', () => <Collatz number={8} />)
    .add('For 101', () => <Collatz number={101} />)
    .add('See multiple', () => <div> { [ 17, 22, 57 ].map(x => <Collatz number={x} />) } </div>);
...