Deploying this Site

April 26, 2021

Creating Digital Ocean App, Linking Github Repo and Deploying

After some Googling I decided to go with Digital Ocean to deploy and host this site. The primary reason is they offer free hosting of up to three static sites on their starter plan, and their instructons were as straightforward as it gets.

To summarize the steps, I started by creating a new account on their site and entered my credit card info (which they did not charge). Next I created a repo on Github for my site and pushed an initial commit from my command line.

git init
git add .
git commit -m "First commit"
git remote add origin 'your-repo-url'
git push -u origin master

From there you create a new app back on Digital Ocean's site, link up your Github account and the repo you just commited to, and then deploy. The whole process took under 10 minutes from beginning to end.

Adding My Own Domain

When intitially deployed you are given a generic domain to reach your site. My final step was to update to my personal domain. I had purchased my domain a few years back on GoDaddy. I was able to leave my domain with them and link up by updating my DNS settings to point to Digital Ocean's nameservers. Here's how I did this.

  1. Start on the app settings page for your site on Digital Ocean. Navigate to Settings and then Edit domains. Screenshot of settings and edit location.
  2. Under the domain section click the Edit button. Screenshot of edit button.
  3. Key your domain name in the domain field, leave the default "We manage your domain" option selected and copy the three Digital Ocean nameservers which will get entered on GoDaddy. Screenshot of add domin steps.
  4. Log into your GoDaddy account and navigate to My Products under the account section. Screenshot of GoDaddy My Products link.
  5. Click the vertical ellipsis icon in the right corner of the tile for your domain name and select Manage DNS from the dropdown. Screenshot of GoDaddy domain tile.
  6. On the DNS Management page scroll down to the Nameservers section and click the Change button. Screenshot of GoDaddy DNS Management change Nameserver button.
  7. Under the Connect my Domain to a Website section click the Enter my own nameservers (advanced) link. Screenshot of GoDaddy Enter own nameservers link.
  8. Under the Enter My Own Nameservers section add the three Digital Ocean nameservers that you copied in step 3 and click the Save button. Screenshot of GoDaddy nameserver entry.
  9. A warning message will then open and ask you to consent to changing your nameservers. If you are comfortable with this change mark the checkbox and click the Continue button. Screenshot of GoDaddy nameserver consent message.

Once all of these steps were completed I waited about 30 minutes or so and I could navigate to my site through my own domain. According to the comments on both Digital Ocean and GoDaddy this could sometimes take up to 72 hours.

As a final note, when I went through these steps for the first time I entered my domain without the www. prefix in step 3. This did not allow my site to load when I navigated to www.billygrow.com. It only worked if I navigated to billygrow.com. To fix this I repeated just step three and added my domain with the www. prefix. After saving and waiting several minutes I retried and I could navigate to the site with both URLs.