The latest articles on Forem by Evgeni Sautin (@spyker77). https://forem.com/spyker77 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F418718%2F40e7ffa8-0067-4844-b844-666510149d48.png https://forem.com/spyker77 en Evgeni Sautin Sun, 28 Jun 2020 13:26:07 +0000 https://forem.com/spyker77/how-to-connect-godaddy-domain-with-heroku-and-cloudflare-mdh https://forem.com/spyker77/how-to-connect-godaddy-domain-with-heroku-and-cloudflare-mdh <p>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 🎯</p> <p>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!</p> <h2> <strong>Sections</strong> </h2> <p>👉 Heroku settings<br> 👉 Cloudflare settings<br> 👉 GoDaddy settings</p> <h2> <strong>Heroku</strong><a></a> </h2> <p><strong>Step 1</strong>: Go to your app's settings on Heroku.</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F9babkfr14aw3mszela90.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F9babkfr14aw3mszela90.png" alt="Heroku - Settings" width="800" height="481"></a></p> <p><strong>Step 2</strong>: Scroll down to the domains section and click "Add domain".</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fqnp0qyb3qumrktewkdw1.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fqnp0qyb3qumrktewkdw1.png" alt="Heroku - Domains" width="800" height="481"></a></p> <p><strong>Step 3</strong>: Enter your domain name that you've got from GoDaddy and click "Next".</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F1c2g1c6yhloru5ca74pi.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F1c2g1c6yhloru5ca74pi.png" alt="Heroku - Domain Name" width="800" height="481"></a></p> <p>After clicking "Next" you'll be given a "DNS target" record that you need in the next steps.</p> <h2> <strong>Cloudflare</strong><a></a> </h2> <p><strong>Step 1</strong>: Go to the "DNS" tab of your site and click "Add record" in DNS management section.</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F9cd3370qdf3glfulvs1w.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F9cd3370qdf3glfulvs1w.png" alt="Cloudflare - DNS Section" width="800" height="481"></a></p> <p><strong>Step 2</strong>: Enter two CNAME records. First has the name of <strong>your domain</strong> and target – is your "DNS target" record from last step at Heroku. Second CNAME record must have the name of <strong>www</strong> and the same targer record from Heroku. In order to finish with this tab, copy provided nameservers as you gonna need them soon.</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F8m69t3uwkc5z811tt2d6.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F8m69t3uwkc5z811tt2d6.png" alt="Cloudflare - DNS Records" width="800" height="481"></a></p> <p><strong>Step 3</strong>: Go to the "Page Rules" tab and let's add redirect from www address to the main clean one. For example, in my case <a href="//www.skillhunter.app/">www.skillhunter.app</a> redirects to <a href="//skillhunter.app/">skillhunter.app</a>. Pay attention to asterisk (<strong>*</strong>) character in the first record and trailing <strong>$1</strong> in the last one.</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fo9oxm3cws5x36uklzczt.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fo9oxm3cws5x36uklzczt.png" alt="Cloudflare - Page Rules" width="800" height="400"></a></p> <h2> <strong>GoDaddy</strong><a></a> </h2> <p><strong>Step 1</strong>: From your product's page click on "DNS" related to your domain.</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F45xeqj6djqc0gq79gvo5.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F45xeqj6djqc0gq79gvo5.png" alt="GoDaddy - Products Page" width="800" height="481"></a></p> <p><strong>Step 2</strong>: Now you should see DNS records similar to the following.</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F0p3aw7e2shdeebep73h4.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2F0p3aw7e2shdeebep73h4.png" alt="GoDaddy - DNS Management" width="800" height="481"></a></p> <p><strong>Step 3</strong>: Scroll down to the Nameservers section and click "Change".</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Foa2il4opztoy48humcsp.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Foa2il4opztoy48humcsp.png" alt="GoDaddy - Change Nameservers" width="800" height="481"></a></p> <p><strong>Step 4</strong>: Click the phrase "Enter my own nameservers (advanced)".</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fhlr77yvnwd13gfx7npz2.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fhlr77yvnwd13gfx7npz2.png" alt="GoDaddy - Enter Nameservers" width="800" height="481"></a></p> <p><strong>Step 5</strong>: Enter the nameservers, that you've copied at step 2 of Cloudflare settings and click "Save".</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fblnht3g1fw6zzqas28rk.png" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fi%2Fblnht3g1fw6zzqas28rk.png" alt="GoDaddy - Save Entered Nameservers" width="800" height="481"></a></p> <p>Congrats 🎉</p> <p>You did it! Just don't forget to wait, as DNS records update may take up to 72 hours.</p> <p>Last but not least, big shout out to <a href="https://unsplash.com/@clintadair" rel="noopener noreferrer">Clint Adair</a> from <strong>Unsplash</strong> for cover photo!</p> cloudflare heroku godaddy domain