Create a Hugo Website and Deploy It with ZEIT Now

Hugo is a very popular framework for creating static websites. It's fast and flexible.

In this guide, we will walk you through setting up a Hugo website and deploying it with ZEIT Now.

Step 1: Setting Up Your Hugo Project

To get a Hugo project running, you need to install a precompiled binary on your machine. Hugo currently provides pre-built binaries for macOS, Windows, and Linux.

Therefore, you can either download the appropriate version for your machine from the GitHub releases or install it via your machine's package manager.

For macOS users, you can install Hugo via Brew:

brew install hugo

Installing Hugo CLI via Homebrew.

For Windows users, you can install Hugo via Chocolatey:

choco install hugo -confirm

Installing Hugo CLI via Chocolatey.

Next, run the following command to create a Hugo project via the CLI:

hugo new site my-hugo-project

Creating a new Hugo project via the CLI.

You can add a theme to beautify the newly created site. cd into the my-hugo-project directory and run the following command to add a theme:

git init && git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke

Download a new theme to the Hugo project.

The next step is to activate the theme. From your terminal, add the ananke theme to the config.toml file.

echo 'theme = "ananke"' >> config.toml

Edit your config.toml configuration file, and add the theme

Create Some Content

You can add some content to the Hugo project by running the following command:

hugo new posts/my-first-post.md

Creating a new post in the Hugo project via the CLI.

Once you are done running the command, edit the my-first-post.md file (within the contents/posts directories) and add the following content below the generated metadata:

## Deploying Hugo with ZEIT Now

You can now see your project running locally with the following command:

hugo server -D

Running the server locally with drafts enabled

Step 2: Deploying Your Hugo Website with Now

Your Hugo website is ready for deployment. Create a package.json in the project directory with the following content:

{
  "scripts": {
    "install": "curl -L -O https://github.com/gohugoio/hugo/releases/download/v0.55.6/hugo_0.55.6_Linux-64bit.tar.gz && tar -xzf hugo_0.55.6_Linux-64bit.tar.gz",
    "build": "./hugo"
  }
}

A package.json configuration file with install and build scripts.

With the build scripts added, you can now deploy your Hugo project.

If you have not yet installed Now, you can do so by installing Now CLI.

With Now installed, you can deploy from your terminal with a single command:

now

Deploying the app with the now command.

If you want to deploy your Hugo project when you push to a Git repository, you can use either Now for GitHub or Now for GitLab to have your project automatically deployed on every push, and aliased on push to master.