diary

I like Hatena Star with a text selection.

2025-08-23

elin.pocke.me

ここ最近ずっと作っていたWebアプリを公開した。Elinのキャラクタービューワー。

基本的にはゲームのキャラデータのCSVに色をつけるだけのアプリ。ただ一部CSVにはデータがなくてコード中にハードコードされているデータがあったので、そこはコードを正規表現で雑にパースしてきてJSONに書き出して読み込む、みたいなことをしている(フィートが持っている耐性がそれ)。

キャラ情報を調べるときにはCSVファイルがインポートされたスプレッドシートを眺めていたのだけど、キャラが持っているアビリティとかを脳内JOINして眺める必要があったりしてなかなかだるかったので、アプリケーションの形にした。

Claude Codeをフル活用して実装していた。わりといい感じに実装してくれつつ、まあまあ手直しが必要でもあった。時々TDDの仮実装みたいなコードをそのまま「できました!」とか言って出してくるのがあったのは厳しかった。

技術要素は、Next.js, MUI, Cloudfrare Pagesあたりを使っている。どれもまともに使うのは自分にとって初めて。全ページをSSGして完全に静的なアプリとしてホスティングしている。 コーディングはほとんどClaudeがやったから勉強になった感はあまりない。

CSVをtextとしてimportして、それをアプリ上でオブジェクトの配列に直して使っている。だいぶ開発が進んでから、CSVをそのまま使うのではなく、一旦CSVをsqlite3とかにインポートした上でそれをアプリケーションからは使うようにしたほうが良かったかもしれないと思った。 そのほうがSQLという仕組みに乗っかれることと、各リソース間のリレーションの取得がごちゃごちゃしてしまっているのを直せるかなと思っている。 機能拡張を入れる前にリファクタとしてやってしまっても良いかもしれない。

まだいくらか追加したい機能があるので、しばらくはこのプロジェクトをもう少し進めたい。

4日ぐらいかけて作っていたのだけど、その間Elinのプレイはほとんどやっていなかった。時々挙動を確認するために立ち上げるぐらい。Webアプリを作るゲームが楽しくて……