Lanzar sitio web construido con React en Heroku

Instalamos el generador de aplicaciones de react.

$ npm i create-react-app -g

Generamos una aplicación.

$ create-react-app my_app_name

Accedemos al directorio de la aplicación.

$ cd my_app_name

Una vez construido el sitio procedemos a configurar la cuenta de heroku para el lanzamiento.

Inicializamos el repositorio.

$ git init

Creamos un repositorio en heroku.

$ heroku create my_app_name --buildpack https://github.com/mars/create-react-app-buildpack.git

Hacemos el lanzamiento a heroku.

$ git add .
$ git commit -m "Start with create-react-app"
$ git push heroku master

Abrimos el sitio web.

$ heroku open

Como ustedes sabrán esto genera algunos archivos, entre ellos index.html, para renderizar ese archivo se utiliza https://github.com/heroku/heroku-buildpack-static, este a su vez nos permite configurar algunas cosas, entre la más importante a mencionar está la sobre-escritura de rutas.

Para poder cargar cualquier enlace y que sea manejado por nuestra aplicación en producción debemos crear un archivo static.json con el contenido siguiente:

{
  "root": "build/",
  "routes": {
    "/**": "index.html"
  }
}

Fuente: https://github.com/mars/create-react-app-buildpack#routing-clean-urls