React

Let’s start a new react application. For the tutorial, we’ll use create-react-app which sets up a standard react-based app and demonstrate how easy it is to run it Runway.

Setup

Create a new application:

$ npx create-react-app my-app

This may take a couple of minutes, but once it’s done, you can test the app by changing into the my-app directory and running npm start.

Configure a web server

When you push the app code, Runway will run npm run build which produces all the static assets required to run the app, but we’ll still be missing a web server.

One of the options is to add an nginx (e.g. see the Angular tutorial), another option is to add a small JavaScript-based webserver:

$ npm install serve
...

And re-configure how the app is started:

$ npm pkg set scripts.dev="react-scripts start"
$ npm pkg set scripts.start="serve -s build"

Hold on a second - we just changed two things:

• the command to run a local copy is now npm run dev
• Runway will use npm run start

Deploy to Runway

Create an application on Runway:

$ runway app create
INFO    checking login status                        
INFO    created app "anxious-investigator"                 
create app anxious-investigator: done
next steps:  
* commit your changes  
* runway app deploy  
* runway open

Set the port:

$ runway app config set PORT=3000

And deploy:

$ runway app deploy && runway open

Congrats! You built an React app and it’s running on Runway! 🚀