サイト引っ越しました。Hugo + Netlify + ムームードメインで取得した独自ドメインの運用に切り替えました

なんとなく気分でブログのリニューアルと引っ越しをしました。慣れ親しんだJekyll+GitHub PagesからHugo+Netlifyに移行です。

あ、新しいドメインはt4traw.netです。もうネーミングがめんどくなって自分のidというドメインの果てに来た感があります。

ぶっちゃけJekyllの不満はビルドが若干遅いくらいで、とくに問題なかったのですが、仕事でも使っているNetlifyがあまりに便利なため、自分のブログもNetlifyに移行したいなぁと思ったのがきっかけです。で、どうせならgoで書かれているビルドが快適なHugoにしてみようと。

で、Hugoならではの機能はとくに使っていません。ので、今回はムームードメインで取得した独自ドメインをHugo+Netlify環境で設定する方法を書きたいと思います。

Netlify: All-in-one platform for automating modern web projects.

独自ドメインの取得方法とサイトの作成はスキップして、取得後にやる作業を書きます。

ドメインの設定画面が、Settingの一覧にないので微妙に分かりづらいのですが、Overviewを開いたこのあたりにあります。

Add domain aliasというボタンをクリックし、ドメインを入力する画面が表示されるので、そこにwwwをつけたドメインを入力します(詳しくは各自調べて欲しいのですが、Netlifyはさまざまな面からwww付きのウェブサイト運用を推奨しています)。

今回の自分のパターンだとwww.t4traw.netを入力しYes, add domainをクリックします。

で、こっから分かりづらいのですが、カスタムドメインのリストの右側のオプションにあるSet up Netlify DNSをいうリンクをクリックします。

これが下に表示されていたりなかったり、なんかちょこちょこ場所が変わるので、DNS設定画面は各自気合で探してください。

そのリンクさえ見つかれば後は簡単です。VerifyContinueをサクっと進めましょう。

そしたらUpdate your domain's nameserversという項目にネームサーバーの設定が表示されるので、これらをムームードメインのネームサーバーに設定します。

↑みたいな感じになっていれば大丈夫ははずです。

成功すればカスタムドメインの画面がこんな具合に表示されていると思います。

ムームードメインで取得した独自ドメインをNetlifyで使う方法でした。

いろいろ便利すぎて感動します。

  • Hugo+yarn(webpack)でサクっと最新の環境で静的htmlを生成
  • Gitでバージョン管理
  • GitHubにPushしたらNetlifyでビルド
  • https化やhttp/2に対応
  • そしてこれらすべてが個人だったら無料の範囲内で可能

いやぁ、すごい時代です。あとはScoped styleがサっとできるようになったらすごいんだけどなぁw

それでは。