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

React Native Storybook

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for AppFoundry AppFoundry
October 19, 2017
Programming
500
0

React Native Storybook

A brief presentation on React Native Storybook by Senne Van Cauwenberge

Avatar for AppFoundry

AppFoundry

October 19, 2017

More Decks by AppFoundry

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

Other Decks in Programming

See All in Programming
【デモ】Kiroで体験する仕様駆動開発｜設計からコーディングまでAIと進める開発フロー
Avatar for 工藤皓夢 cmkudo
0
600
異なる設計思想のフレームワークを経験して得た学び
Avatar for amekuhideki amekuhideki
2
1.5k
不幸な GC
Avatar for Chen chencmd
0
890
From 6 People Classroom Meetup to 100 People Regional Conference / FOSS4G Hiroshima 2026
Avatar for YFurukawa furukawayasuto
0
110
Seeing Through Serverless: Observability for AWS Lambda with ADOT and CloudWatch Application Signals
Avatar for shiro seike seike460
PRO
1
120
PyO3 で既存 Python 評価器を Rust core 化する ー wasm-bindgen でブラウザにも配るための設計
Avatar for 𝕂' kdash
1
520
「つくるAI」だけではバグは見つからない　～テストに必要な「見つけるAI」を分離させる戦略～
Avatar for Masahiko Funaki(舟木 将彦) mfunaki
0
230
Discordを用いたラボオートメーション関連情報収集の自動化
Avatar for noguhiro2002 noguhiro2002
0
500
新人はどこまで自力でやり、どこからAIに頼るべきか／エンジニア育成に向き合う_先輩たちの悩みと知見共有会
Avatar for TOPPAN ict toppan_digital_dev
1
570
アクセシビリティから考える情報設計
Avatar for high-g high_g_engineer
0
280
片田舎のおっさん、 Swift Buildのダイアモンド問題解決の不具合修正PRを出すが、解決方法がキャッシュをしないようにすることであり、ビルド時間が伸びると言われてマージされないので高速化もする/swiftbuild
Avatar for yimajo yimajo
0
360
Vibes Containers 〜AIで変わるコンテナ設計と運用〜
Avatar for Tetsuya Kikuchi tkikuc
2
500

Featured

See All Featured
Docker and Python
Avatar for Tania Allard trallard
47
4.2k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
1
1.9k
[RailsConf 2023] Rails as a piece of cake
Avatar for Vladimir Dementyev palkan
59
7k
Claude Code のすすめ
Avatar for schroneko schroneko
67
230k
What’s in a name? Adding method to the madness
Avatar for The Alliance productmarketing
PRO
24
4.2k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
301
52k
Jamie Indigo - Trashchat’s Guide to Black Boxes: Technical SEO Tactics for LLMs
Avatar for Tech SEO Connect techseoconnect
PRO
0
660
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.5k
The SEO identity crisis: Don't let AI make you average
Avatar for Varn varn
0
550
How Fast Is Fast Enough? [PerfNow 2025]
Avatar for Tammy Everts tammyeverts
3
870
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
Avatar for konakalab konakalab
0
580
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
270
14k

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