バンドのWebサイトをGitHub Pagesに移行し、カスタムドメインを設定する

この記事は

すこし前に自分のバンドのWebサイトをGitHub Pagesに移行し、Route53で取った独自ドメインを設定したのでそのメモです。

自己紹介

• Java（Spring Boot）のWebアプリ開発を主にやってます。
• バンドもやってます。

きっかけ

家を引越すときに、プロバイダを解約しました。

バンドのWebサイトをプロバイダ付属のホームページサービスで運用していたので、移行先を探さなきゃいけなくなりました。いろいろ調べると、無償の選択肢がたくさんあって、一番手軽そうなGitHub Pagesに落ち着きました。

いい時代になりましたね。

移行先にGitHub Pagesを選んだ理由

単純に書くと以下になります。

• 無料である
• 使い慣れてるGit操作が使える
• 移行するWebサイトが静的サイトなので必要十分
• 資材の置き場所と公開先が同じなので運用しやすい（放置しやすい）

とにかくお手軽ですね。

Hugo + Netlifyを選ばなかった理由

流行りのHugoとNetlifyも試してみました。これも十分お手軽ではあるのですが、以下の理由で今回は見送りました。

バンドのイメージにあうテーマを見つけられなかった

少ない手間で一定レベル以上のUI/UXをもつサイトを素早く作れるところは、静的サイトジェネレータの強みのひとつです。一方でバンドサイトのように趣味性の高いデザインには適用しづらいな、というのが試用してみた印象です。

「合うテーマがなければ自分で作る」のも一つの回答ですが、残念ながらそこまで使いこなせてないです。

いっぽうで、ブログ型のサイトに向くことはわかったので、実はメンバブログだけHugo＋Netlifyに移行しています。

そもそもそんなにコンテンツ更新してない

Hugo＋Netlifyに手をだしたのは、サイトデザインがあまりにも古いため、最低限モバイル対応くらいのリニューアルはしておきたかったためです。

でも冷静にかんがえると、今は告知やファンとの交流の場はSNSに移って、Webサイトの更新をめっきりしなくなってしまいました。そのわりにリニューアルにはそれなりのパワーが必要なので、今回はあきらめました。移行するだけだったらHugo＋Netlifyにするまでもなかったです。

Hugo＋Netlify自体は素晴らしい組み合わせだとおもいます。いずれリニューアルするときに再検討したいです。

カスタムドメインの設定方法

0. 事前準備

以下については良質な記事がほかにたくさんあるので、割愛します。

• GitHub Pagesに静的サイトを設定・公開する
• Route 53でドメインを取得する

1. GitHub Pages側

カスタムドメイン名の設定

• GitHubのリポジトリで「Settings」を選びます。
• 「GitHub Pages」欄の「Custom Domain」に、カスタムドメイン名を入力して「Save」ボタンを押します。ここではサブドメイン「www」を付与した形（ex. www.example.com）にします。
  

HTTPSの有効化

• 「Custom domain」欄の下にある「Enforce HTTPS」チェックボックスをONにします。
  

注意：「Custom domain」の設定から24時間経過しないとチェックボックスがONにできないので、次の日に設定するのを忘れずに、気長にまちましょう。

2. Route 53側

ホストゾーンの作成

• AWSコンソールにログインし、Route 53を開始します。
  
• ホストゾーン作成を開始します。
  
• 「ドメイン名」欄に、先立って取得済のカスタムドメイン名（ex. example.com）を入力し、「ホストゾーンの作成」ボタンを押します。
  
• 作成に成功すると、NSレコードとSOAレコードができます。
  

CNAMEレコードの追加

• 「レコードの作成」ボタンを押し、ルーティングポリシーで「シンプルーティング」を選択して「次へ」ボタンを押します。
  
• 「シンプルなレコードを定義」ボタンを押します。
  
• 以下を入力し、「シンプルなレコードを定義」ボタンを押します。
  • レコード名：「www」（www.example.comとなるようにする）
  • 値/トラフィックのルーティング先：レコードタイプに応じたIPアドレスまたは別の値
    • GitHub Pagesのデフォルトのドメイン名（リポジトリ名がhogeの場合、「hoge.github.io」）
  • レコードタイプ：CNAME
  • TTL（秒）：300（デフォルト）
    
• 「レコードを作成」ボタンを押します。
  

これは余談かつインディーズバンドあるあるなんですが

活動が停滞したり休止に追い込まれたバンドのサイトはだいたいが悲しい末路を迎えます。

ふと思い出して知り合いのサイトを訪れると、リンク切れだったり、ドメイン更新切れであやしいアダルトサイトに転生していたりして悲しい気分になる経験が少なからずあります。同じ時代を共に活動した仲間としては切なくなりますね。

GitHub Pagesなら、すくなくとも金銭的理由でサイトが閉鎖されることはないでしょう。活動のペースが落ちているバンドも（まさに自分のバンドがそうなんですが）、サイト運営・維持にかかる負担を限りなく小さくできます。

不幸にして解散となっても、墓標として後世に事績を残すことができるでしょう。