Deploying Node.js App with API credentials to Heroku with custom Google Domain
Tags: node, heroku, googledomain
Published: 2020-07-30 14:02:41

A few months back I was deploying my Node.js app to heroku with custom Google domain I had 2 errors that had me **STUCK**! I wanted to share how to overcome those 2 errors with anyone who’s stuck + adding custom Google Domain to your heroku app. Hope it saves you some time and helps you #GetUnstuck #WorkSmarter

#### Errors:

1. `apiKey must be defined` can't read API Key error.
2. `Error R10 (Boot timeout) -> Web process failed to bind to $PORT within 60 seconds of launch`. Below is the heroku log that drove me to a rabbit hole of troubleshooting (ps. it isn't a favicon.ico issue).

```at=error code=H10 desc="App crashed" method=GET path="/favicon.ico" host=[herokuappurl.herokuapp.com] request_id=79537946-df82–479d-ba7e-accf486764e3 fwd="66.41.109.132" dyno= connect= service= status=503 bytes= protocol=https```

I would highly recommend to download Heroku CLI following these steps : https://devcenter.heroku.com/articles/heroku-cli

**sidenote:** make sure you have this start script in your `package.json`
`"start": "node server.js"`(or whatever name of your server file ex `app.js`)

### Solving Error 1:
Make sure to store your API_KEY in `.env` file & add that to your `.gitignore` file for security purposes:
1. npm install dotenv
2. create `.env` file and store `API_KEY = "abcdef123456789"` &
3. in your `mail.js` file (where ever you need to call your API_KEY) add `require('dotenv').config();`
4. use `process.env` to call API_key :

`auth: {
 api_key: process.env.API_KEY 
 }`

Once you download the heroku CLI follow these steps-
1. `$ heroku login` (Press any key to open up the browser to login to heroku)
2. `$ heroku config:set API_KEY="your_api_key" --app your_heroku_app_name` (make sure the format is `FOO=bar` **spacing is important**)

terminal response: `Setting API_KEY and restarting ⬢ your_heroku_app_name… done, v10 API_KEY: abcdef123456789`

3. `$ heroku config --app your_heroku_app_name`
4. Restart your app `$ heroku restart --app your_heroku_app_name`
This should solve your `apiKey must be defined` error. Now moving on to error 2.

### Solving Error 2:
(shoutout to Will Madison from Blacks in Technology-BIT for helping me with this error)

The main error message is `> Web process failed to bind to $PORT within 60 seconds of launch`

In heroku the PORT number has to be read dynamically not statically since heroku sets the PORT variable see https://devcenter.heroku.com/articles/runtime-principles#web-servers

1. in `server.js` file change `const PORT = 3000;` to `const PORT = process.env.PORT || 3000;`
2. in `server.js` also change `app.listen(PORT, () => { log('Server is starting on PORT, ', 3000)}); to app.listen(PORT, () => { log('Server is starting on PORT, ', process.env.PORT || 3000)});`
3. Make sure to push code changes to github (or whichever deployment method you picked on heroku) and wait for build and deployment to complete.

In your local environment your port `localhost:3000` should still work and in heroku test it with the following:
* open heroku **Run console**

![screenshot_of_heroku_console](https://dev-to-uploads.s3.amazonaws.com/i/5ycgi15nrwbu049n77bl.png)

* run `heroku run bash`
* when console opens up run your start script `$ node server.js`
* response should be `Server is starting on PORT, 52014` (random PORT number heroku choses)
* click **Open app** & your app should appear.

### Adding custom Google Domain to Heroku:

1. On heroku go to yourApp and navigate to **Settings**
![heroku_settings](https://dev-to-uploads.s3.amazonaws.com/i/hhlrnwxt6d5qqi3te1jj.png)
2. Scroll down to the **Domains** section > click **Add Domain** & type domain name (make sure to include **www**) ex: www.[examplesite].com > click **Next** > make sure to copy the DNS Target heroku provides
![heroku_domain_screen](https://dev-to-uploads.s3.amazonaws.com/i/v2y30pv3oclxj7s1efur.png)

3. Head over to google domains and navigate to **DNS** section then scroll down to **Synthetic records**

* **Subdomain forward** should be selected in the dropdown
* type @ in subdomain field
* in **Destination URL** field type your domain name www.[examplesite].com (make sure to include **www** )
* select the below options in photo
![google_domain_screen](https://dev-to-uploads.s3.amazonaws.com/i/71ky4jm9s6ho319ipi5g.png)
* Click **Add**

4.Scroll to **Custom resource records**
removed @ and add **www**

* chose **CNAME** in dropdown menu
* leave **1h** as it is
* add DNS target that you copied from heroku in **Domain** name
* click **Add**
![google domain custom resource records form](https://dev-to-uploads.s3.amazonaws.com/i/ckm1jkrl9epva9sa3kd9.png)

#### Back to heroku CLI:
(to test if domain name configured correctly)
* `$ heroku domains — app your_herokue_app_name` (your heroku Domain & custom Domain should appear in terminal)
* `$ host www.[your_custom_domain].com` (your custom domain name is an alias for DNS Target should appear in terminal along with a few DNS addresses)

#### Head over to your custom domain name and your Node.js App should APPEAR! Congratulations!
(sometimes custom Google domains takes about 24–48hrs to appear, for me it appeared after a few hours)