About the technology stack of this blog

tech;
futahashi

futahashi / December 11, 2021

6 min read

はじめに

私が本ブログを開始するにあたって、考えたことや選択した技術について簡単にお話します。

ブログをはじめるための選択肢

ブログをはじめるには、ざっくり2つ選択肢があると思います。

  1. ブログやコンテンツ配信サービスを利用する
  2. ホスティングサービスやクラウドを利用する

1. ブログやコンテンツ配信サービスを利用する

1に関しては、Hatena Blogの他、コンテンツの配信としてはnote / Zenn / Qiitaなどの魅力的なサービスがあります。

メリットは、他者が運用をしてくれるのでコンテンツ作成に集中できることや、サービス利用者間のつながりが広がりやすい点が挙げられます。

デメリットは、できることが限定されるので自由度が低いことが挙げられます。

2. ホスティングサービスやクラウドを利用する

2に関しては、おなじみのWordPressの他、VercelNetlifyの静的サイトホスティングなどがあります。

メリットは、がんばれば何でもできちゃう自由度の高さや、技術的な学びが得られることが挙げられます。

デメリットは、コンテンツ以外の開発や運用に時間をとられることが挙げられます。

私の選択

私はエンジニアなので趣味を兼ねて "2. ホスティングサービスやクラウドを利用する" を選びました。ブログやコンテンツ配信サービスも必要に応じて使いますが、自分のブログでは雑多なことを書たり、やりたいことを実装して自由に生きたいと思います!

多くの人は "1. ブログやコンテンツ配信サービスを利用する" のブログやコンテンツ配信サービスで、自分にあったものを選ぶのが良いと思います...!!

本ブログの技術スタックについて

フロントはNext.jsで、インフラはVercelでホスティングしています。 「インフラエンジニアなのにインフラしないの?」とツッコミが来そうですが、ソリューションアーキテクトでもあるので最適なものを柔軟に選択して楽していくマンです!!

Next.jsについて

Next.jsReactをベースにしたフロントエンドフレームワークです。

詳細は割愛しますが、SSR/SSG/ISRといったイケてるレンダリング方式をサポートしており、Webページの表示速度やSEO面での恩恵が得られます。Vercelという企業が開発している安心感があります。人気度もかなり高まっているようで、今後もかなり期待できそうです!

Vercelについて

私はAWSが大好きなのでAWS Amplifyも選択肢にありました。ですが、Next.jsを開発しているVercel自身がホスティングサービスを提供しておりNext.jsとの親和性が高いことや、料金面で個人のスモールスタート向きと判断してこちらを選択しました。

選定で重視したこと

私が重視したことは下記の点です。

  1. 開発と執筆が楽
  2. コストが安い
  3. パフォーマンスが高い

1に関しては、Next.jsが非常に良くできていているため、今の所何不自由なくサクサク開発できています。私はインフラエンジニアなのでフロント弱い方なのですが、かなり開発しやすいと感じました。執筆に関してはMarkdown(正確にはMDX)を使って書けるようにしているので手軽です。

2に関してもVercelの無料枠で何不自由なく使えそうです。Vercel様、ええんですか?ありがたや〜。もし制限かかるレベルになってきたら、課金かAWSへ移行をする予定です。

3に関してですが、Vercel様とSSGのおかげで、大満足のパフォーマンスの高さが出せています。以下はLighthouseで本ブログを計測した結果です。

Moskenes Ferry

おわりに

簡単ですが、本ブログの技術スタックについて紹介しました。技術についてもう一歩踏み込んだところまで書こうと思ったのですが、長くなりそうなので一旦やめておきます...!! 最後までお読み頂きありがとうございました。

Share