今回作ったAlexaスキル「HTTPステータス検索」には、プライバシーポリシーや利用規約のようなものはありません。なぜかというと、特にユーザ情報等を取得するような機能がない場合には、Alexaスキルの申請では必須ではないためです。ただし、
- ユーザ情報を取得するようなスキルの場合はもちろん必須（AlexaやClova）
- Google Homeのアクションの場合は常に必須（の様子）
ということもあり、いろいろ作るにあたっては、プライバシーポリシーや利用規約等の置き場についてはあらかじめ考えておく必要があるかと思います。
ブログとか、安いレンタルサーバとか、やり方はいろいろあると思いますが、ちょっと変わったものが良い、どうせなら公開したスキルをポートフォリオに載せたい、今回Github Pages + Hugo でサイトを作ってみました。Githubなので開発者にもつながるわけですし、良い感じです。
参考にさせていただいたのはこのあたり。というかまんまやってみただけですね。。。
gohugo.io https://onoxeve.com/posts/hugo-on-github-pages/onoxeve.com
事前準備
Github上に２つのレポジトリを作る
- プロジェクト全体のレポジトリ(ex. https://github.com/kun432/hugo-kun432.github.io.git)。Hugo本体含めた、コンテンツ制作環境全体を管理します。
- github pagesのレポジトリ(ex. https://github.com/kun432/kun432.github.io.git)。実際にGithub Pagesで公開されるコンテンツを管理します。
作業
プロジェクトリポジトリをcloneする
$ git clone https://github.com/kun432/hugo-kun432.github.io.git
$ cd hugo-kun432.github.io
hugoでサイトを作る
$ hugo new site portfolio
$ cd portfolio
ここが テーマを導入する。テーマは https://themes.gohugo.io/ にいろいろあるのだけど、今回はちょっと違うところから持ってきたものを使います。
$ git submodule add -b master https://github.com/anirbanmu/hugo-sustain-vitae.git themes/hugo-sustain-vitae
必要なものをルートにコピーし、カスタマイズしていきます。この部分については後述しますので、まずは最低限。
$ cp -i themes/hugo-sustain-vitae/exampleSite/config.toml .
config.tomlが基本の設定ファイルになるのでこれを修正します。テーマによって修正箇所が異なるのけど、とりあえずこんな感じです。
baseurl = "https://kun432.github.io/" languageCode = "ja-JP" title = "Kuniaki Shimizu" ・・・ [params] avatar = "profile.png" author = "Kuniaki Shimizu" description = "Kuniaki Shimizu's Portfolio" [params.social] Github = "kun432" # Email = "email@example.com" Twitter = "kun432" # LinkedIn = "username" # Stackoverflow = "username" # Medium = "username" # Telegram = "username" [params.vitae] website = "kun432.github.io" website_full = "https://kun432.github.io/" # tel = "+44 0000 000000" # tel_full = "+440000000000" google_maps = "https://www.google.co.jp/maps/place/%E5%85%B5%E5%BA%AB%E7%9C%8C%E7%A5%9E%E6%88%B8%E5%B8%82%E7%81%98%E5%8C%BA/@34.7315238,135.192916,13z/data=!3m1!4b1!4m5!3m4!1s0x60008c015d1dfe99:0xe786b31b96838de5!8m2!3d34.7123285!4d135.2396571?hl=ja" address = "Nada-ku" # postcode = "EH3 5BL" city = "Kobe, HYOGO" country = "Japan"
とりあえずローカルで立ち上げます。
$ hugo server -w
ブラウザで http://localhost:1313 にアクセスすると見えますね。-w がついていると修正がすぐに反映されますので、カスタマイズ中はとても便利です。
一通り終わったら、Github Pagesにアップするコンテンツ生成の準備です。
Hugoではサイトのルートディレクトリ（今回だとportfolioディレクトリ）のpublicディレクトリ内にコンテンツが生成されるので、ここをgit submoduleで登録します。
$ git submodule add -b master https://github.com/kun432/kun432.github.io.git public
デプロイ用のシェルが用意されているので、これを使います。
$ vi deploy.sh
#!/bin/bash echo -e "\033[0;32mDeploying updates to GitHub...\033[0m" # Build the project. hugo # if using a theme, replace with `hugo -t <YOURTHEME>` # Go To Public folder cd public # Add changes to git. git add . # Commit changes. msg="rebuilding site `date`" if [ $# -eq 1 ] then msg="$1" fi git commit -m "$msg" # Push source and build repos. git push origin master # Come Back up to the Project Root cd ..
実行します。
$ chmod +x ./deploy.sh $ ./deploy.sh
Github Pages用レポジトリにプッシュされて公開されます。
最後に、プロジェクト用レポジトリもcommit、pushしておきます。
$ cd ../.. $ ls portfolio $ git commit -a -m "first commit" $ git push -u origin master
でできたのがこれです。
設定とカスタマイズ
テンプレをそのまま使ってブログを書くだけならいいんだけど、いろいろカスタマイズしたくなりますよね。今回のサイトでもかなりいじってて、その過程でいろいろ役に立った情報やサイトなどをまとめておきます。
基本的には、themesフォルダのファイルはいじらない。カスタマイズが必要ならば、themesフォルダのファイルをルートディレクトリの同じディレクトリ構成にコピーしていじる。
とはいいつつ、いきなりは難しいので、一旦はテーマのexampleSite内をまるっとルートフォルダに上書きして、データがテンプレートでどのように整形されて表示されるのかを確かめつつやるのがよい。その場合、contens、dataにあるデータがlayoutsにあるテンプレートに表示されるって感じ。
exampleSiteのデータをコピーした場合、最後には不要になるものも多いので、削除すること。
以下参考にさせていただいたサイトです。
Hugoにコメント欄を追加できるDISQUSを導入 - Mono Works
まとめ
以前、Jekyllでブログを作っていたこともあるのですが、いつでもどこでも気楽に更新したいというブログのニーズや、Jekyllの環境構築の面倒さで、長続きしませんでした。今回、ポートフォリオということで、そんなに更新頻度高いわけではないですし、goなら環境構築もシンプルなので、とてもマッチしてます。カスタマイズもしやすいし、ユースケースにあえば、おすすめです。
新しいスキルができたらどんどん載せて行きたいと思います。
