Mon Oct 25 2021

個人サイト(ここ)をBlitz.js化することに成功した。  

 

元々はNuxtで作った完全な静的サイトだったがv2を使っててたまにしか更新しない程度だったので老朽化してた。  

 

まぁ別にそれでもよかったんだけど最近所用でRailsに変わるフルスタックなWeb開発環境を探していて、blitz-js rails 倒し方のことを思い出し、Blitz.jsを試す良い機会ではと思い取り組み始めた。  

 

業務でTypeScriptを書いたり数年前にReact Nativeを使ってたことはあったが、最近のWebのフロントエンド(とりわけReact界隈の動向)には全く無知。  

 

にもかかわらずBlitz.js(&Next.js) + Prisma + Chakra UI with TypeScriptというほぼ全て未経験の技術スタックを採用したので立ち上がりがめちゃくちゃ大変だった。取り組み始めた最初の頃のツイート↓  

 

 

 

その辺の足掻きはBlitz.jsを触るに書いた。汚いので読みにくいかもしれないがそこはスクラップなので...。  

 

一番苦労したのはアプリをどこで動かすかというところ。結局Vercel(サイトホスティング+α) + PlanetScale(DB)を採用。PlanetScaleに関してはまだベータ版とのことだったけどサーバーレスでコネクションプール問題を回避できるバックエンド+ほぼ無料のサービスを探すとここくらいしかない。その辺についてはVercelからMySQL/PostgreSQLに接続したい場合にどういうアーキテクチャにするのが最適かにより詳しく書いてある。  

 

ISRを試してみたかったので記事詳細ページで試験運用してみた。が、よく考えるとこのサイトは自分しか更新しないのでSSG(今はSGと呼ぶらしいけど)にして日記追加時に再デプロイすりゃ良いじゃん...となり結局SSGを導入した。PlanetScaleはFirestoreのようにReadとWriteの数の料金が決まるので不要なリクエストはなければないだけコストを減らせる。無料枠で100million readと10million writeがあるので小規模サイトならSSRでも問題ないと思うし、日記追加時の再デプロイもなくせるじゃんと思ったがSSG使ってみたかったので。  

 

フロントエンドとバックエンドのコードが(見た感じ)セキュアにシームレスに扱える体験は良いしPrismaも良いので楽しみではある。総じて全体的にいい勉強にはなったが、とはいえBlitz.jsはドキュメントひとつとってもまだまだ荒削りな部分があったり採用してる企業が沢山あるわけでもなく、日本語情報もZennのスクラップに試行錯誤の爪痕が点在しているみたいな状況だからこれからだな〜という印象。  

 

かといってRails7以降のフロントエンドは楽しみではあるとはいえ、個人的にもう型の支援がない開発環境でコードを書くのがキツイ体になってしまったから戻るのはな〜という。  

 

個人開発ならBlitz.jsで一気通貫でやってしまうのは良い、が業務でチームでWEB開発するなら黙ってフロントエンドとバックエンド(BFF含め)を別々に作りますわな...というのが現状の気持ち。