opentok-react-native
Version:
React Native components for OpenTok iOS and Android SDKs
123 lines (80 loc) • 4.96 kB
Markdown
# opentok-react-native

React Native library for OpenTok iOS and Android SDKs
- [Pre-Requisites](#pre-requisites)
- [Installation](#installation)
- [iOS Installation](#ios-installation)
- [Android Installation](#android-installation)
- API Reference
- [OTSession Component](https://github.com/opentok/opentok-react-native/tree/master/docs/OTSession.md)
- [OTPublisher Component](https://github.com/opentok/opentok-react-native/tree/master/docs/OTPublisher.md)
- [OTSubscriber Component](https://github.com/opentok/opentok-react-native/tree/master/docs/OTSubscriber.md)
- [Samples](#samples)
- [Contributing](#contributing)
### In this repo, you'll find the OpenTok React Native library:
## Pre-Requisites:
1. Install [node.js](https://nodejs.org/)
2. Install and update [Xcode](https://developer.apple.com/xcode/) (you will need a Mac)
* React Native iOS installation [instructions](https://facebook.github.io/react-native/docs/getting-started.html)
3. Install and update [Android Studio](https://developer.android.com/studio/index.html)
* React Native Android installation [instructions](https://facebook.github.io/react-native/docs/getting-started.html)
## Installation:
1. In your terminal, change into your React Native project's directory
2. In your terminal, run `npm install opentok-react-native`
### iOS Installation
**Note:** Please make sure to have [CocoaPods](https://cocoapods.org/) on your computer.
If you've installed this package before, you may need to edit your `Podfile` and project structure because the installation process has changed.
1. In you terminal, change into your `ios` directory.
2. Create a pod file by running: `pod init`.
3. Add the following to your pod file:
```
platform :ios, '9.0'
target '<YourProjectName>' do
# Pods for <YourProject>
pod 'OpenTok'
end
```
4. Now run, `pod install`
5. After installing the iOS SDK, change into your root directory of your project.
6. Now run, `react-native link opentok-react-native`.
7. Open `<YourProjectName>.xcworkspace` file in XCode. This file can be found in the `ios` folder of your React Native project.
7. Click `File` and `New File`
8. Add an empty swift file to your project:
* You can name this file anything i.e: `OTInstall.swift`. This is done to set some flags in XCode so the Swift code can be used.
9. Click `Create Bridging Header` when you're prompted with the following modal: `Would you like to configure an Objective-C bridging header?`
10. Ensure you have enabled both camera and microphone usage by adding the following entries to your `Info.plist` file:
```
<key>NSCameraUsageDescription</key>
<string>Your message to user when the camera is accessed for the first time</string>
<key>NSMicrophoneUsageDescription</key>
<string>Your message to user when the microphone is accessed for the first time</string>
```
### Android Installation
1. In you terminal, change into your project directory.
2. If you have already run `react-native link opentok-react-native` for the iOS installation, please skip this step.
* Run `react-native link opentok-react-native
3. Open your Android project in Android Studio.
4. Add the following to your project `build.gradle` file:
```
maven {
url "http://tokbox.bintray.com/maven"
}
```
* It should look something like this:
* 
5. Sync Gradle
6. Make sure the following in your app's gradle `compileSdkVersion`, `buildToolsVersion`, `minSdkVersion`, and `targetSdkVersion` are the same in the OpenTok React Native library.
7. As for the older Android devices, ensure you add camera and audio permissions to your `AndroidManifest.xml` file:
```xml
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-feature android:name="android.hardware.camera" android:required="true" />
<uses-feature android:name="android.hardware.camera.autofocus" android:required="false" />
<uses-feature android:name="android.hardware.microphone" android:required="true" />
```
Newer versions of Android–`API Level 23` (Android 6.0)–have a different permissions model that is already handled by this library.
## Samples
To see this library in action, check out the [opentok-react-native-samples](https://github.com/opentok/opentok-react-native-samples) repo.
## Contributing
If you make changes to the project that you would like to contribute back then please follow the [contributing guidelines](CONTRIBUTING.md). All contributions are greatly appreciated!