Introduction

In this tutorial, we will walk through the process of deploying a Hugo website on an FTP server. Hugo is a popular static site generator that allows you to create fast and efficient websites. Deploying your Hugo site to an FTP server enables you to make your website accessible to the world.

Prerequisites

Before we begin, make sure you have the following prerequisites in place:

  1. A working Hugo website: If you haven’t created a Hugo website yet, you can follow the official Hugo documentation to set it up.
  2. FTP server access: Ensure you have access to an FTP server where you want to deploy your Hugo website. Obtain the FTP server address, username, and password.

Install FTP-Deploy-Action

To deploy the built website to your FTP server using GitHub Actions, you will need the ‘SamKirkland/FTP-Deploy-Action’ GitHub Action. In your Hugo project’s repository, create a ‘.github/workflows’ directory if it doesn’t already exist.

Create a new YAML file (e.g., ‘deploy.yml’) in the ‘.github/workflows’ directory. Add the following content to the YAML file:

name: Build and Deploy

on:
  push:
    branches:
      - main # Change 'main' to your branch name if different

jobs:
  deploy:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout Repository
        uses: actions/checkout@v2
        with:
          submodules: 'recursive'

      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: 'latest'
          extended: true

      - name: Build
        run: hugo --minify

      - name: FTP Deploy
        uses: SamKirkland/FTP-Deploy-Action@v4.3.4
        with:
          server: ${{ secrets.FTP_SERVER }}
          username: ${{ secrets.FTP_USERNAME }}
          password: ${{ secrets.FTP_PASSWORD }}
          local-dir: ./public/

Make sure to set up the secrets FTP_SERVER, FTP_USERNAME and FTP_PASSWORD in your GitHub repository settings.

Commit and Push

Save the changes to the YAML file and commit them to your repository. Push the changes to the ‘main’ (or your specified) branch. This will trigger the GitHub Actions workflow to build and deploy your Hugo website to the FTP server.

Verify Deployment

GitHub Actions will automatically start the deployment process once you push the changes. You can monitor the progress and check for any errors in the Actions tab of your GitHub repository.

Upon successful deployment, your Hugo website will be available on your FTP server, and visitors can access it through the server’s URL.