DEV Community

loading...
Cover image for How to connect GoDaddy domain with Heroku and Cloudflare

How to connect GoDaddy domain with Heroku and Cloudflare

spyker77 profile image Evgeni Sautin ・2 min read

Well, if you (as me just recently) struggle to connect newly registered domain from GoDaddy with your app at Heroku, and in addition would like to use advantages of Cloudflare – this article is for you 🎯

Though you can find some useful information on the web, nothing worked for me out of the box and since I don't do this procedure on a daily basis, it wasn't obvious where is the mistake. Hope it will help you and without many words, let's jump in!


Sections

👉 Heroku settings
👉 Cloudflare settings
👉 GoDaddy settings


Heroku

Step 1: Go to your app's settings on Heroku.

Heroku - Settings

Step 2: Scroll down to the domains section and click "Add domain".

Heroku - Domains

Step 3: Enter your domain name that you've got from GoDaddy and click "Next".

Heroku - Domain Name

After clicking "Next" you'll be given a "DNS target" record that you need in the next steps.


Cloudflare

Step 1: Go to the "DNS" tab of your site and click "Add record" in DNS management section.

Cloudflare - DNS Section

Step 2: Enter two CNAME records. First has the name of your domain and target – is your "DNS target" record from last step at Heroku. Second CNAME record must have the name of www and the same targer record from Heroku. In order to finish with this tab, copy provided nameservers as you gonna need them soon.

Cloudflare - DNS Records

Step 3: Go to the "Page Rules" tab and let's add redirect from www address to the main clean one. For example, in my case www.skillhunter.app redirects to skillhunter.app. Pay attention to asterisk (*) character in the first record and trailing $1 in the last one.

Cloudflare - Page Rules


GoDaddy

Step 1: From your product's page click on "DNS" related to your domain.

GoDaddy - Products Page

Step 2: Now you should see DNS records similar to the following.

GoDaddy - DNS Management

Step 3: Scroll down to the Nameservers section and click "Change".

GoDaddy - Change Nameservers

Step 4: Click the phrase "Enter my own nameservers (advanced)".

GoDaddy - Enter Nameservers

Step 5: Enter the nameservers, that you've copied at step 2 of Cloudflare settings and click "Save".

GoDaddy - Save Entered Nameservers


Congrats 🎉

You did it! Just don't forget to wait, as DNS records update may take up to 72 hours.


Last but not least, big shout out to Clint Adair from Unsplash for cover photo!

Discussion (8)

Collapse
tonyxdz profile image
TonyxDz

thanks , im just wondering if it's free to use cloudflare in this situation

Collapse
spyker77 profile image
Evgeni Sautin Author

Good question! Had to check it, just in case 🕵️
Phew, so far there is no bills. I guess you would be notified if you accidentally switch something on or exceed the limit, and even then it is quite explicit. For example, on the Rules tab I see "You have 2 Page Rules left. Buy More Page Rules." or "Upgrade to Business" button in the Custom Nameservers section – so you wouldn't have missed it.

Collapse
tonyxdz profile image
TonyxDz

thank you so much 🙏🏻 i don't have a lot of info about DNS and networking in general and this is why i got confused 😵

Thread Thread
spyker77 profile image
Evgeni Sautin Author

My pleasure 👍
If you have any further questions, don't hesitate to ask!

Collapse
kwameaj67 profile image
Kwame Agyenim-Boateng

After you set custom Nameservers, is that the final process to host your site??

Collapse
spyker77 profile image
Evgeni Sautin Author

Yep, as far as I remember... But perhaps I could help if you provide a bit more information: how long did you wait after completing configuration, the type of error you have while reaching your website or a specific domain, so that we can compare the exposed settings here zone.vision/#/skillhunter.app for example?

Collapse
jayarghargh profile image
Justin R

this is great thanks mate, simple and works!

Collapse
spyker77 profile image
Evgeni Sautin Author

Glad to hear that it works 😊

Forem Open with the Forem app