Integrating React Native SDK for iOS
React JS SDK wraps up out JavaScript SDK into usable hooks API. It simplifies the code for React Native SDK.
Step 1: Install SDK from Npm or Yarnโ
The easiest way to get started is by installing the sdk in your app.
- Npm
- Yarn
npm install "@videosdk.live/react-native-sdk"
yarn add "@videosdk.live/react-native-sdk"
Step 2: Install @videosdk.live/react-native-incallmanager to manage media-routes/sensors/events during a audio/video chat on React Nativeโ
- Npm
- Yarn
npm install "@videosdk.live/react-native-incallmanager"
yarn add "@videosdk.live/react-native-incallmanager"
Step 3: Install all the dependencies via CocoaPodsโ
IMPORTANT: Make sure you are using CocoaPods 1.10 or higher.
$[sudo] gem install cocoapods
Step 4: Manual linking (if react-native-incall-manager is not linked automatically)โ
- Select
Your_Xcode_Project/TARGETS/BuildSettings
, in Header Search Paths, add"$(SRCROOT)/../node_modules/@videosdk.live/react-native-incall-manager/ios/RNInCallManager"
Step 5: Include in the Podfile in your react-native ios directoryโ
Podfile
pod 'react-native-webrtc', :path => '../node_modules/@videosdk.live/react-native-webrtc'
Step 6: Change platform field of podfile to 12.0 or above itโ
You have change platform field of podfile to 12.0 or above it, as react-native-webrtc doesnโt support iOS < 12 platform :ios, โ12.0โ
Step 7: Install podsโ
Pod install
Step 8: Declare permissions in Info.plistโ
ios/projectname/info.plist
<key>NSCameraUsageDescription</key>
<string>Camera permission description</string>
<key>NSMicrophoneUsageDescription</key>
<string>Microphone permission description</string>
Step 9: Register services at index page of projectโ
- React Native CLI
- Expo
import { register } from '@videosdk.live/react-native-sdk';
import { AppRegistry } from 'react-native';
import { name as appName } from './app.json';
import App from './src/App.js';
โ
// Register the service
register();
AppRegistry.registerComponent(appName, () => App);
import { register } from '@videosdk.live/react-native-sdk';
import App from './App';
import { registerRootComponent } from 'expo';
// Register the service
register();
registerRootComponent(App);
Got a Question? Ask us on discord