「ミスりがち」なバイブコーディング、成功に必須のAIエージェント「強化策3選」とは(2/4)

「土台」には何を選ぶべきか

　まず1つ目の「土台となる技術の選択」とは、どんなソフトウェア技術を使って目的のアプリやサービスを作るのか、ということだ。Webサービスなら以下がバイブコーディングの定番となっている。


　これらはプログラム開発を効率化してくれる便利な仕組みの組みあわせで「技術スタック」とも言う。TypeScript ＋ Next.js ＋ Vercel + Superbase の技術スタックは広く普及して先例が膨大にあるので、生成AIも学習済みだ。バイブコーディングの例題に出るToDo管理システムや売り上げ管理ダッシュボードなど、シンプルなシステムなら問題ない。

　しかし、それより複雑なシステムは難しい。ある場所を修正すると、ほかの場所も書き換えてしまい、動いていた部分が動かなくなるなど問題が頻発する。オリジナリティのある複雑なシステムをゼロから作ろうとすると、生成AIには荷が重い。システム全体の土台や太い幹にあたる部分を作るのには力不足なのだ。これはClaudeを提供しているAnthropicのYouTube公式動画「 Vibe coding in prod | Code w/ Claude」でも言及されている。

複雑なシステムでも「失敗しにくい」手法とは

　では、どうすればいいのか？　実は太い幹の部分を作らず済ませる方法がある。フレームワークを使うのだ。Next.jsもフレームワークだが、基本の骨組みしか提供しない。筋肉や内臓にあたる詳細な機能を提供するフレームワークやライブラリが多数存在するので、それらを利用する。たとえば筆者は以下を常用している。

　「Payload CMS」はNext.js上で動作するアプリケーションフレームワークだ。ユーザー認証やコンテンツ管理などの仕組みが一通り用意されている。

　「drizzle」はデータベース処理の複雑性をシンプルにする「ORM」と呼ばれる種類のライブラリだ。Superbaseなど各種データベースを安全に利用できる。

　「Shadcn/ui」は美しいユーザーインターフェースを簡単に構築できる。Web開発で人気の高いTailwind CSSというデザインフレームワークの上に構築されている。


　こういった技術をシステムの「幹」として採用することで、AIエージェントは得意とする個別機能の開発に集中して、その実力を発揮しやすくなる。 【次ページ】「専門特化型」のAIエージェントとは