Hugo+Netlifyでブログを公開するまで〜ムームードメインの設定でハマった記録

MacにHugoを入れて、ローカルでサンプルサイトを立ち上げるまで – ひびテク

以前、ローカルでHugoのサイトを作成できるところまでは行っていました。
この環境を確認しつつ、Hugoで作ったサイトをNetlifyを使って管理・公開できるようにしました。

0. 前準備

今回は、TesterOfLightというブログを作ろうと思います。

基本的には、公式のガイドを見ながら進めました。

同時に、事前に選んでおいたHugoテーマのページにもインストール手順が書かれているので、こちらも参考にします。

また、今回は自分の決めたドメインでブログを公開したかったので、前もってムームードメインでtesteroflight.netを取得しておきました。

1. Hugoでサイトの中身を作る手順

1-1. サイト新規作成

まずはhugoの新規サイト作成。Hugoのブログのルートにしたいディレクトリで

$ hugo new testeroflight

を実行します。これでサイトを作る外枠ができました。

1-2. テーマを取得

次に$git initでgit管理にしたのち、テーマ追加を行います。

$ git submodule add https://github.com/davidhampgonsalves/hugo-black-and-light-theme.git themes/black-and-light

1-3. 設定ファイルの編集

config.tomlファイルを編集します。
今回選択したテーマのページに、サンプルのconfig.tomlへのリンクがあったので、一旦中身をまるっと貼り付け。

その後、設定ファイル中の

  • サイト名
  • サイトURL
  • 著者

などの項目を書き換えました。

設定ファイルの中の項目はテーマによっても違うので、テーマごとのインストール手順を確認しながら進めてください。

1-4. 新規の記事作成

動作確認用に、サンプル記事を作成しました。

$ hugo new posts/test.md

して、内容は適当なものを。

2. Netlifyでサイトを公開する

ここからはHugoとNetlifyを連携して静的ブログを公開する – RAYM DESIGNを参考にして進めました。

2-1. hugoのサイトをGithubにプッシュ

,gitignoreを作成して/publicを除外するよう設定します。
そしてGithubにプッシュします。

2-2. Netlifyで新規のサイトを作成

  1. Netlifyにログインして、Create a new site→Githubを選択します。
  2. リポジトリを選んで、hugoのバージョンを正しく設定。
  3. ここまでで、Netlifyの割り振ってくれたドメインで公開されるので、次に独自ドメイン設定を行う。
  4. Settings→Domain managementから、Add custom domain

ここでまでやって、あとは自分のドメインを入力するだけ、のはずが、失敗。ほんとうはムームードメインで取得した独自ドメインをNetlifyに設定 – tech buffetに書いてある流れでいけるはずが、なぜか私はうまくいきませんでした。

どうやら、NetlifyのDNSを使いたいのに、ムームーがネームサーバを抑えてしまっているらしく、Netlify側から設定できない状態になっていました。推奨ではないようですが仕方ないので、ムームーDNSを使って設定します。

ムームードメインにログインして、ドメイン管理→ネームサーバ設定変更→設定したいドメインの「ネームサーバ設定変更」から「ムームードメインのネームサーバ(ムームーDNS)を使用する」のラジオボタンを選択して、ネームサーバ設定変更。

次にドメイン管理→ムームーDNS→設定したいドメインの「変更」を押して、設定2の欄に以下のように入力。

  • www CNAME ****.netlify.com
  • (空欄) ALIAS ****.netlify.com

****のところは人によってことなります。

この方法でエラーが解消され、プライマリードメインと、プライマリーにリダイレクトされるドメインの設定ができました。

あとはHTTPS化もワンクリックでできて、完了。

この記事を書いた人

yoshikiito

都内でテストエンジニア&ブロガーをやっている@yoshikiitoです。

ソフトウェアエンジニアの学習方法や成長するための考え方、会社に依存せず自分の力で生きていけるエンジニアになる方法などについて興味があります。
こういった方法や考え方、自分が試したことなどをブログを通じて発信します。

仕事は主にソフトウェアテストやテスト自動化。
趣味は浦和レッズと読書と技術書を買って積むこと。

技術評論社から本を出すのが夢

この記事が気に入ったら
いいね!しよう

最新の情報をお届けします