Porting a full blown react web app to react native

Question

I have a full blown mobile web app using the following:

1. React
2. Redux
3. Redux-React
4. React Router
5. Firebase

I eventually want to convert this mobile web app to a mobile app and I am looking into using React Native. There is a lot of literature on how to build React Native apps from scratch or to convert a native app in Objective-C to react native but I am struggling a bit to find some prior-art of how to approach taking a mobile web app towards native.

More specifically, what are the things that wont work out of the box? I am looking at React-Router.

Some thoughts around how to start transitioning, what to touch and what to not worry would be very helpful.

UPDATE:

Imagine the following app structure. Its already a lot of code. So, I am wondering if there are approaches to do this incrementally?

Answer 1

Many folks are porting their React applications to React Native incrementally by using Web View as an initial 'foot in the door', and then using React Native views on a flow-by-flow basis. With the recent availability of react-native-webview-bridge ( https://github.com/alinz/react-native-webview-bridge ), two-way communication between those web views and the react native components is now very easy.

There can be performance issues when using Web Views on iOS versus the regular Safari app, so that may force certain UI flows to be converted to React Native before you can ship.

I'd highly recommend translating any Selenium tests to Appium to keep your automated test coverage up. React Native is still a bit volatile, and being able to upgrade quickly and safely will be highly dependent on having an automated test suite.