Build and host a static website with Hugo and Google Cloud Storage

If you find this free website useful – why don’t you support this with a donation? It is easy…. read more ….

WordPress is overkill for 90% of small business websites, especially if they are only every going to ask the web developer to make changes.  Static websites used to be just that, static, but now it is possible to create static websites that are simple (relatively) to update dynamically.   Hugo is a Golang project that has been built to take static websites to the next level.

It uses a ‘wiki’ style simple markup rather than html, and folder based system to enable content management and has the concept of posts, so can be used as a blog too.

see https://gohugo.io/

There is a growing collection of themes, so you don’t have to build from scratch if you don’t want to, see http://themes.gohugo.io/

Hugo has a half decent quick start tutorial here https://gohugo.io/overview/quickstart/

Editing your site is done locally on your PC using your favourite editor or IDE  – I tend now to use Atom https://atom.io/

and then it is  case of pushing it out to where ever you want to host it.  You can host it anywhere really from a shared host, you own sever or wealth of other services – two obvious ones are Amazon Web services S3  and Google Cloud Storage.

Google Cloud Storage explains how to set up a Static Site here https://cloud.google.com/storage/docs/hosting-static-website

The process is essentially,  download Google Cloud SDK  (gsutil) if you haven’t got it on your PC https://cloud.google.com/sdk/docs/

CNAME you domain to c.storage.googleapis.com. at your DNS registrar

Now CNAME only works on sub domains, so you are ok for www.mydomain.com but not mydomain.com.  One solution is to set a 301 redirect at your registrar to from the naked a domain to www and cname the www. However if you don’t have that facility CloudFlare allows you to CNAME the naked domain. ( They call it CNAME flattening ), and can also use Cloudflare to redirect the www. to the naked domain, so you have a perfect solution.

So for the moment whilst this work well for a subdomain I can’t see it being viable for a full website.

Create a bucket named the same as your domain (that has been verified with Google), build and copy your site and set access to public, specify the index & 404 file

hugo --theme=hugo_theme_that_you_use_change_this # hugo command to build
cd public         # move into the directory build by hugo
gsutil mb gs://mydomain.net    #   create a bucket  for your domain
gsutil cp -r .  gs://mydomain.net  # copy recursively all content
gsutil acl ch -r -u AllUsers:R gs://mydomain.net  # recursively give public read access
gsutil web set -m index.html -e 404.html gs://mydomain.net  # set the web root & error pages

And you are done.

I guess wrap that up in a little ‘release’ script to make it easy.

Next I’ll look at hosting Hugo sites on Amazon.

Please feel free to comment.