reactjs - Can I develop web application using React Native? - Stack Overflow
React-Native Mobile and Web Code Sharing. Demo implementation of a cross-platform card game
Yeah, I re-use a ton of my components between React Native and React Native Web. And you can do pretty much any web stuff you need in the .web files, which is great
More on reddit.comShould I go with react-native-web or standard react?
My 50 cents from leading a cross platform 0.5m active users project:
-
Use RN and React separately as separate projects/packages. The products will diverge over time. So will codebases. Don’t lock yourself in from the start
-
Share utils, api requests and redux where it makes sense. Be deliberate and plan accordingly. Finding the right balance between shared and split will take time, in particular early on in product lifecycle where your product is evolving rapidly
-
Set up web and native in a monorepo with the shared package to avoid versioning issues. Use yarn workspaces and make sure you hoist all dependencies
-
Ensure your tests (and types) for shared code are solid and follow good test and CI practices from the start
react-native-web vs just plain react... react-native just seems like a better idea as we can have our app on mobile too!
If your goal is code sharing, you're going to have a bad time sharing the same code for the view layer. Twitter was able to use it by forking the library to suit their own needs. There's some real hurdles to overcome if you take the react-native-web approach
-
How to manage media queries without CSS as your website won't only be viewed on mobile
-
How to manage animations & transitions without CSS
-
How do you manage the layout discrepancies that will appear when using <View />, <ScrollView /> and <Text />. Would this involve you creating an if statement for Platform.OS, creating a *.web.js, etc.
-
How do you manage native dependencies for web (e.g. if there's an import for "@react-native-firebase/analytics", "react-native-video", splash screens, vector icons, fonts). Would this involve you having to fork the native libraries that you need to stub in web support?
-
How to handle navigation (at the moment, react-navigation has poor web support)
-
How to handle unsupported elements that are imported from react-native (e.g. modal, sliders, iframes/webviews, alerts). Would you have to set up custom Webpack module resolvers?
-
How do you manage web-specific JS (such as using querySelector, DOM events, setting document title, optimising accessibility etc)
In my opinion, I'd implement the views separately from desktop and mobile and keep the same stateful/functional logic by code sharing hooks (and any functional/stateful logic like redux reducers). In that way you can have the best of both worlds.
More on reddit.comVideos
Not everything written for mobile in React-Native would work in web mode. It's not just because React Native Web is newer, but also because Web APIs are not equivalent to iOS/Android APIs - some features are simply not there for usage. Here is the compatibility list of React Native Web, in the official website.
The lack of supports for both Web and mobile together also needs to be considered here. Take react-native-maps for example: it's written on top of Google Map SDKs for Android and iOS, and MapKit in iOS. It's entirely dependent on the mobile ecosystem, so if you want your map feature to work in Web, you have to implement separate solution for Web only.
Overall, you need to know for each of your project requirements whether the related feature/library is supported in both web and mobile, and if there is not, do you have enough time and resource to implement the missing piece. If the answer is no, then you should separate your code base to handle web and mobile instead.
It looks like this library is already used by big companies like Twitter and Uber, so I would say it does work fairly well.
I could see it as a viable option if you start building your app for Android, iOS and Web. This means you have to test regularly that your additions to your application work on each platform and find workarounds if and when something doesn't work out of the box. Migrating an existing React Native project to include React Native Web would probably not be that straightforward.
With React Native you can build your app with one codebase, but it doesn't mean that you don't have to write platform specific code in some cases.
Flutter also enables developing apps for these platforms in addition to Linux, macOS and Windows. Flutter web apps are still in an early phase so it might not be as stable as React Native Web. I think that currently React Native Web is a better choice if you only want Android, iOS and Web applications from the same codebase.