年始に大規模言語モデルを使ってフロントエンド・バックエンドプロジェクトを完成させようとしたことがあります。詳細は「AIを使ってフロントエンド・バックエンドプロジェクトを一つ完成させた記録」をご覧ください。 当時の感想としては、使いにくいというものでした。他の言語の既存コードが参考としてあっても、再現は難しく、コードの記述には依然として人間が大きく関与する必要がありました（特にコンパイル問題やランタイムバグに対して）。
しかし今年はエージェントの急速な進歩により Vibe Coding も急速に発展し、私自身も Next.js フレームワークに徐々に慣れてきたことで、この作業もより簡単になったようです。
圧縮分野の研究者として、新しい RD 曲線図を描くたびに過去の実験データから従来手法の実験結果を探し出し、matplotlib コードを書いて描画しなければならないことにずっと悩まされてきました。ここ数日、ついに我慢できなくなり、関連する実験データを管理し可視化するアプリ——RD Curve AIを作ることにしました。皆さんもぜひ試用して、改善のアドバイスをいただければ幸いです。
图表
BD-Rate
数据导入
评价指标
今回の Vibe Coding は実際わずか1日で完成しました。個人的にはとても順調だったと思います。大まかな流れは以下の通りです：
- まず詳しくプロンプトを記述し、使用する技術スタックやコンポーネントなどの内容を説明します。実はあまり整理する必要はなく、項目が十分に多く、頭の中のニーズを十分にカバーできれば問題ありません。ここでは私の例も示します：
CodeBlock Loading...
- このプロンプト以外に、以前書いたパスワード暗号化や better-auth の設定も入力しました。以前の経験から、この部分は AI が何度も反復しないと私の期待に合うコードを出力できないからです。
- プロジェクト全体のプロンプトを書きます。これは AI に任せられますが、内容を少し調整する必要があります。ここでは私が調整したバージョンも示します：
CodeBlock Loading...
- しばらくすると AI がフレームワーク全体を構築してくれます。その後、エディタが表示するエラーメッセージに従って、一つずつ AI に解決させる必要があります。
- プロジェクトが正常に動作するようになったら、機能やフロントエンドページを徐々に調整します。この部分が最も時間がかかる段階です。例えば、私は途中で BD-Rate 計算機能を追加することを思いつきました。ここで繰り返し反復することで、最終的に望むプロジェクトが得られるでしょう。
最後に説明したいのは、Vibe Coding でも初心者が比較的複雑なシステムタスクを完成させるのを助けることはできないということです。人がその中で AI が書いたコードを完全に理解する必要はありませんが、システムフレームワークについては比較的包括的に把握している必要があります。ここで一つの暴論を引用します：「AIは（ほぼ）あなたができないタスクを完成させることはできない」。私の Next.js フレームワークへの理解は、この1年間の独学と AI の助けを借りていくつかの小さなプロジェクトを完成させたり、いくつかのオープンソースプロジェクトを改良したりする中で徐々に成長してきたものです。これらの経験が蓄積されてこそ、AI は効率を向上させる優れたツールになります。