How to deploy a multilingual site to DigitalOcean

I hear you ask: why multilingual? Is it not too much work?

To that I answer: Because I want to, and yes it will be.

But really, the real reason is that I want to practice writing in many languages at once. for now English and Spanish, but hopefully more in the future. I won’t commit to translating all of my articles retroactively, but at least all of my posts will be in English.

Ok, enough of the backstory. To the content!

Hugo? DigitalOcean?

This website is powered by Hugo, a static website generator written in Golang. DigitalOcean is a cloud services provider, including hosting static websites powered by Hugo for free, which is a pretty compelling argument.

The hosting includes automatic SSL certificates, DDoS protection for handling the massive load your site must generate, and a CDN for fast serving of all your static content.

It also supports deploying your website from a Github repository. This means that all the code can be saved in Github and any time the repository updates the website gets automatically deployed. Neat!

Ok, but how?

Honestly? I just followed this guide I found on the internet. With it, I got started and built my first simple site.

There were some pitfalls though. The multilingual aspect made me scratch my head for a few hours. Not only did the site is a bit more complicated to manage, it also failed to load at first.

Multilingual sites with Hugo

At first, I wanted to build the site with Multilingual Multihost. This proved to be a challenge for DigitalOcean. Why? because when you build a Hugo site in this mode the folder structure generated looks like this:

...
public/
  en/
    index.html
    ...
  es/
   index.html
   ...

What you are seeing are two distinct folders, each with a static site. With no index.html in the root. This would require to deploy a second static site. Something I did not want to do.

This is actually in the documentation (linked above), but DigitalOcean requires the static site to have an index.html file in the root folder of the site. Something like this:

...
public/
  index.html
  en/
    blah.html
    ...
  es/
    blah.html
    ...

When built like this, the site now works with multiple languages, only on a single domain though.

Last thing. To save a bit on the bandwidth that must be served by DigitalOcean I updated the build command used to hugo -d public -e production --minify:

Command