npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

wix-react-native-storybook-server

v5.0.10

Published

Server to host storybook for react native apps

Downloads

95

Readme

storybook Server

Nothing below makes sense anymore. Update needed.

Storybook server is a project used to host Storybook for React Native instance. It includes addons, and quick way to configure storybook. This project also has a boilerplate that you can use to work locally.

Server

Since React Native storybook talks through websockets, we only need one server to support multiple projects/users. This server can be used to host storybook, so users could download the app to their phone, enter the code shown on screen (or scan QR code for it) and start playing around with your stories.

Steps:

  1. Clone the project.
  2. Yarn install.
  3. Host the project anywhere you want.
  4. Run npm run start.

Inside server directory there are example entry files (index.ios.js) to see how your app could look like for hosted project (it allows user to enter code displayed in storybook so he could use hosted server).

Locally

If you want to have a quick boilerplate with addons or if you want to use storybook for development, this project can help you too.

Steps:

  1. Install package yarn add wix-react-native-storybook-server.
  2. Install storybook in project node ./node_modules/.bin/wix-storybook-install. Include installed files to git.
  3. Copy these scripts to your package.json:
"storybook": "(adb reverse tcp:8081 tcp:8081 || true) && (adb reverse tcp:7007 tcp:7007 || true) && storybook start -p 7007 -c ./storybook/local",
"loki-test": "loki test --skipStories 'No Loki'",
"loki-update": "loki update --skipStories 'No Loki'",
"loki-approve": "loki approve"
  1. (If not using REACT NATIVE NAVIGATION) Uncomment the code in storybook/local/storybook.js. Change #YOUR_APP_NAME# to your app.
  2. Run npm run storybook.

Addons

Custom features

  • Custom design (main area is hidden in favor of bigger sidebar)
  • All tabs in sidebar are displayed at same time, to reduce tab switching.
  • Contains entry screen to insert remote server address in hosted mode.