UI Development with StoryBook - Tuong-Nguyen/JavaScript-Structure GitHub Wiki

StoryBook https://storybook.js.org/

  • Install npm i -g @storybook/cli

  • Configure StoryBook Add a folder .storybook and add file config.js. This file loads stories in index.js file

import { configure } from '@storybook/react';

function loadStories() {
  require('../src/stories/index');
}

configure(loadStories, module);
  • Add a story
import React from 'react';
import { storiesOf } from '@storybook/react';
import Button from 'material-ui/Button';

storiesOf('materialUI.Button', module)
  // This is a story
  .add('Flat button with UPPERCASE TEXT', () => (
    <Button>Hello world</Button>
  ));

// In file index.js: import this file
  • Run StoryBook
npm run storybook

Add-ons

⚠️ **GitHub.com Fallback** ⚠️