What strategy should I use to render part of a React Native app on the web?

[Carmelo-Patti]

Hi all and thanks for this really cool project,

at my company we have a react native app.

now we want to make so that a part of the app and its functionalities, basically a page component and its children rendered via react-navigation/bottom-tabs, would also become a standalone app accessible via web.

for example that could be ProfileOverview here below

import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';

const Tab = createBottomTabNavigator();

function TabScreens() {
  return (
    <Tab.Navigator>
      <Tab.Screen
        component={Home}
        name={routeNames.home}
      />
      <Tab.Screen
        component={ProfileOverview}
        name={routeNames.profileOverview}
      />
      <Tab.Screen
        component={ConditionLibrary}
        name={routeNames.conditionLibrary}
      />
    </Tab.Navigator>
  );
}

from what I understand we various options:

• refactor that into a web app and then integrate it back into the react native app as a web view
• use react native web to port that component part of the app for the web. here I would have really no idea how to proceed and if that is possible at all.
• create a web project and keep writing react native in the app, maintaining the two products separately

am I missing out on something? do you have any other suggestion?

thanks!