Vue on Storybook

Node gakuen #26 in Japan

Transcript

1. Vue on Storybook Node Gakuen #26 2017-06-28 @kazupon
2. Who are you ?
3. kazupon Vue.js Core Team Vue.js japan users group organizer vue-i18n, vue docs maintainer CUUSOO SYSTEM CTO @kazu_pon kazupon
4. [PR]
5. 2017-07-07
6. Vue.js v-meetup #4 https://vuejs-meetup.connpass.com/event/58071/
7. Reporting about VueConf https://conf.vuejs.org
8. We are hiring!! Front-end engineer Wanted!! 
 Let’s building Open Innovation Platform!! http://www.cuusoo.co.jp
9. Introduction ⛩
10. What’s Storybook?
12. Oops! I’m so sorry!
13. What’s Storybook? https://storybook.js.org
14. Storybook histories • Apr 2016 : Release “React Storybook” (Storybook 1.0) • Sep 2016 : Release as “Storybook” (Storybook 2.0) • Dec 2016 : Kadira Shut Down • Jan 2017 : Storybook development Idle • Mar 2017 : Provocative GitHub Issue #731 • Apr 2017 : Kick-off Commutiby based Open Source Project • May 2017 : Release Storybook 3.0 https://medium.com/storybookjs/the-storybook-story-dd3c1ab0d2ce
15. For Vue.js ?
16. vue-play • Inspired by Storybook https://github.com/vue-play
17. 2017-05-28
18. Posted issue #64 on vue-play https://github.com/vue-play/vue-play/issues/64
20. Other Frameworks or Libraries !?
21. Saw Roadmap of Storybook
24. WoW!! That’s interesting!!
25. Feature Request on Storybook https://github.com/storybooks/storybook/issues/1262
26. Need to help! https://twitter.com/left_pad/status/874273519764463618
27. Joined as Collaborator
28. How to support Vue on Storybook
29. Storybook Architecture Preview (iframe) Manager 2 Entry Points !! podda (store) store
30. Render preview via postMessage Preview (iframe) Manager podda (store) store 3. postMessage 1. Select 2. handle story 4. get story 5. render component
31. How to render Vue Components in Preview
32. Replace React to Vue Preview (iframe) Manager podda (store) store
33. So that’s it?
34. Preview for React error-display root
35. Preview for Vue error-display root
36. https://twitter.com/kazu_pon/status/876482321578303488
37. DEMO
38. Addon are supported? • Current Support addons: • addon-actions • addon-links • addon-knobs • addon-notes • In other addons, will be supported since 3.2
39. Storybook 3.2 Coming soon …
40. Conclusion
41. Conclusion • Since Storybook 3.2, you'll be able to use the Vue components. • You’ll be able to accelerate development efficiency. • I have some ideas of Storybook for Vue. • I’ll try to contribution as Storybook team member.
42. Thanks!