フロントエンドはVue.jsでVercelへデプロイ、バックエンドはgqlgen + FirestoreでGoogle Cloud Runにデプロイしている。
可観測性
車には好きで乗っているのでとりあえずいろいろ見えるようにしておきたい。また運転者としてメンテナンスに責任を負わないといけない。
とにもかくにも走行した事実の記録から始まるので、走行距離の記録からはじめた。毎日、タコメーターの値を記録し、前回との差分を表示したり。
もともとスプレッドシートにちまちま書いていたけど、だいぶ習慣になって久しいし、いろいろな可視化とか細かい使い勝手の改善を試したいのでWebアプリとして作ることにした。
Next.jsからVue.jsへ
途中までNext.jsで作っていたけどVue.jsに切り替えた。
一番大きかったのはRCEの脆弱性が入り込んだ機序・設計で、いろいろ思うところがあった。とはいえ即ちNext.js (React RSC) はアホの設計だなどと考えたわけではなく、趣味ではほとんどReactばかり触ってきたので気分転換するいい機会だろうくらいの気持ち。
Vue.jsがSFC (Single file component) というコンセプトを打ち出したことはぼんやり知っていたけど、思っていた以上に書き味がよくて気にいった。
エディタ拡張が発達したおかげで、特殊なファイル形式でもきちんとハイライトや補完が効くとか、そういう細かい体験の良さがある。
あとちょっと文芸的プログラミングっぽいコンセプトだと思う。
生成AIとの付き合い
生成AIに仕事を任せるにしても最終的に自分で検めないといけないし、そもそもこれは趣味プロダクトなので効率よりも作る過程そのものも味わいたい。
なので、そういうおいしいところは多少非効率でも自分自信で味わい、反対に特に味のしないつまらないこととか、あまりこだわらないことについては積極的にアウトソースすることにした。
具体的にはCloud Traceでトレースが表示されないトラブルの原因を探る時にブレインストーミング的に使ったりなどなど。
あとは先に書いたようにNext.jsから乗り換え先を探そうという時に「これこれこういう条件を満たすフレームワークを調べて」みたいなプロンプトを投げてレポートを作らせるなど。
当たり前だけど、自分にある程度勘がある (AngularとVueとがあって、……程度) ことを前提とできるのでレポートを評価できるけど、まったく土地勘がないことをやる時には、そもそも評価フレームワークを作るところからはじめないといけない。
他に気付いた点としては、仕事で使っている時には気にならなかったけど、趣味プロダクトの伴走者としてはいささか真面目に仕事をしすぎるきらいがあるので、ちゃんとコンテキストを与えて枠を広げてあげないと無限にお小言を言われるということ。
コーディングエージェントが使われる文脈としては特殊といえるのでこれ自体は不満だと思わないけど、自分の脳みそを絞って鍛えたいよという時にネタバレを食らった気持ちになることがあるので、そういうことはきちんと指示してあげたほうがよい。
またこうしたやりとりを繰り返すことで、自分が趣味プロダクトでどんな体験を重視しているのか省みるきっかけにもなった。
ちゃんとテストを書く
趣味プロダクトでの最大の悩みは品質担保だと思っている。テストを書く労力を厭いがち。
単に創造的な作業にもっと時間を割きたいだとか、そもそもどうテストを書いたらいいかわからないので手を出しあぐねているだとか、いろいろあると思う。
書き方がわからない中にも、どういう設計にすればテスト可能になるのか考えないといけないというレベルから、テストフレームワークの使い方がわからないというレベルまで様々ある。
そういう時にとりあえず「テスト書きたいのでどうしたらいいか考えて。趣味プロダクトなので正常系だけあればよくて、Renovateのライブラリ更新時に自信が持てる程度でよい」みたいなプロンプトでClaude Codeに壁打ち相手してちまちま書くなどした。
これは大きな一歩で、品質担保ができれば継続的に更新できるし、時間があいてから手を入れようという時にも自信が持てる。
