Storybook

View and develop rich UI components interactively with Storybook.

Storybook is an open source tool for developing UI components in isolation. It makes building stunning UIs organised and efficient. This amazing feature is available in this UI theme.

To view and develop UI components with Storybook:

  • Make sure you have installed and setup the project. Follow the installation guide if you haven't done so yet.

  • Make sure the React Native packager is running -- yarn start

  • Open src/App.js

Update the storybook state

state = {
  fontLoaded: false,
  storybook: true //not `false`
}

Start the Storybook server

yarn storybook

The above command will compile all the stories for presentation in the app. Stories are located in the src/app/stories directory

Open the app in your simulator or physical device. You will now be able to develop your UI components interactively,

To view the app in the normal mode (i.e without Storybook):

Update the storybook state in src/App.js

state = {
  fontLoaded: false,
  storybook: false //not `true`
}

You can stop the storybook server at this point withCtrl+C

Last updated