Storybook Web + React Native Example

[fjmillman]

Hey folks!

I just thought I should share this for anyone who is interested.

I've spent a bit of time experimenting and putting together a working base template of how an Expo/Next.js app would work with full support for both the Web (through the React Native add-on) and React Native versions of Storybook to cover both cases.

https://github.com/fjmillman/expo-nextjs-storybook

This involves the use of React 17, Storybook v6.4, and the latest Storybook React Native v6 Beta.

I'm currently using this as a springboard into app development in the Expo eco-system, using Storybook React Native to check components on devices and using Storybook Web to do the same for web with the added bonus of Storybook's inbuilt Interaction Testing.

Hopefully this helps anyone who may be having issues with getting the latest versions of Storybook working.

[dannyhw]

Thanks for sharing 🙏
Sounds awesome, will have to try it out!

The issue of 6.4 compatibility comes down to changes to the story store to be lazy loaded which isn't supported in the current (beta) implementation of rn storybook, however 6.3 works fine.

[fjmillman]

@dannyhw Fantastic!

I should note that storyStoreV7 appears to have an issue in the web version at the moment when attempting to export storybook where none of the stories load. So I've disabled that option for now, which is probably why I haven't experienced any issues using 6.4 within this repo (yet).

[dannyhw]

Yeah addon-react-native-web storybook shouldn't have any issues with 6.4, the issues is specifically with the ondevice storybook and shared dependencies between it and web in which some of the apis were deprecated. For example the config api is no longer a thing in 6.4 and its relied on in the 6.0 beta of rn.

[dannyhw]

I want to support the lazy store stuff and further api changes from 6.4 but It's a complicated task, it's the main blocker for 6.0 stable right now I think.