なんかwordpress疲れが出てきたので静的サイトをいい感じで作ってくれるHUGOというOSSを使ってみます。

環境は

Windows 10(64bit)

git

githubアカウント

HUGOのインストール

Install Windowsを参考にhugoをインストール。

インストーラーとかないのでバイナリをコピーしてPATHを通すだけ。環境汚さなさそうでいい感じ。

1
2

> mkdir C:\var\hugo\bin
> mkdir C:\var\hugo\Sites

https://github.com/gohugoio/hugo/releasesからhugo_0.51_Windows-64bit.zip

をダウンロードしてきて、中身をC:\var\hugo\binにコピー。

C:\var\hugo\binにPATHを通す。

1
2

> hugo version
Hugo Static Site Generator v0.51 windows/amd64 BuildDate: 2018-11-07T10:11:06Z

サイト作ってみる

Quick Startを参考にサイトを作ってみます。

1
2
3
4
5
6

> cd C:\var\hugo\Sites
> hugo new site quickstart
> cd quickstart
> git init
> git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke
> code .

config.tomlに

1

theme = "ananke"

を追記。

コンテンツ追加

1

> hugo new posts/my-first-post.md

.\content\posts\my-first-post.mdを適当に編集。

ローカルでお試し

1

> hugo server -D

http://localhost:1313/にアクセスすると追加したページが出ます。

live-reload的な機能も付いてるみたいなので、コンテンツを編集しながらプレビューもできそうです。

この辺でコミットしとく

1
2

> git add .
> git commit -m "init"

ビルドしてみる

Deploy Your Websiteを参考にBuildします。つっても

1

> hugo

だけですが。

publicフォルダができて、コンテンツがそれっぽく生成されています。

Github pagesで公開してみる

Deployment of Project Pages from /docs folder on master branchを参考に

config.tomlに

1

publishDir = "docs"

を追加。

ビルドするとdocsフォルダができます。

お試しビルドしたpublicフォルダは消しときます。

んでコミット。

1
2

> git add .
> git commit -am "first build"

githubにレポジトリを作ります。

名前はhugo_qsにしました。

pushします。

1
2

git remote add origin git@github.com:fileszero/hugo_qs.git
git push -u origin master

レポジトリのserrings->options->GitHub Pagesで”master branch /docs folder”を選んで”save”。

今回の場合は、https://fileszero.github.io/hugo_qs/ にアクセスすれば出るはず。。。

・・・出ませんね。生成されたhtmlを見るとサブディレクトリに配置されることは想定されていないっぽいです。

config.tomlのbaseURLを

1

baseURL = "https://fileszero.github.io/hugo_qs/"

にして、build&commit&push

1
2
3
4

> hugo
> git add .
> git commit -am "change baseUrl"
> git push -u origin master

一応スタイルとかは適用さていますが、記事がない。。。

記事ファイルのcontent\posts\my-first-post.mdの

draft: true

を

draft: falseにして

build&commit&push

でた、

で

なるほど、wordpressから移行する人が多いのも納得。

サイトの性格にもよると思うけど、こっちの方が保守性いいよね。

wordpressいいんだけど、なんか気を使うことが多くて個人の静的サイトには大げさすぎるような気がする。