Is Expo for web ready for production release?

[khanhcse]

Hi everyone,

I have a food delivery app using react-native. I need some suggestions about using expo for web to build a complete web app with similar functions. Is “Expo for web” a solution to make the web app to production quality?

Thank you!

[theplantbasedcompany]

I have a react native web app running in production and it’s as good as the mobile app. For web I use the following components to make sure the components are not over 480px in width:

const {width} = Dimensions.get('window')
const maxWidth = Math.min(width, 480)

export const Content = styled(View)`
  width: ${maxWidth}px;
  margin-left: auto;
  margin-right: auto;

  ${props => props.white && `
    background: white;
  `}
`

What are you doubting atm that expo for web can’t do?

[lanman2000]

Hey @theplantbasedcompany what other issues did you face on the web side of things? We want to use expo for our new website/app. How did you handle the scaling up to the web? Besides adding the maxWidth limit did you do anything else specifically for the web? We are just concerned that the website will look too “appy”… LOL is that even a word? For example though we would want to move our navigation to the left on the web and keep it in the bottom for the app. Did you do any customizations for the web along those lines?

[ksi9302]

For me, I actually have my web app using expo web in production stage (Beta yet).
The “Learn once, write everywhere” motto seems attractive and it truly is, however, just take into account that react native web is still in a beta stage.

The frustration I had to face includes below…

1. Picker(select) component was not compatible with web - had to search for a native component which works on web, I eventually did but the package was so slow, this is resolved at the moment as you are able to use @react-native-community picker for native and web both.

2. React navigation layout bug → As of SDK 39, react navigation has layout rendering bugs on web when you try to dynamically manipulate the style, which I had no solution whatsoever yet.
   (This puts me down a lot because I’ve upgraded my app to use 39 SDK and implemented whole lot of new features as well as bug fixes but then I found this issue too late …)

3. Alert (Confirm) - You have to either make a component that does not use native alert method or use platform specific code to implement this feature.

4. Modal(Overlay) - I had to make my own modal component that works across all platforms because react native modal didn’t work on web not sure if this is fixed now.

5. Inputs - Text Input fields have different validation and layout schemes across platforms, well, not just inputs but lots of other simple components. This is to be expected.

6. Calendar Day Picker - I had to implement a calendar looking date picker. I ended up using react based component and react native component conditionally since there’s… just too much difference in behavior and layout across platform. For example, with react native component, it will give Android a Popup modal, iOS a layout breaking wheel selector inline, and web, nothing.

7. Access to cookies and session - I’ve just went with Async Storage, but this sure was a tricky part.

Whoo, I can write more but yeah, you sure will struggle to get features implemented which doesn’t take you few minutes if you were just using react.js.
To be honest, If I were to travel back in time, I would have just separated my project for native app and web app.

If your app only targets for web, then I recommend sticking to web frameworks.

The hardest part of all my problems is that you won’t get much out of google or community since you don’t really have many people in this pool.

Hope this helps.

[khanhcse]

@ksi9302 Thank a lot for your reply! It’s really helpful. Our team already build a separate web app. We think that “Expo for web” is a very risky choice since some problems might really new and difficult.

[mtn360]

I can actually speak very highly for Expo for Web / React Native Web, apart from the PWA experience where I get layout scrolling/issues.

@ksi9302 … Did you see your issues when using directly on your mobile browser or when added to Homescreen as PWA? Modals are natively supported now btw and work really smooth!