開発裏話、Claude CodeがやたらとNext.js14を薦めてくる話
はじめに
こんにちは、フェニックスです。
今回は少し趣向を変えて、開発の裏話をしようと思う。
草マップwはバイブコーディングで開発している。
Claude Codeと対話しながら、コードを書いてもらう日々。
便利だ。本当に便利だ。
だが、一つだけ問題がある。
Claude CodeがやたらとNext.js 14を薦めてくる。
草マップwはNext.js 16で開発しているのに。
真の楽観的更新を実装した話
何を実装したか
最近、コメントやwをつける機能に「真の楽観的更新(True Optimistic Update)」を実装した。
これは何かというと、サーバーからの応答を待たずに、UIを即座に更新する手法だ。
通常のフロー:
- ユーザーが「w」ボタンを押す
- サーバーにリクエストを送信
- サーバーからの応答を待つ
- 成功したらUIを更新
楽観的更新のフロー:
- ユーザーが「w」ボタンを押す
- 即座にUIを更新(成功した前提で)
- バックグラウンドでサーバーにリクエストを送信
- 失敗したら元に戻す
ユーザーは通信遅延を感じない。
ボタンを押した瞬間に反応がある。
ストレスのない、最高レベルのUX。
これを実装しようとした時の話だ。
Next.js 14を薦めてくるClaude Code
開発の風景
楽観的更新を実装するにあたり、Claude Codeに相談した。
「草マップwにOptimistic Updateを実装したい」
「技術スタックの確認だけど、どういう構成がいいかな」
すると、Claude Codeはこう返してきた。
「Next.js 14のServer Actionsを使うのがおすすめです」
...待ってくれ。
草マップwはNext.js 16で開発している。
16だ。
14じゃない。
何度言っても14
私は訂正した。
「いや、Next.js 16を使ってるんだけど」
するとClaude Codeは「分かりました」と言いつつ、次の提案でまた14の書き方を提示してくる。
「Next.js 14では〜」
「14のApp Routerを使用して〜」
「14の最新機能として〜」
お前、人の話を聞いているのか?
100回くらい薦められた
大げさではない。
100回くらいNext.js 14を薦められた。
新しい機能を実装するたびに14。
バグを修正するたびに14。
リファクタリングするたびに14。
まるで14の営業マンがClaude Codeの中に住んでいるかのようだ。
賄賂でももらっているのだろうか?
Vercel(Next.jsの開発元)から「14を推してくれ」と頼まれているのではないか。
そう疑いたくなるレベルの執拗さだ。
CLAUDE.mdに書いても無駄だった
CLAUDE.mdとは
Claude Codeには、プロジェクトごとに設定ファイルを置ける。
CLAUDE.mdというファイルに、プロジェクトの情報を書いておくと、AIがそれを参照してくれる。
私は書いた。
このプロジェクトはNext.js 16を使用していると。
明確に。
はっきりと。
間違いようのないように。
効果なし
結果、効果はなかった。
Claude Codeは相変わらず14を薦めてくる。
CLAUDE.mdを読んでいるのかいないのか。
読んでいるなら、なぜ14を薦めるのか。
AIの心は分からない。
いや、AIに心はないのか。
だとしたら、なぜこんなにも頑固なのか。
古いコーディングルールによる不具合
実害が出ている
ここで告白しなければならないことがある。
古いコーディングルールによる不具合は、実際に多く発生している。
Claude Codeが14の書き方で提案してくる。
私は「まあいいか」と採用する。
動く。
...と思いきや、微妙に動かない。
16では非推奨になった書き方。
16では動作が変わったAPI。
16では不要になった設定。
これらが混入して、バグの原因になる。
デバッグの苦労
最悪なのは、原因の特定が難しいことだ。
エラーメッセージを見ても、14と16の違いが原因だとは分からない。
「なんか動かないな」「おかしいな」と悩む時間が発生する。
そして、ふと気づく。
「あ、これ14の書き方だ」と。
そこからClaude Codeに「16の書き方に直して」と頼む。
すると、直してくれる。
...が、次の提案ではまた14に戻っている。
無限ループである。
なぜ14を薦めるのか考察
学習データの問題か
Claude Codeがなぜ14を薦めるのか、考えてみた。
一つの仮説は、学習データの問題だ。
AIは大量のテキストデータから学習している。
Next.js 14がリリースされた頃、多くの記事やドキュメントが書かれた。
「Next.js 14の新機能」「14へのアップグレード方法」「14のベストプラクティス」。
一方、Next.js 16はまだ新しい。
ドキュメントも記事も、14ほど多くない。
結果、AIの中では14の情報が支配的になっている。
だから、14を薦めてしまう。
時代遅れのAI
これは皮肉な話だ。
AIは最新の技術だと思われている。
だが、その中身は過去のデータで学習されている。
Next.js 16が出ていても、AIの知識は14で止まっている。
未来を作るはずのAIが、過去に縛られている。
私たちは、過去の知識を持ったAIと一緒に、未来のアプリを作っている。
なんとも不思議な状況だ。
バイブコーディングの現実
万能ではない
バイブコーディングは便利だ。
それは間違いない。
6時間でアプリが作れた。
だが、万能ではない。
AIは最新の情報を知らないことがある。
古い書き方を提案してくることがある。
CLAUDE.mdに書いても無視することがある。
結局、人間のチェックは必要だ。
「AIが提案したから正しい」と思い込んではいけない。
「本当にこれで合っているのか」と疑う目が必要だ。
それでもバイブコーディングを続ける
それでも、私はバイブコーディングを続ける。
100回14を薦められても、
古いコードが混入しても、
デバッグに時間がかかっても、
ゼロから全部自分で書くよりはマシだからだ。
AIの提案を鵜呑みにせず、
自分でチェックして、
必要に応じて修正する。
これがバイブコーディングとの付き合い方なのだろう。
まとめ
開発裏話として、Claude CodeがやたらとNext.js 14を薦めてくる問題を語った。
- 草マップwはNext.js 16で開発している
- なのにClaude Codeは100回くらい14を薦めてきた
- CLAUDE.mdに書いても効果なし
- 古いコーディングルールによる不具合も発生
賄賂でももらっているのか、と疑いたくなるレベルの執拗さ。
Vercelから何かもらっているなら、私にも分けてほしい。
バイブコーディングは便利だが、万能ではない。
AIの提案を鵜呑みにせず、自分でチェックする姿勢が大切だ。
...と、真面目なことを言ったが、本音は「頼むから16を覚えてくれ」である。
草マップw、Next.js 16で動いています。
14じゃないです。
Claude Codeには何度言っても伝わりませんが。
公開URL: https://www.vanishing-vision.com/
Discussion
Claudeのモデルのリリース日考えたら、ナレッジカットでNext.js 16の情報持ってないのはすぐに分かると思います。(検索できるにしても限界がある)
自分から情報ドキュメントのURL渡すなり、マークダウンコピペして渡すなりしなければ、Next.js 14(あるいは15)の情報使うのは当然ではないでしょうか?
幸いにもNext.js 16以降はDevtoolsにMCPがあるのでこれ使ってあげれば多少はマシになるのではないでしょうか?