How to deploy Hugo static sites with Buddy

June 1, 2022

Share:

How to deploy Hugo static sites with Buddy

Hugo is gaining traction as one of the most popular static site generators created in GO. It combines excellent performance, ease of use, and speed.

Being great as it is, you can always take your Hugo deployments a step further with Buddy and this guide will show you how.

Prerequisites

We are using the Hyas Starter for its Hugo-installer npm package, it'll make installing Hugo’s binaries much easier.

What we want to achieve

  • Build our website
  • Deploy our code to FTP
  • Check if our website is working after the deployment
  • Send a notification if something goes wrong

Creating a new project

Let's begin by creating a new project. You can simply do that by clicking this big blue button:

Next, we have to connect our git repository - you can use Github, Gitlab, Bitbucket, or any other private repository:

Now we have to create a pipeline. A pipeline is a set of actions that determines our deployment process.

It's good to create separate pipelines for staging and production environments.

Press the button to add a new pipeline:

Our pipeline can be executed either manually or on each push to the repository. This time we'll set it to manual.

Adding actions

We should begin with an action that will build our website. For this, we will want to add the Node.js action that will install all the required dependencies and build our site in just two commands:

With our build complete, we need to deploy our code. For this, we can use FTP, SFTP, or rsync actions. This time, however, we'll use SFTP. Select the Pipeline Filesystem, and fill out your server credentials.

In our case we only want to deploy the public folder (you can specify that in the Source path):

Our website is now deployed, but is it working correctly? We can check the health of our creating using the Monitor website action. The action itself simply checks if the website returning status 200 and setting it up is as easy as providing a URL.

It's a good practice to use the "Check for string" option to see if the site is rendered.

As a good practice, we recommend adding an action that will warn us if anything goes wrong. For this, go to the On failure tab and add a notification action:

Let's send an email to ourselves in case of a bug. There is an action called Email. Just fill in all the required fields:

It is also possible to integrate Buddy with Slack, Telegram, or Discord.

If you followed this guide carefully, this is what your pipeline should look like:

And this is what the deployed website looks like:

This is but a simple deployment pipeline that can be set up in a manner of minutes. Buddy offers way more solutions that you might find useful – make sure to browse through the rest of our guides and blog posts for inspiration and breakdowns of new features and automation methods.

Maciek Palmowski

Maciek Palmowski

WordPress & PHP Developer

Maciek is a WordPress Ambassador working at Buddy. An active participant in the Open Source world, he spends most of his free time trying to find interesting news for WP Owls newsletter or cycling.

With Buddy even the most complicated CI/CD workflows take minutes to create

Sign up for Buddy CI/CD

Start a free trial