Set port dynamically if deploying to Heroku

Heroku prohibits you from setting a port on startup.
They are going to generate a port for you and then you are going
to listen for it as an env var.

- https://help.heroku.com/P1AVPANS/why-is-my-node-js-app-crashing-with-an-r10-error

Unfortunately, Razzle defaults to setting port 3000 if you
don't set one yourself.

- https://github.com/jaredpalmer/razzle#build-time-variables

There's some issues about this on the razzle repo, and ultimately
this is where I found the solution.

Source: jaredpalmer/razzle#356 (comment)

web/src/index.js

@@ -6,13 +6,34 @@ const server = http.createServer(app)
 let currentApp = app
 
 /* eslint-disable no-console */
-const port = process.env.PORT || 3000
-server.listen(port, error => {
+
+/*
+  On Heroku, we're not allowed to set our own port.
+  This gets around the Razzle default port setting, which doesn't play nice with Heroku deploys.
+  Source: https://github.com/jaredpalmer/razzle/issues/356#issuecomment-366275253
+*/
+
+// bypass webpack.DefinePlugin
+const { env } = require('process')
+
+const port = () =>
+  parseInt(
+    env.RAZZLE_PORT ||
+      env.PORT ||
+      process.env.RAZZLE_PORT ||
+      process.env.PORT ||
+      3000,
+    10,
+  )
+
+const _port = port()
+
+server.listen(_port, error => {
   if (error) {
     console.log(error)
   }
 
-  console.log(`🚀 started on port ${port}`)
+  console.log(`🚀 started on port ${_port}`)
 })
 
 if (module.hot) {