ブログ作成、最初の一歩で考えたこと

公開日: 2020年05月24日最終更新日: 2022年01月28日

Gatsby + GitHub + Netlifyでブログを立ち上げるにあたって考えたことや調べたことをメモしておきます。

何を使って始めるか

ブログをどうやって始めるかいろいろ調べていましたが、はてなブログ、Wordpress、Static Site Generator（SSG）で迷いました。

調べて自分が受けた印象は以下のような感じです。

はてなブログ
- 手軽に始められて運用の手間もありません。
- 独自ドメインを使うためにProにする必要があり料金が発生します。
- カスタマイズの幅は限られます。
- サービスとして必要なものが用意されている反面、技術的に学べることがあるか懸念があります。
Wordpress
- 豊富なプラグインとテーマによるカスタマイズができます。
- 自分でプラグインやテーマを作れば、CSS、PHP、JavaScript、HTMLについて学べます。
- サーバーのホスティング費用が発生します。
- 運用・メンテナンスに時間を取られる懸念があります。
Static Site Generator（SSG）
- 既製のテンプレートを使えば簡単に始められます。自分で作れば何でもできます。
- Netlifyなど使えば、独自ドメインを使っても無料で始められます。
- コンテンツ管理システムがないのでデータが多いと管理が困難です。
- Reactを始め、いろいろなフレームワークが使われていて勉強のしがいがあります。

自分は、手軽に始められる、技術、流行、費用といった点からSSGで始めることにしました。

SSGの選択

SSGにも色々あるため、何を使うかを更に考えなければなりません。選択肢が多くて楽しいですが、調べるのが大変です。

SSGの一覧が見られるサイトを眺めつつ、Next.js、Gatsby、Hugo、Nuxtあたりを候補に考えました。2020/05/18時点で人気そうな順に選んだだけですが。
最近Reactを触る機会があったのでReactベースのSSGを使ってみたく、そうなるとNext.jsかGatsbyが選択肢になります。

正直、Next.jsとGatsbyどちらがいいのかはわかりませんが、とりあえず早く始められそうなGatsbyを使ってみることにしました。後で変えるかもしれません。

独自ドメインの取得（Google Domains）

独自ドメインが取得できることは知っていましたが、こんなに簡単に取得できるものとは。
Google Domainsで好みのドメインを探してカートに入れて購入するだけです。ドメイン名によっては1400円/年と安価で取得できます。

ホスティング（Netlify）

Netlifyの無料プランで行くことにしました。以下のような制限はありますが、始めたばかりのブログには十分です。

登録メンバー1名
同時ビルド数は1個まで
転送量100GB/月
ビルド時間300分/月まで

ただし、転送量とビルド時間については上限を超えると追加料金が発生します。

追加転送量 20$/100GB
追加ビルド時間 $7/500 minutes

使用した量が50%, 75%, 100%のタイミングでメール通知が来るとのことですが、現時点でハードキャップは存在しないので注意深く監視してください。こちらも参考に。

いまのところGatsbyのビルド時間は1回あたり約1分なので月に150回くらいの更新は安全そうです。ただ、ローカルでの事前確認をちゃんと行い、masterへのmerge/pushは必要最低限にしようと思いました。

deployはドキュメントと動画に従って進めればあっという間に終わります。独自ドメインの設定（Google DomainsとNetlifyの両方）とHTTPS化も簡単でした。このあたりの手順は検索するとたくさん出てくるので助かります。

ブログの構築（GatsbyJS）

Quick Startに従って進めます。Starterをそのまま使えばあっという間に構築が完了します。自分はGetting Started with Gatsby Themesに従ってgatsby-starter-blog-themeを使ってみました。

テンプレートからブログサイトのデータを生成したらgatsby developコマンドを実行してローカルで動作確認します。
問題なければcommitしてGitHubにpushします。初回は2分程度でビルドされ、WEBでブログページを確認することができます。

Google DomainsでのDNSへの登録が反映されるまで時間がかかるかと思ったら1分もかからずアクセスすることができました。早いですね。

あとは/content/posts/にマークダウンで記事を追加していけばOKです。 GitHubで記事もコードも管理できるのは自分に合っているような気がします。

今後

今後はカスタマイズしてみたいです。まずは記事が先、とは思うのですが……。
Typographyが真っ先に気になりました。Typographyもカスタマイズできるようになっているのでやってみようと思います。