In this simple blog, you’ll learn to build a working React Native video streaming mobile app using EnableX Low Code Video Embed.
To gain understanding about the Low Code Video Embed, readout this blog: EnableX Low Code Video Embed
Create a Project
To begin with, create a Video Embed Project in the EnableX portal.
- Log in to the EnableX portal. If you do not have an account, Signup here.
- Now move to “Create Projects” and then enter the relevant information. Select “Video Embed” in the “Service” section.
Upon completing your project creation, “APP ID” and “APP Key” are generated. You would need these credentials (“APP ID” and “APP Key”) to gain access in the EnableX Room. Save this for further use (see Embed the Meeting URL).
Prerequisites
- Node 12 LTS or greater installed
- Expo CLI
Set Up
Step 1: install expo cli using the command given below:
“npm install -g expo-cli”
Step 2: create project using the command given below
“expo init Project-Name”
Provide your own project name that you want to give for your application.
Enable Device Access
Once you are done with setup, you will need to install ‘expo-permission’ to enable access to camera and mic to app. Here is how you can do it:
Step 1: Install expo-permission by using following command
“expo install expo-permissions”
Step 2: Use the function shown below to get permission before loading the view.
Step 3: Next, Pass embedded URL to the source of WebView.
Run the App
Open Command prompt in window, navigate to root directory of your project, and then run the command expo start. It opens the developer tool in the browser as shown in the image given below.
To install the app either we need to scan QR code or press the appropriate key on the platform where you want to install the app like Android, iOS, Web. For detail, follow the image given below:
Once the app is installed successfully on the device, the following screen appears. Ahoy! you can go live. The following screen appears.
Enter your name before connection to room.
Click Join Now button and the screen as shown below appears after you are successfully connected to the room.
To Conclude
I hope you have found this blog helpful in your journey to build a video streaming app using react native and low code video Embed.
