shopify react native webview app

Shopify Apps
, ,
1

hey can anyone tell me is there any already created template or something for shopify webView react-native app with the same functionality mention in this blog.

actually i want to build a mobile app for my shopify store but without using paid plugins or app for android and ios
i’m able to build a webview app but don’t have all the functionalit
https://shopify.engineering/mobilebridge-native-webviews

2

Hey @rohit-world ,

if you are looking to build a mobile app for your Shopify store using react Native and Webviews without relying on paid plugins here are the some options you can explore.

  1. Use Mobile Bridge (Shopify’s own architecture): Shopify create Mobile Bridge, a framework making WebViews behave like native screens. It offers:
    • Performace Booster (Fast preload + caching).
    • Native Style UI overlay.
    • Bi directional communication between web content and native code.
    • The transportable view technique to maintain Webview state across screens.

Unfortunately, this is an internal Shopify framework and not yet open-sourced. But you can closely replicate it’s architecture.

  • Use react-native-webview.
  • Preload/caches your WebViews.
  • Inject JS/CSS to hide native scrolling, disable zoom, align UI.
  • Expose a message bridge using onMessage to react native via postMessage.
  • Build your own navigation bar handles and main webview across screens.

Let me know which route seems best for your needs.