Hugoでブログ作成してBitbucketで管理してNetlifyで公開する

ブログを作ろうとは前から思ってたけど、昔使ってたブログサイトの思い出からWEBページで記事書くのは嫌だなぁと（10年前位…今は色々できるだろうけど当時は知識も無かったから文章書いてボタンとか使って整形して、画像保存して限られた容量でアップロードして…とかが結構面倒だったという思い出補正もある）。
AtomとかでMarkdownで記事作ってリポジトリで管理してデプロイまで適当にうまくやってくれるのを全部無料で、、、そんなのできるかーいと思いながらもググったらできそうだったのでやってみた。

ブログの構成

• ブログ本体
  本体という表現が正しいかはさておきHugoで作成。
  テーマは日本のHugoユーザーならお馴染みであろうRobust。
  静的サイトジェネレータだとかそこら辺の解説は詳しいサイトにお任せ。

• リポジトリ
  Bitbucketを使用。
  無料でPrivateな奴が使いたかったのでGithubではなくこちらで。

• サーバ
  Netlifyを使用。
  使った理由は基本無料だったのと、Pushしたら自動的にデプロイしてくれるから。
  サイトも見やすくて英語Noobな自分が直感的に操作できるUIもよかった。

全体の構成について参考にしたもの

• ブログの構成
  NetlifyでHugoで作った静的サイトをホスティングしてビルドを自動化する - Snaplog
  基本的にはこのサイトを参考にして作成した。
  リポジトリはGithubじゃないけど立ち上げに関しては戸惑うことなく出来た。感謝。
  

Hugoについて参考にしたもの

• Hugoのテーマに関する参考サイト
  HUGO のテーマ Robust のカスタマイズver3 - zzzmisa’s blog
  パッと見たときに見やすくて綺麗なサイトだったので参考にさせていただきました。
  デフォルトのアイキャッチはぱくたそから「車の窓で居眠りする犬」。かわいい。
  まだデフォルト要素やパクったままでちゃんと動作しないものもあるので整備していく。

• Hugoで困ったこと
  Table Of Contentsを出したかったけど出し方が中々分からなかった。
  このページの上にもある灰色背景の見出しを纏めてくれるイカしたアイツ。
  1時間位探して以下のサイトに書かれていたのを発見。
  Hugo のテーマを Cabaret に変更した -mano.xyz

  その他
  目次(Table Of Contents, toc)を表示するには toc=true と指定する．

  あっはい。
  よく見るとRobustテーマのreadmeにも書いてた。
  FrontMatterに追加して表示できた。

Bitbucketについて参考にしたもの

• 基本的な使い方
  ここ見た（雑）
  [Bitbucket]gitコマンドでBitbucketを操作する　〜基本編〜 -Qiita
  [Bitbucket]リポジトリを最初にpushする方法 -Qiita
  Bitbucket git ローカルに作ったリポジトリをpush -Qiita
  基本的にはQiita漁ってれば何とでもなる感じでした。情報量は充分。
  今まで触れる機会が少なかったGitコマンドに関してはここで経験値稼げた。

  実はスムーズに行かなくて、初回pushでこんなエラーが出た。

  ❯ git push origin master
  To https://bitbucket.org/TelBouzu/blog.git
  ! [rejected]        master -> master (non-fast-forward)
  error: failed to push some refs to 'https://TelBouzu@bitbucket.org/TelBouzu/blog.git'
  hint: Updates were rejected because the tip of your current branch is behind
  hint: its remote counterpart. Integrate the remote changes (e.g.
  hint: 'git pull ...') before pushing again.
  hint: See the 'Note about fast-forwards' in 'git push --help' for details.

  エラー読んだ感じだと「お前pushしようとしてるけど古いバージョンに修正いれてるから新しいバージョンとmergeしろよな」みたいなこと言われてるはず。けど初期化直後だから原因がよくわからず。mergeもうまく動作しなくて少し困った。

  とりあえず以下のページのコマンドで解決した。
  初めてGitHubリポジトリにpushしたらrejectedエラーになったときの対応メモ -Qiita
  コマンドは以下。

  git merge --allow-unrelated-histories origin/master

  この --allow-unrelated-historiesオプションがキモだった。

Netlifyについて参考にしたもの

大体は全体の構成について参考にしたものと同じ。

• 独自ドメイン
  最初はこのサイトみて作業してた。
  NetlifyとGithubで独自ドメインのサイトをHTTPS化したメモ -MagChoの雑記
  途中までは読みながら作業進めてたもののDNSの設定とかよく分からんな…とか思って良い方法がないか探したらQiitaの記事に簡単にできそうなのがあった。
  爆速で netlify を使いたいなら、 DNS サーバーは netlify Managed DNS を使おう -Qiita
  上の記事で悩んでから見たら簡単にできた。多分先にこっち見てもわかんなかったかなーとも思ったのでいい勉強でした。
  

今後の課題

まだまだ山積み建築途中って感じ。
記事を書くときのテンプレートも無い。アクセス解析とかも導入したい。
見た目もちょいちょいオリジナリティ出していきたいなぁ。とか思う。