TL;DR
- ブログを書くメリットはアウトプット習慣の身につくことや技術整理、転職活動での有利さ、広告収入の可能性があること。
- HeadlessCMS&AstroはWordPressより高パフォーマンスで、Core Web Vitalsの改善が容易。画像最適化や必要なJavaScriptのみの送信で90点以上のスコアが簡単に達成できる。
- コスパ最強で無料のHeadlessCMSを使えばブログをコストなしで始められる。多くのホスティングサービスから選択可能で手軽に始められる
- 学習コストが低く、JavaScript(TypeScript)統一で開発できるのでWordPressの独自記法の学習が不要。
- モダンなフレームワークを使って宣言的なUIを構築できる。フレームワークを混在させることも可能で、スタイリングも充実している。
- ページネーションやSEO対策など必須の機能をビルトインでサポート
- テストツールも充実している。
HeadlessCMSならフロントエンドの技術だけを移行も容易 - 高速で魅力的なブログが作れるので、ぜひHeadlessCMS&Astroに挑戦してみよう！
そもそもなんでブログとかいうめんどくさいことやるん？
アウトプットの習慣が身につくし、業務で使った技術を整理できる。なにより、以外とエンジニアの大半は業務外でアウトプットしたりしてないのでやるだけで差がつくし、転職活動の際にも有利になる。さらには広告収入で不労所得を得ることができる。（額は頑張り次第なので知らんけど）
HeadlessCMS&AstroがWordPressより優れている点
高パフォーマンスなサイトを容易に構築できる
WordPressではとにかくCore Web Vitalsの改善が面倒くさい。テーマを1から作成した場合なんかは特にひどい。平気で40点とかのスコアが出る。さらに、スコア改善のためによくわからないプラグインを入れまくらないといけないし、入れたプラグインの影響で他のスコアに影響が出たりする。（もちろんセキュリティ面の懸念もあるよね）
これらは大抵の場合、「画像とJavaScriptのサイズ」がボトルネックになっているが、Astroで公式Documentのチュートリアル通り進めれば、基本的には勝手に90点以上のスコアになるはずだ。（これがすごい）
画像に関しては、Astroではインテグレーションにより画像の最適化がわずかコード1行で実現できる。
さらに、JavaScriptについてはAstroの設計思想が「必要な時に必要なJavaScriptしかブラウザに送信しない」（アイランドアーキテクチャ）であり、開発時にハイドレーションしたい箇所(インタラクティブな処理を行いたい箇所)を指定できるので、最適化を容易に行うことができる。（ブラウザに送信するJavaScript量を最小限まで減らすことができる）
余談だが、Astroでのプリレンダリングの方法としては、デフォルトでSSGとなっているが、設定でSSRとすることも可能
コスパ最強
今時レンタルサーバーを借りてそこにWordPressをインストールして、、みたいなことは古いです。何時代ですか？フロントエンドはAstroで用意して、バックエンドはマークダウンファイルで用意してリポジトリに含めるか、無料のHeadlessCMSを用意すればコストなしでブログを始めることができます。
また、Astroがサポートしているホスティングサービスの数が豊富でNetlify、Vercel、AWS、Github Pagesなど20個くらいのサービスから選択できる。無料で運用できるものも多く、サーバーレスなのでサーバーの環境構築の手間なども省ける
ちなみに、CMSサービスを使わずにAstro単体でもブログを作成可能だ。markdownファイルでブログ記事を作成し、src/contentに配置するとそのファイル名がルーティングパスとなり、その中身がコンテンツとなる。さらにastro2.0からは、markdownファイルを使用した構築においてCollection Apiを使用して記事の取得やソート、フィルターが容易に行うことができるようになっている。Astro公式としては、microCmsなどの外部サービスを使うやり方よりもこちらの方法を推奨しているそう。
学習コストが低い
WordPressではテーマをスクラッチで作成する場合、JavaScript、PHP、WordPressの記法をそれぞれ用いる必要があるため、学習コストが高い（個別の技術自体は難しくはないけどね。）
Astroを用いれば、開発言語をJavaScript(TypeScript)に統一できる（サーバーとクライアントを常に同じ言語で開発できる）ので、学習コストも低いしWordPressの独自記法を覚える手間も省ける。
開発体験が素晴らしい
ReactやVue、SvelteなどのモダンなJavaScriptフレームワークを使用でき、これ等を扱うことができるエンジニアはモジュールシステムの技術をAstroで使用して宣言的なUIを構築できる（ReactとかVueとか意味わからんという方でも、従来のscriptタグを使った記法で命令的に記述することもできる。）
さらに、これらのモダンUIフレームワークを同じアプリケーション上に混在させることもできる。（すでに別のサイトAで作成したReactコンポーネントとBのサイトで作成したVueのコンポーネントを一緒に使うとか）
なお、これらのフレームワークを使わなくてもAstroにも組み込みでコンポーネント機能があり、JSXにかなり近い記法でコンポーネント指向で実装できる。もちろんTypeScriptもサポートしている。
Astroコンポーネント上ではクライアントサイドとサーバーサイドで実行するJavaScriptを記述する箇所が完全に分かれているので、それぞれを区別して実装しやすい点もエンジニア視点ではあるが嬉しい。
スタイリングに関しても充実しており、TailwindやSass、インラインスタイル(style属性)も可能だし、VueのSFCのようにAstroコンポーネント内にstyleタグを記述し、スコープを指定することも可能
ローカル開発環境関しても、Astroのビルドツールがviteなのでローカルでの開発がサクサク。
スクラッチでの実装をサポートする機能が豊富
ページネーション、RSS、Sitemap生成、SEO対策などブログ開発に必須の機能をビルトインでサポートしている。
例)サイトマップ生成
さらに、アイコンやコードのシンタックスハイライトなどの高度な機能もサポートしており、簡単にアプリケーションに導入できる。
また、完全に一から作らなくても、Astroにもテーマが存在する(有償・無償どちらもある)
モダンなテストツールをサポートしている
AstroはVitestやPlaywrightなどのモダンなテストツールをサポートしており、保守性の高いWebサイトの構築を補助してくれる。（たかがWebサイトでもロジックはあるよね。単体テストと簡単な全体のE2Eは書いておこう）
フロントエンドの刷新が容易
バックエンドとフロントエンドが分離されているHeadlessCMSなら、API呼び出しなのでフロントエンドの技術だけを移行することも容易。言わずもがなWordPress環境だと管理画面とフロントエンドが合体しているので移行が大変。というかかなり厳しい(一応、WordPressにもヘッドレス化する機能はあるらしい)
まとめ
技術ブログをWordPressから移行した話をしました。HeadlessCMS&Astro環境なら高速なサイトを簡単に作れるし、コストもかからない。開発体験も最高なのでぜひ参考にしてブログを作成してみてください。