NML Says

hugo

Create a New Hugo Site Project

Hugo is a framework for creating static websites, an SSG, Static Site Generator. It is written in the Go programming language.

Hugo has a very simple structure. There is a content layer where you write the individual content of your pages. The content is mainly written in the markdown markup language. The content is wrapped in a theme layer taking care of the resulting HTML, and the layout of the pages. In that layer there are rich facilities for the DRY pattern in your development effort. At any point during the process, you may build and test your site. The result of the build process is contained in a public directory. This directory contains all that will eventually be deployed for publication.

The Infrastructure of your Site

From the command line first do:

1

hugo new site hugoone

if you see no errors do

1
2
3
4

cd hugoone
git init
echo '/public/' > .gitignore
echo '.hugo_build.lock' >> .gitignore

hereby you make hugoone the working directory, and you create your project repo in that directory. In addition you create a hugo appropriate .gitignore for your project.

To get a bearing of the consequences of these initial steps, take a look at the initial file and directory content of your site:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

.
|-- archetypes
|   `-- default.md
|-- assets
|-- content
|-- data
|-- hugo.toml
|-- i18n
|-- layouts
|-- static
`-- themes

You may now test start serving the site

1

hugo server -D

Go to your browser and navigate to: http://localhost:1313. You should expect something like:

This is not an error, but just a result of not yet having written any content for the project.

Add a Theme

You must add a theme to your project. The presentation and the skeleton layout of your site comes from the theme.

1
2
3

git submodule add https://github.com/yihui/hugo-xmin.git themes/hugo-xmin
echo '' >> hugo.toml
echo 'theme = "hugo-xmin"' >> hugo.toml

This theme is minimal. Eventually you will want to create your own theme(s), but until then this will be useful. Please read it’s author’s remarks in the
README of their repo.

Add a Content Page

There are several ways of doing this, but canonically we would do:

1
2

hugo new content content/program/cloud/_index.md
hugo new content content/program/cloud/cloud0.md

where the first three words says that we, in hugo, creates new, content, and the last bit designates the content file. The path is an important structuring element. The section program will be given a subsection cloud in which we place the content file cloud0.md which we subsequently edit to supply the actual content.

The created content markdown file will look as follows:

1
2
3
4
5

+++
title = 'Cloud0'
date = 2024-11-03T15:33:26+01:00
draft = true
+++

When the content renders, it’s outline will have the title as its H1 header.