Hugo Demo

This is just a quick show of using Hugo to create a website. Mostly I just followed the installation instructions for the Relearn theme (link in the menu). I did add a small amount of content so we have something to discuss.

The content in this site isn’t useful (unless you need an arm32 binary). The links on the side point to more useful sites.

The relearn theme is only one of hundreds. There are themes the are focused on creating blogs, recipe sites, resumes, etc. I chose Relearn becaus it was focused on documentation. It included support for mermaid.js, an example:

%%{init: {"flowchart": {"htmlLabels": false}} }%%
flowchart LR
        subgraph handleSocket["HANDLE SOCKET"]
            openListener("open\nlistener") --> acceptConnection("accept\nconnection")
        acceptConnection --> spawnHandler("spawn\nhandler") --> acceptConnection
        end
        subgraph handleConnection["HANDLE CONNECTION"]
        echoData("echo data") --> closeConnection("close\nconnection\n«defered»")
        end
    printBanner("print\nbanner") --> openListener
    spawnHandler -.-> handleConnection
    style spawnHandler fill:#828,color:white

Other themes

Just some demos that I found.

• ananke A blog like site. Articles summarized on the front page.
• resume Generates A single page site for showing your resume
• hugo scroll Puts all pages on one, with alternating colors.
• I lost the link to the recipe theme that I found. It was nice as it didn’t look like all the other themes.

Content Directory

This is where you edit the content of the webpages. The structure of this site is:

content
├── basics
│   ├── first-content
│   │   └── _index.md
│   ├── _index.md
│   ├── second-content
│   │   └── index.md
│   └── third-content.md
├── _index.md        <---- you are here
└── other-notes
    ├── hugo-for-32bit-raspberrypi
    │   ├── hugo-arm32l
    │   └── index.md
    └── _index.md