負債まみれのレガシーフロントエンド画面を Vue.js でリプレイスした話 by とよへい

とある Rails のテンプレート + CoffeeScript で構築された画面を、 Vue.js でリプレイスしました。
その際の知見を、具体的な工夫や悩んだポイント、実際の遭遇した技術的負債の話を交えて共有できればと思います。
本セッションのキーワードは以下になります。

• Vue3 の script setup + TypeScript に始まる開発体験の良さ
• Container Component、Layout Component などの開発プラクティス
• Storybook、 StoryShots(VRT) によるフロントエンド DX
• あるべき姿に至るまでの長い道のりと取捨選択
• 命令的 UI から宣言的 UI へのパラダイムの変更
• Ajax のリクエストを送ると、json にシリアライズされた html が帰ってくる API のエンドポイント
• 忍耐力