Nuxt.js から Next.js へ ── フロントエンド技術リプレイスにおけるハーネスエンジニアリングと理解負債

はじめに 株式会社 mediba でフロントエンドエンジニアをしている中畑です。 弊社では Nuxt.js から Next.js への技術リプレイスプロジェクトが進行中です。この記事では、 Claude Code を活用した技術リプレイスの現状と課題をお伝えします。 前提 AIコーディングツールは Claude Code を使用しています。モデルは主に Sonnet 5 を利用しています。 プロジェクト概要 システム概要 toC 向けの Web アプリケーションシステムです。 システム構成のイメージ図としては以下になります（実際には他にも複数の対向システムが 存在しますが省略） フロントエンドは Nuxt.js で開発されています。こちらを Next.js にリプレイスします。 現行 移行後

[hase0510]

Vue、Reactという単語がまったく出てこないところに理解負債の存在を感じる

[ryamamoto]

“イメージ図としては以下になります（実際には他にも複数の対向システムが 存在しますが省略）”

[nilab]

「実装は Claude が生成」「開発者が仕様を深く理解する工程がなくなっています」「移植精度が高すぎて技術負債もそのまま移植される」「Claude に HTML や mermaid で図解してもらう」

[toaruR]

最近わいはAIに一々教えてもらう(ノ∀`)

[pochi-taro00]

なんでSonnet? excelで画面仕様書?

[nguyen-oi]

AIにコード書かせまくると開発者の理解負債が爆発するの分かりみが深すぎる