以前「Tepbyte.dev の技術構成」とか題して工夫してますぜという話をしてましたが、Astro に移行しちゃいました。
すべてを自作するのは楽しいんですが大変です、みなさんはやめましょう。
なんで
移行に至った理由は上記の通り、自作の部分が多かったことでいろいろ面倒があったからです。
ただ投稿したいだけなのに最終的にバグ修正してるというのはいかんなと。
飽き性なのでなんとなーく新しい構成にしてみたかったというのもあります。
このサイトはコンテンツ主体で静的なので Zero JavaScript がいいよねとか、Markdown コンテンツの処理に強いとか、その辺で Astro を採用してます。
どうやって
Markdown の処理は Astro に任せられますし、既存の React コンポーネントはそのまま使えるので簡単です。
pnpm create astro して、ちょっとファイル配置を変えたりコードを書いたりすれば、ベースは出来上がります。
次に、既存の機能を保つためにバックエンド側にあった機能を移植してきます。
Astro コンポーネントはクライアント側でレンダリングされることはなく全てビルド時に処理されるので、そこで諸々やってしまえば良いです。
クライアント側で動いて欲しいコンポーネントについては、client:load とか渡すことでハイドレーションしてくれます。
ただ React コンポーネントだとクソでか react-dom が読み込まれることになり Zero JavaScript の恩恵が薄くなるので、Solid に置き換えてみました。
どうなった
既存の機能を失わずに移行完了しました、良かった。
実装サボっていた画像の埋め込みやコードハイライトも勝手に対応され、pnpm run dev すればすぐにプレビューもできます。
これまでコンテンツはサーバーに取りに行ってましたが、現在はローカルにあるので、プレビューもビルドも高速です。
いい感じ 👌