Hugoでサイトつくってみる

サイトジェネレータつかって静的コンテンツをいい感じに作りたいとおもいました。

ここでのいい感じとは

Webアプリケーションと切りはなされてて
Edgeがきいてて
Lovelyで
Long life(飽きがこない)

つまり「WELL」(いまかんがえた)

Hugoがファイル生成速くていい感じらしいので試してみます。

インストール

GitHub - spf13/hugo: A Fast and Flexible Static Site Generator built with love in GoLang

installing guide に従ってインストール

Hugo - Installing Hugo

goはいってない場合はgoから。

$ brew install go

How to Write Go Code - The Go Programming Language

zshつかってるので ~/.zshrc でGOPATH指定します。

これからGoを始める人のためのTips集 | The Wacul Blog

なるほどなるほどっておもったので、以下のように指定しました。

export GOPATH=$HOME/go/third-party:$HOME/go/my-project
export PATH=$HOME/go/third-party/bin:$HOME/go/my-project/bin:$PATH

準備できたのでインスト〜ル

$ go get -v github.com/spf13/hugo

mysite をつくります。

$ hugo new site mysite

カレントディレクトリに以下の構成ができました。

$ tree mysite
mysite
├── archetypes
├── config.toml
├── content
├── data
├── layouts
├── static
└── themes

Hugo Themes Site

テーマを試しに1つ用意します。

git clone https://github.com/lasseborly/anybodyhome.git themes/anybodyhome

config.tomlを編集。

baseurl = "http://replace-this-with-your-hugo-site.com/"
title = "My New Hugo Site"
languageCode = "en-us"
theme = "anybodyhome"

記事つくってみます。 hugo new hoge.mdcontent 下に追加されました。

$ cd mysite
$ hugo new hoge.md
$ tree .
.
├── archetypes
├── config.toml
├── content
│   └── hoge.md
├── data
├── layouts
├── static
└── themes

TOML記述のfront matterがページ毎のパラメータとしてついてます。 もちろんカスタマイズできるとのこと。

$ cat content/hoge.md
+++
title = "hoge"
draft = true
date = "2016-09-12T02:45:25+09:00"

+++
$ vim content/hoge.md
+++
title = "hoge"
draft = true
date = "2016-09-12T02:45:25+09:00"

+++

# My First static page generate by Hugo.

確認のためサーバー起動&ビルド

draft=trueのページしかないのでドラフト版もビルドするオプションつけます。

$ hugo server --buildDrafts
Started building sites ...
Built site for language en:
1 of 1 draft rendered
0 future content
0 expired content
1 pages created
0 non-page files copied
1 paginator pages created
0 tags created
0 categories created
total in 34 ms
Watching for changes in /Users/akrmiya/test/mysite/{data,content,layouts,static,themes}
Serving pages from memory
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

f:id:akrmiya:20160912032251p:plain 表示できました。

ビルド後の構成。(テーマ以下は省略)

├── archetypes
├── config.toml
├── content
│   └── hoge.md
├── data
├── layouts
├── public
│   ├── 404.html
│   ├── index.html
│   ├── index.xml
│   └── sitemap.xml
├── static
└── themes
    └── anybodyhome

飽きてないし愛せるのでHugoいい感じです。 整えてこんどオリジナルテーマつくりたいとおもいます。