React Native – How to integrate React Native into existing iOS app (1)?

Reference

Create new folder structure

/my_new_react_native
    |---- /ios                            #### Your existing iOS app
    |---- package.json
    |---- .gitignore

package.json

{
  "name": "MyReactNativeApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "yarn react-native start"
  }
}

.gitignore

node_modules/

Install “react-native” dependency

$ yarn add react-native
...
warning "react-native@0.52.2" has unmet peer dependency "react@16.2.0"
...

$ yarn add react@version_printed_above

Install CocoaPods

$ cd ios
$ pod init

Edit pod file

• Create separate new React Native project
• Copy and paste content of pod file from that project to your Pod file

require_relative '../node_modules/react-native/scripts/react_native_pods'
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'

platform :ios, '10.0'

target 'I am rich' do

    config = use_native_modules!

    use_react_native!(:path => config["reactNativePath"])
  
    # Enables Flipper.
    #
    # Note that if you have use_frameworks! enabled, Flipper will not work and
    # you should disable these next few lines.
    use_flipper!
    post_install do |installer|
      flipper_post_install(installer)
    end  

end

• Then, run
  $ pod install

Create your React Native component

Add React Native component to ViewController

Create Event Path