How To: Host Your Site — Google Domains, Netlify, and You

This article assumes that you:

• have purchased a custom domain from Google Domains
• have a Netlify Account
• have your site in a Github repo (although the process should be similar for the other options that Netlify offers)

Just before enrolling in Flatiron Schools coding bootcamp, I knew that I would, at some point, need a place to show off my finished projects — so I went ahead and purchased a .dev domain from Google Domains. Eight months later, its time to put it to good use. As someone with a miserably long last name, I went ahead and picked something that was short, sweet, and to the point ⇒ antdp.dev .

At the time of publishing this article, the portfolio is very simple (maybe too simple -- it is literally just HTML, CSS, and vanilla JS), but the goal for me this week was to put my domain to use and showcase myself / my work up to this point. That being said, as you stumble upon this article, I would appreciate any feedback or suggestions that you may have, as the portfolio will obviously continue to evolve after this is posted.

Anyway, here is how to get your site hosted on Netlify with your custom Google Domain.

On Netlify

1. Log in and click on Sites
2. Click on New site from Git
3. You'll then see options for Github, Gitlab, and BitBucket (again, this article assumes you are working with Github, but I will safely assume that the process is similar for the other two optons). Click Github
4. After clicking on Github (or your method of choice) you'll be directed to login/authorize/give permission to Netlify
5. Once you're back on the Netlify, select the repo you wish you use
6. If needed, you'll now choose the deploy settings for your site. If you used a static site generator, you will need to select the appropriate options here, otherwise the default settings will work just fine.
7. Click Deploy site

8.Click Set up a custom domain

9.In the Custom domain field, enter your Google Domains domain. In my case ⇒ antdp.dev

10.Click Verify

11.Click Yes, add domain

12.After adding the domain, you will be brought to the Domain Management page, and you'll likely notice that there are warning about your DNS Configuration. Click the Options dropdown on the domain that you entered in step 9 and click Go to DNS panel and take note of the Nameservers listed

On Google Domains

1. After logging in, click on DNS
2. Click Disable under DNSSEC
3. Under Name Servers, select use custom name servers and add the name servers that you took note of in step 12 of the On Netlify section
4. Click Save

Note: if you use Gmail for your site, refer to this article by Jacob Sowles on how to ensure that it continues working after you move it to Netlify.

Google says that this can take up to 48 hours, but thats it -- you're done and your site will be up shortly 👏.

The nice part about this method is that whenever you push to the branch and repo you selected during setup, the changes will automatically go into effect on your site 😎.

As always, if you have any issues, refer to the docs:
Netlify — Custom Domains: https://docs.netlify.com/domains-https/custom-domains/#definitions
Google Domains Help: https://support.google.com/domains#topic=3251167

Feel free to leave a comment or reach out on any of my socials for questions, feedback, or just to connect / say hello 👋.