ステータスページをつくった
from 20210116 #0116
ステータスページをつくった
https://st.kbys.tk
ツイッター離れ(n回目)に書いたまま、Twitter から離れ続けている
Twitter との付き合い方を変えたから1年半くらい
muute は面白く、内省は捗るのだけどカテゴリふりがダルくて腰が重くなりがちなので、もうちょいインスタントなものがほしかった
機能はすごく絞って、pplog や fleet みたいな感じで最新1件が表示されるだけにした
https://gyazo.com/e4b96e36db27ba433c70e3fd1de9243c
実装: https://github.com/kbystk/st
使ってる技術は
Next.js + Tailwind
Vercel + Supabase
Sveltekit が気になってたので、そっちでやろうとしたがまだ beta でしかもクローズドソースだったので先送りした
Vercel 全乗り構成をやってみたくて(now 以来ご無沙汰だった)Next にした
あと ISR も試したかった
Vercel は随分と洗練されていて、GitHub と integration 設定したら何も設定しなくても全てがデプロイされた
当然のように PR 毎に環境が作られたりもする
Analytics はなんか設定いるんかなとおもったけど、GUI でポチッとすると勝手に測定が始まって便利
Real Experience Score という独自のスコアリングだが、ベースは Web Vitals っぽい
https://gyazo.com/5ecd4dc8c7a652df82230a0f2c7552ba
CSR で返してた時は LCP が悪すぎてスコアが低かったが、ISR に変えたら抜群によくなった
Supabase も前から試したいとおもっていた
素の Postgres としか使ってないが、Firebase の Realtime Database のように subscription 方式でデータを読み出せたり、Auth のようにユーザの認証もできる、オープンソース Firebase を目指してるんだろうか
こちらもコンソールが非常に使いやすくて、特段苦労しなかった
ORM なんか入れようかと思ったが、素の SQL を書くだけにした(SQLインジェクションがある気がするが、一旦忘れる...)
コネクションが増えたりしないかな〜と心配していたが、API 毎に lambda function が分かれているぶんの2つのコネクションだけでいけてるっぽい
前に仕事で ISR やろうとしてめっちゃ苦労したのでだいたいの勘所はわかっていた
[[...slug]].jsx とダイナミックルーティングをして、gSP x2 を設定するのがミソ
一応、revalidate が走ってるか確認するために generate されたときにタイムスタンプを送るようにした(想定通り動いてる気がする)
Tailwind も仕事で触ってるので可もなく不可もなく