Skip to content

Instantly share code, notes, and snippets.

@beijaflor
Last active September 26, 2016 14:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save beijaflor/23e647cec4789bf2a385c72f47fe1755 to your computer and use it in GitHub Desktop.
Save beijaflor/23e647cec4789bf2a385c72f47fe1755 to your computer and use it in GitHub Desktop.
React Storybook入門:コンポーネントカタログがさくさく作れちゃうかもしれないオシャレサンドボックス環境 ref: http://qiita.com/beijaflor/items/4fc01f8d557c1926c38d
import React from 'react';
import { storiesOf, action } from '@kadira/storybook';
storiesOf('Button', module)
.add('with a text', () => (
<button onClick={action('click')}>My First Button</button>
))
.add('with no text', () => (
<button></button>
));
import { configure } from '@kadira/storybook';
import 'css/style.css';
function loadStories() {
require('../components/stories/button');
}
configure(loadStories, module);
git clone https://github.com/kadira-samples/react-storybook-demo
npm install
npm run storybook
npm i --save-dev @kadira/storybook
npm i --save-dev babel-core babel-loader babel-preset-es2015 babel-preset-react babel-preset-stage-2 react react-dom stack-source-map webpack webpack-hot-middleware
npm run storybook
{
...
"scripts": {
"storybook": "start-storybook -p 9001"
}
...
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment