Building and Running a Roku App

These instructions provide a step-by-step guide to build, deploy, and run a basic Roku app using You.i Roku Cloud. See also Build and Deploy the RN Sample App on Roku.

You can develop on either Linux or macOS.

Create and run the server

Open a terminal window and navigate to where you want to create your app.

youi-tv init firstRokuApp

Build the new app.

cd firstRokuApp
youi-tv build -p osx -d YI_BUILD_CLOUD_SERVER=ON
cd firstRokuApp
youi-tv build -p linux -d YI_BUILD_CLOUD_SERVER=ON

You’ll find the executable in either youi/build/osx or youi/build/linux.

Open a new terminal window and navigate to the firstRokuApp folder.

cd firstRokuApp
yarn start

The Cloud server app is now ready for a Roku client to connect.

Connect the client to the server

Open a new terminal window and navigate to the firstRokuApp/client folder.

cd firstRokuApp/client
youi-tv roku-client -l -s <Roku device IP address> -u rokudev:<password>

The youi-tv roku-client command:

  • Packages the client, creating the file
  • Side-loads the zip file onto your Roku device.
  • Executes the client on your Roku device.
  • Connects the client to the server.
  • Displays the basic You.i app screen on your Roku device.

Make a change and see the result

Make a simple change in your firstRokuApp code. This step is to give you confidence in the rapid development process, where you make a change in JavaScript code and see that change reflected immediately in the output from the client.

  1. In the firstRokuApp folder, open the index.youi.js file in a text editor.
  2. Find the text string: Welcome to your first You.i React Native app!.
  3. Change the string to: Hello World!!!.
  4. Save the file and notice that your Roku device now displays “Hello World!!!”

The Metro Bundler has picked up the change to the JavaScript file and updated the running app. Since the text change affects the You.i SceneTree, the Cloud SDK has forwarded this change to the client.