Blog server setup with Hugo + GitLab Pages

Learn how to set up a blog server using Hugo + GitLab Pages. It’s free.

Goal

Below are the components of a blogging environment with Hugo + GitLab Pages. The goal here is to create a Hugo content repository (including themes and CI/CD container definitions) and a directory to be published as a website in GitLab, manually launch the container, and build/publish the sample website.

Assumption

I will assume that you have a Free GitLab account with GitLab SaaS available.

Procedure

Create a directory in GitLab that will be published as a Hugo content repository and website
  1. log in to GitLab with a browser.

  2. Press New project button.

  3. Press Create from template button.

  4. Press Use template in Pages/Hugo record.

  5. Enter Project name, select Visibility Level, and press Create project button to create a project containing a Hugo content repository and a directory to be published as a website.

Build and publish a sample site with Hugo’s CI/CD container
  1. Open Build-Pipelines of the project.

  2. Press Run pipeline button.

  3. Press Run pipeline button again, and the build will be completed in about 30s to 60s.

  4. Open Operate-Pages of the project.

  5. Open the URL indicated by Access pages to see a sample site that has been built.

Caution
As of 23 June, step 3 results in “"Error: failed to load modules:..." when applying theme as Hugo Module - Apply Docsy” and cannot be built. Please carry out the measures in the link or apply the theme introduced in the “Theme” section.