mmendesas / sdk-bridge

Communication between web and native side using react-native

SDK BRIDGE

SDK Bridge implementation using React Native

Getting Started

You have to run two different projects in order to see it running locally

• mobile:

  • adb reverse tcp:5173 tcp:5173: enable web-app port
  • npx react-native run-android: run native app inside android emulator

• web:

  • yarn dev: will start a React web-app on localhost:5173

Once you're up and running you can play with it, here are some examples

success	error (declined)

Features

• Communication between native-app (inapp-sdk) and webapp (web-sdk)
• Sample webstore to simulate purchase flow
• Simulated purchase authentication flow
• Expiration timer to simulate wait for user action
• State transition using XState (state machine)

How it works

• Webstore was implemented on native side (green screens)
• Authentication flow was implemented on web side (pastel colors screens)
• When a user press the buy button, we load the web app inside webview
• From web-sdk we tell inapp-sdk to open/closes fullscreen mode

Built With

• web

  • Vite - Next Generation Frontend Tooling
  • React.js  - The library for web and native user interfaces
  • XState - State machines and statecharts for the modern web.

• mobile

  • React-Native  - Learn once, write everywhere
  • React-Native-Webview - React Native Cross-Platform WebView

Author

• Marcio Mendes - mmendesas

License

This project is licensed under the MIT License