Slide 1

Slide 1 text

React Native Storybook

Slide 2

Slide 2 text

Why?

Slide 3

Slide 3 text

Why? We create a lot of UI components

Slide 4

Slide 4 text

Why? We create a lot of UI components These components have multiple states Reusable Componen

Slide 5

Slide 5 text

Why? ate a lot of UI components mponents have multiple states Reusable Components

Slide 6

Slide 6 text

What?

Slide 7

Slide 7 text

Getting Started

Slide 8

Slide 8 text

Getting Started $getstorybook

Slide 9

Slide 9 text

Getting Started

Slide 10

Slide 10 text

Getting Started

Slide 11

Slide 11 text

Getting Started

Slide 12

Slide 12 text

Addons

Slide 13

Slide 13 text

Links Knobs Notes Info Options Storyshots Console Readme Addons Actions

Slide 14

Slide 14 text

Actions Allow you to inspect events related to your components.

Slide 15

Slide 15 text

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

Slide 16

Slide 16 text

Knobs Allow you to edit React props dynamically using the Storybook UI.

Slide 17

Slide 17 text

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.

Slide 18

Slide 18 text

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.

Slide 19

Slide 19 text

Storyshots

Slide 20

Slide 20 text

Fin