Hugo + GitHub Pages + カスタムドメイン + SSLでブログを公開するまでのメモ
📅 公開: 2017-12-09
前提
Gitを操作したことないのにGitHub Pagesでブログを公開したい(めちゃくちゃですね)。
要件
- GitHub Pages + Hugo
- リポジトリ username.github.io
- Hugo Theme
- 独自ドメイン
- SSL
レシピ
作業
1.GitHub Pages + Hugo
GitHub Pages Basicsを何度も読みました。
-
<code>username.github.io</code>
-
<code>username/repository name</code>
前者と後者、どちらにするか迷いました。
username.github.io
master or gh-pages branchを選択する。どちらかのbranchにHugoが生成した/publicを公開する。masterなら/publicをGitHubで管理。gh-pagesならmasterでソースファイルを管理できる(と解釈しましたが、間違っているかも?!)
username/repository name
/docs folderへ/publicを公開する。その際、Hugoのconfig.tomlに以下を記述すれば、/docsに公開用ファイルを生成する。
publishDir = “docs”
ソースファイルと/docs folderをGitHubで管理できる(と解釈しましたが、間違っているかも?!)
解釈が間違っているかもと思いつつ、username.github.ioでmaster branchにして、jibutare.orgを運用し、それに慣れてから、username/repository nameでは、thinksell.jpを運用することに決めました。thinksell.jpはほとんど更新しないOne Pageのようなイメージです。
2.リポジトリ username.github.io
Configuring a publishing source for GitHub Pages の"Enabling GitHub Pages to publish your site from master or gh-pages“の手順どおりに進めました。
3.Hugo Theme
Hugo | Quick Start を読み、 ローカルで動作を確認。
テーマは、Hugo Themes | Minimo を選びました。カバーイメージが使えるので気に入っています。ドキュメントの記載どおりにconfig.tomlを設定、/theme > /minimoの中身を一つ一つ確かめます。ソースコードの跡を追いかけて、構成を理解していきました。
-
イメージの構成にしたいなら何を追加すればよいのか?
-
イメージの構成に必要なメニューの設定は?
-
カスタマイズしたいなら何を変更すればよいのか?
テーマのドキュメントとConfigure Hugo を何度も往来、イメージの構成に近づけました。
4.独自ドメイン
tumblrにCNAMEしていた いたjibutare.orgをGitHub PagesにCNAMEするために下記を参照。
Quick start: Setting up a custom domain
ステップどおりに手続きすればすんなりカスタムドメインでアクセスできました。
5.SSL
GitHub Pages + CloudFlareで独自ドメインをSSL化する
このページのおかけです。簡潔にわかりやすく記載してくださっていて、ほんとに助かりました。感謝です。
SSLに移行後、http → httpsへのリダイレクトに気を揉みました。IIJmio(iPhone SEとiPad Pro 10.5で使用)からは数時間ほどでhttpsにアクセスできましたが、自宅の回線はほぼ24時間かかりました。
ともあれ、無事、当初の前提をクリアできたので、これからGitを勉強します。
-
[Book](https://git-scm.com/book/ja/v2)
-
[『独習Git』 リック・ウマリ 著 吉川邦夫 訳](http://amzn.to/2BPdNRd)
2018/12/04追記
一年近く放置したままになっていたので、そろそろ再開しようと調べていたら、GitHub PagesがHTTPSをサポートしていました(参照:Custom domains on GitHub Pages gain support for HTTPS )。というわけで、上記の方法を採用していましたが、CloudFlareのCDNとDNSを停止しました。
参照
- GitHub PagesでHugo & 独自ドメイン & httpsなブログ環境の構築
- HugoとGitHub Pagesで静的サイトを公開する
- GitHub Pages + CloudFlareで独自ドメインをSSL化する
- Hugoで新規記事を作成するときのTips的なメモ