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

React Native Storybook

Avatar for AppFoundry AppFoundry
October 19, 2017
Programming
0
450

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
97
Android In Practice
Avatar for AppFoundry appfoundrybe
0
140
Android Introduction 3.0 by Siebe
Avatar for AppFoundry appfoundrybe
0
110
Android in Practice (long)
Avatar for AppFoundry appfoundrybe
0
200
React Native - cross-platform mobile app development
Avatar for AppFoundry appfoundrybe
0
170
the ionic crash course
Avatar for AppFoundry appfoundrybe
1
180
View based apps with Conductor
Avatar for AppFoundry appfoundrybe
0
630
Android Accessibility at GDG Devfest Brussels 2016
Avatar for AppFoundry appfoundrybe
0
570
Cooking with Spek
Avatar for AppFoundry appfoundrybe
0
640

Other Decks in Programming

See All in Programming
「待たせ上手」なスケルトンスクリーン、 そのUXの裏側
Avatar for teamLab teamlab
PRO
0
460
Namespace and Its Future
Avatar for Satoshi Tagomori tagomoris
6
700
2025 年のコーディングエージェントの現在地とエンジニアの仕事の変化について
Avatar for azukiazusa azukiazusa1
21
11k
オープンセミナー2025@広島 「君はどこで動かすか？」 アンケート結果
Avatar for Satoshi Kaneyasu satoshi256kbyte
0
260
Tool Catalog Agent for Bedrock AgentCore Gateway
Avatar for matsukada licux
6
2.2k
Putting The Genie in the Bottle - A Crash Course on running LLMs on Android
Avatar for Iury Souza iurysza
0
140
Laravel Boost 超入門
Avatar for Arlo fire_arlo
2
210
個人軟體時代
Avatar for Ethan Huang ethanhuang13
0
320
@Environment(\.keyPath)那么好我不允许你们不知道！ / atEnvironment keyPath is so good and you should know it!
Avatar for Elvis Shi lovee
0
110
ソフトウェアテスト徹底指南書の紹介
Avatar for Hiroki Iseri goyoki
1
150
旅行プランAIエージェント開発の裏側
Avatar for Ippo Matsui / 令和トラベル ippo012
2
880
Ruby×iOSアプリ開発 ~共に歩んだエコシステムの物語~
Avatar for Tomoki Kobayashi temoki
0
270

Featured

See All Featured
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
23
1.4k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
83
9.2k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
2.8k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
77
6k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
9
800
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
57
5.8k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.4k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
224
9.9k
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
96
6.2k
Side Projects
Avatar for Sacha Greif sachag
455
43k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
512
110k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.8k

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