Pointing a domain to the Heroku app

When you create an app on Heroku, it can be accessed via Heroku Domain. For example, if you have built an app with the name "nctesting", you can enter http://nctesting.herokuapp.com in a browser, and your website will be displayed.

It is also possible to make your app accessible via a custom domain that you have registered with Namecheap. You can add custom domains to both free and paid Heroku accounts.

If you wish to accomplish this, you’ve come to the right place - this guide is what you need.

Domains can be inspected and managed using either Heroku CLI or Dashboard.

1. First of all, preconfigure your Heroku app to be used with your custom domain.

Deploy your app and make sure it is working via your Heroku subdomain: example.herokuapp.com. If you are having difficulties deploying your Heroku app, feel free to refer to Heroku documentation.

2.Verify your Heroku account by adding a credit card to it:  

- Click on Account Settings at the top:

- Select the Billing tab at the top and click on the Add Credit Card button:

3. Once the account is verified, you will be able to add a custom domain following these steps:

- Select Dashboard at the top. Then click on your application name:

- Click on the Settings tab and then click on the Add domain button:

4. Now let's decide what you want to be displayed in the URL after the setup. You can have it like:
a) www.yourdomain.tld
b) app.yourdomain.tld or any other subdomain
c) *.yourdomain.tld (a wildcard)

Depending on the domain you select, your domain's settings will be adjusted.

(a) www.yourdomain.tld

Enter your domain name in the format www.yourdomain.tld and click on Save changes:

In the cases (b) app.yourdomain.tld and (c) *.yourdomain.tld enter your domain name in the format app.yourdomain.tld or *.yourdomain.tld correspondingly.

Once this is done, you will see your custom domain displayed in the Domains section.

NOTE: If you skip this step and proceed with the next one right away, the following error page will be displayed in the browser:

5. Now you can start configuring your domain from Namecheap's side if it is using our BasicDNS, BackupDNS (a legacy option), PremiumDNS or FreeDNS.

Just follow the steps below in order to do this:

- Sign into your Namecheap account.

- Select Domain List from the left side menu and click on the Manage button next to your domain:

- Click on the Advanced DNS tab and find the Host records section, then click on the Add New Record button (not able to edit Host Records?):

In this section, you need to create several host records for your domain depending on a subdomain you would like to use for the Heroku app:

(a) To use www.yourdomain.tld and yourdomain.tld, the following host records should be created:

URL Redirect Record for @ to forward to http://www.[yourdomain.tld]
CNAME Record for www mapped to your Heroku Domain www.yourdomain.tld.herokudns.com.

(b) To use any other subdomain, like app.yourdomain.tld and yourdomain.tld, you should create the following records:

URL Redirect Record for @ to forward to http://app.[yourdomain.tld]
CNAME Record for app mapped to your Heroku Domain app.yourdomain.tld.herokudns.com.

NOTE1: You can replace the app with any subdomain that you like.

NOTE 2: If only the subdomain (subdomain.yourdomain.tld), not the root domain itself (yourdomain.tld) should be mapped to Heroku (e.g., the root domain is using some other hosting service), there is no need to add the URL Redirect Record. The CNAME record pointed to subdomain.yourdomain.tld.herokudns.com is enough.

(c) To use *.yourdomain.tld and yourdomain.tld, the following host records should be created:

URL Redirect Record for @ to forward to http://www.[yourdomain.tld]
CNAME Record for * mapped to your Heroku Domain wildcard.yourdomain.tld.herokudns.com.

Once all the details are inserted, save them using the Save all changes button. It may take up to 30 minutes for the changes to come into effect.

6. Make sure that there are no conflicting records set for the same host.

If there are any conflicting records, please remove them. You need to pay attention to the records of the following types: URL Redirect (Unmasked/Masked/Permanent Redirect), A or CNAME. For example, you need to check if you might have such records as URL redirect and CNAME for the default parking page.

Here is an example of conflicting host records:

That's it!

If you have any questions, feel free to contact our Support Team.


We welcome your comments, questions, corrections and additional information relating to this article. Your comments may take some time to appear. Please be aware that off-topic comments will be deleted.

If you need specific help with your account, feel free to contact our Support Team. Thank you.

Need help? We're always here for you.

× Close