https://github.com/drewalth/ios-webview-communication

Two-way communication between a Reactjs app and SwiftUI via WebView
https://github.com/drewalth/ios-webview-communication

ios react reactjs swift swiftui two-way-communication webview

Last synced: 26 days ago
JSON representation

Two-way communication between a Reactjs app and SwiftUI via WebView

• Host: GitHub
• URL: https://github.com/drewalth/ios-webview-communication
• Owner: drewalth
• Created: 2023-10-12T21:03:49.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-10-19T23:23:14.000Z (over 1 year ago)
• Last Synced: 2024-11-11T03:36:16.666Z (3 months ago)
• Topics: ios, react, reactjs, swift, swiftui, two-way-communication, webview
• Language: Swift
• Homepage:
• Size: 43 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# ios-webview-communication

Prototype demonstrating two-way communication between a webview (Reactjs app) and SwiftUI. i.e., execute native code from the webview JavaScript and execute webview JavaScript code from native.

# Use Case

You've are building a product that requires some sort of hardware functionality, like bluetooth, camera, or NFC but you are on a tight budget and can't afford to build and maintain a 100% native app. So, you build the common UI with Reactjs and use native code to handle the hardware functionality.

# Requirements

- Xcode 15

- Nodejs LTS

# How to run

1. Clone the repo

2. `cd` to my-react-app, run `npm install`

3. run `npm run build`

4. run `npm run preview -- --host`

5. open ReactCommunication.xcodeproj in Xcode

6. Change the signing team to your team

7. Change the value of `reactAppURLString` in `ContentView.swift` to the URL from step 4

8. Run the app

9. tap some buttons to see the communication in action