Upgrade to Pro — share decks privately, control downloads, hide ads and more …

React Native Storybook

Avatar for AppFoundry AppFoundry
October 19, 2017
Programming
0
480

React Native Storybook

A brief presentation on React Native Storybook by Senne Van Cauwenberge

Avatar for AppFoundry

AppFoundry

October 19, 2017
Tweet

More Decks by AppFoundry

See All by AppFoundry
Introductie iOS - Jens
Avatar for AppFoundry appfoundrybe
0
110
Android In Practice
Avatar for AppFoundry appfoundrybe
0
150
Android Introduction 3.0 by Siebe
Avatar for AppFoundry appfoundrybe
0
120
Android in Practice (long)
Avatar for AppFoundry appfoundrybe
0
210
React Native - cross-platform mobile app development
Avatar for AppFoundry appfoundrybe
0
190
the ionic crash course
Avatar for AppFoundry appfoundrybe
1
190
View based apps with Conductor
Avatar for AppFoundry appfoundrybe
0
650
Android Accessibility at GDG Devfest Brussels 2016
Avatar for AppFoundry appfoundrybe
0
650
Cooking with Spek
Avatar for AppFoundry appfoundrybe
0
660

Other Decks in Programming

See All in Programming
アプリプラットフォームにおける、レガシー基盤刷新の戦略
Avatar for masaki-s masaki12
0
110
CSC307 Lecture 10
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
1
680
生成AIを使ったコードレビューで定性的に品質カバー
Avatar for Chiaki Okamoto chiilog
1
300
AIエージェント、”どう作るか”で差は出るか？ / AI Agents: Does the "How" Make a Difference?
Avatar for r-kagaya rkaga
4
2.1k
Package Management Learnings from Homebrew
Avatar for Mike McQuaid mikemcquaid
0
240
Automatic Grammar Agreementと Markdown Extended Attributes
について
Avatar for Kishikawa Katsumi kishikawakatsumi
0
200
OCaml 5でモダンな並列プログラミングを Enjoyしよう!
Avatar for Haochen Kotoi-Xie haochenx
0
160
Metaprogramming isn't real, it can't hurt you
Avatar for Masafumi Okura okuramasafumi
0
110
20260127_試行錯誤の結晶を1冊に。著者が解説 先輩データサイエンティストからの指南書 / author's_commentary_ds_instructions_guide
Avatar for nash_efp nash_efp
1
1k
Gemini for developers
Avatar for Mete Atamel meteatamel
0
110
Rubyと楽しいをつくる / Creating joy with Ruby
Avatar for chobishiba chobishiba
0
160
AIに仕事を丸投げしたら、本当に楽になれるのか
Avatar for ディップ株式会社 dip_tech
PRO
0
120

Featured

See All Featured
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
11
840
Information Architects: The Missing Link in Design Systems
Avatar for Michelle Chin soysaucechin
0
790
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
49
9.9k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
32
2.2k
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.1k
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1371
200k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
34k
Agile Leadership in an Agile Organization
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
92
Impact Scores and Hybrid Strategies: The future of link building
Avatar for Tamara Novitovic tamaranovitovic
0
210
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
58k
HDC tutorial
Avatar for Michiel Stock michielstock
1
410
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
10
1.1k

Transcript

  1. React Native Storybook

  2. Why?

  3. Why? We create a lot of UI components

  4. Why? We create a lot of UI components These components

    have multiple states Reusable Componen

  5. Why? ate a lot of UI components mponents have multiple

    states Reusable Components

  6. What?

  7. Getting Started

  8. Getting Started $getstorybook

  9. Getting Started

  10. Getting Started

  11. Getting Started

  12. Addons

  13. Links Knobs Notes Info Options Storyshots Console Readme Addons Actions

  14. Actions Allow you to inspect events related to your components.

  15. Links With links you can link stories together.
 (And make

    prototypes)

  16. Knobs Allow you to edit React props dynamically using the

    Storybook UI.

  17. Notes Allows you to write notes for each story in

    your component. Info Allows you to build a nice-looking style guide with docs, automatic sample source code with a PropType explorer.

  18. Options Allows you to customise the Storybook webapp UI. Console

    Redirects console output (logs, errors, warnings) into Action Logger Panel. Readme Allows you to add docs in markdown format for each story.

  19. Storyshots

  20. Fin