Roku is just one of the many target platforms for You.i React Native apps. Use the instructions below to run our quick start app on a Roku device.
Our Cloud Solution uses a combination of a small client application that’s distributed through the Roku store and a server-side application that resides in the cloud. While developing your app, you’ll side-load the client application to your test device and use your local macOS or Linux machine instead of the cloud.
You can build a You.i React Native app for Roku on Linux or macOS, but macOS is only supported for development. Linux is needed to build your final package.
Consult the Environment Setup topic for your chosen development platform to verify that everything is set up properly.
Once your dev environment is all set up, we recommend running through our Quick Start Guide. But if our Quick Start isn’t quick enough for you, here’s an even quicker start.
Install the You.i TV command line interface tool, You.i Platform, and any required dependencies
youi-tv doctor requests.
yarn global add youi-cli youi-tv login # Enter your product key when prompted. youi-tv install 6.15.0 # If asked, accept most recent version of Babel or other dependencies youi-tv doctor # Resolve any missing components (but don't worry about Android for now)
Set up scaffolding for your app with
youi-tv init MyApp # Create a folder called MyApp for your project cd MyApp
To build a Roku app, your Bash profile (
.bashrc for Linux, or
.zshenv for Mac) needs to include the
YI_CLOUD_SERVER_PORT environment variable.
YI_CLOUD_SERVER_PORT environment variable contains the port number used for communication between your local app development server and the Roku client.
50000when testing against a local HTTP server. Note that the default port is
54322and covers this use case.
50000or less when testing against an Amazon S3 server.
80when deploying the Release version of the app.
If your Mac is running macOS Catalina and you’re using the default shell, you’ll need to set environment variables in
If you’re not sure which shell you’re using, you can check with this query from a terminal window.
Open your environment configuration file (for example
Add the following environment variable as needed, and save the file:
Open a new terminal window or update your current shell with the changes:
source ~/.zshenv, or
youi-tv doctor to validate your configuration.
Make any changes needed to meet the requirements.
Connect your Roku device to the same network as your development computer.
Put your Roku into developer mode. Take note of your Roku device’s IP address and developer password; you’ll need these below.
Build the Roku server application from the application folder.
When you’re moving between builds that run on your development computer (
linux targets) and server builds for Roku, call
youi-tv clean before your first build to get a clean configuration.
youi-tv clean osx youi-tv build -p osx -d YI_BUILD_CLOUD_SERVER=ON
youi-tv clean linux youi-tv build -p linux -d YI_BUILD_CLOUD_SERVER=ON
Our youi-tv run shortcut command isn’t yet supported for Roku.
Run the server application. First, start the Metro Bundler.
Open a second terminal window.
In that window, go to your app folder (
cd MyApp) and start the server application.
cd youi/build/osx/Debug ./MyApp
cd youi/build/linux/Debug/bin ./MyApp
Unlike other platforms, the Roku server application doesn’t launch a graphical component immediately. The graphical interface opens after the client connects.
Build and side-load the client application on your Roku device.
Open a third terminal window to run the following commands.
cd MyApp/client youi-tv roku-client -u rokudev:<roku_password> -l -s <roku_IP_address>
-l option for the Roku client build script uses the default network IP address for your development computer.
-s <server_IP_address> option is used to specify the IP address of the Roku device on the
youi-tv command line.
youi-tv command connects to that IP address and sideloads the client app into the Roku device.
If you need to specify a different IP address - for example, you have multiple network interfaces - use
--host <cloud_server_IP_address:port> to tell the Roku device where it can find the running Cloud Server.
The port must match the
YI_CLOUD_SERVER_PORT environment variable value - it defaults to
After a few seconds, the server application appears on your development computer and is mirrored by the client on your Roku device.
Notice the platform name is
Interact with the application with your Roku remote.
Continue development activities like using
Ctrl-R to reload or open the dev panel from the server app on your development computer.