Deploying a Hugo site with Caddy webserver

Hugo #

Hugo is a static site generator; it creates the site HTML files (and CSS, maybe Javascript) by processing markdown content files. The content is arranged and styled according to a theme, in my case Congo.

Among its features are the rapid build times and the built-in server that can live-reload as content is being edited.

The easiest way to install and setup Hugo is to follow the quick-start guide. This shows how to install, create a new site, add content and run the built-in server.

Some helpful flags when running the server:

# Include draft posts
hugo server -D
# Access from other devices (firewall permitting)
hugo server --bind 0.0.0.0

Deploying #

Running the hugo command builds the website, placing the files in the public directory. Deploying the site involves copying the contents of this directory to a webserver. There are a number of ways to do this, but since I am running a VPS and have SSH access, a simple rsync command will do. The following script builds the site and syncs the files to the webroot on the webserver.

1
2
3
4

# Rebuild
hugo
# Upload public to vps
rsync -avz --delete public/ <server>:/var/www/html

Replace <server> with the webserver domain name or ip address, and change /var/www/html if using a different webroot.

Caddy #

Now with the files on the VPS, it is time to send them out to the world. We need a webserver. Caddy is a webserver that is easy to configure, HTTPS by default and manages LetsEncrypt certs automatically: ideal for a simple website.

Installation is super simple, available as a package in most distributions or as a binary file. The Caddyfile for my server looks like the following:

1
2
3
4
5
6

domwil.co.uk {
	# Set webroot
	root * /var/www/html
	# Enable the static file server.
	file_server
}

Including the domain name as the site location triggers Caddy to operate over HTTPS on port 443 and to acquire a LetsEncrypt certificate. This requires both port 443 and 80 to be allowed through the firewall.

Finally ensure that the DNS A and or AAAA record for the domain points to the VPS’s public IP address. I use namecheap as a domain registrar, and this can be configured on their website.

Applying the new configuration to Caddy (assuming systemd):

systemctl reload caddy

And the site should shortly be available at the domain name.

Conclusion #

The combination of Hugo and Caddy make creating a website, adding content and deploying to a VPS super easy, with the added benefit of automatic HTTPS.