コーディング・エージェント・テンプレート：複数のAIモデルと安全なサンドボックスを統合し、自動プログラミング・インテリジェンスを構築する

Coding Agent TemplateはVercel Labsによって開発されたオープンソースプロジェクトで、コーディング作業を自動化できるAIインテリジェンスのプラットフォームを構築するための基本テンプレートを提供する。 このテンプレートは、Claude CodeやOpenAI Codexなどの様々なAIコーディングツールを統合し、Vercelのспециализированныеサービスを利用して、コードが安全な環境で実行されることを保証します。

このプロジェクトの最も中心的な部分は、Vercel Sandbox技術の使用である。 Vercel Sandboxは、AIが生成したコードを安全な環境で実行できる一時的で隔離されたランタイム環境を構築し、ローカルや本番環境のファイルを直接操作することに伴うリスクを回避する。 同時に、異なるAIモデルのAPIリクエストの管理とルーティングを一元化できるゲートウェイであるVercel AI Gatewayを統合し、開発者が様々なAIサービスを簡単に切り替え、管理できるようにする。

プラットフォーム全体のフロントエンド・インターフェースは、シンプルで直感的なデザインのNext.jsを使って構築されています。ユーザーがタスクを送信すると、インターフェイス上でタスクの進捗状況やログをリアルタイムで確認できます。タスクデータはPostgreSQLデータベースに保存され、タスクの永続的な管理が可能です。 さらに、このテンプレートにはGit機能も統合されており、AIがコーディングタスクを完了すると、自動的に新しいコードブランチを作成し、変更をコミットするため、コードレビューとマージプロセスが簡素化されます。

機能一覧

• 複数のAI知能をサポートAnthropicのClaude Code、OpenAIのCodex CLI、Cursor CLI、opencodeなどです。
• セキュアなサンドボックス環境Vercel Sandboxを使用して、各タスクのコードを実行および修正するために、独立したセキュアなリモートクラウド環境を作成します。この仕組みは、信頼できないコードを効果的に隔離し、ホストアプリケーションへの影響や機密データの漏えいを防ぎます。
• 統合AIゲートウェイVercel AI Gatewayを内蔵し、異なるAIモデルへのリクエスト、ルーティング、モデル間の観察を一元管理。
• タスク管理とリアルタイム更新視覚的なユーザーインターフェイスを提供し、ユーザーはコーディングタスクを作成し、リアルタイムでログを更新しながら実行状況を追跡することができます。
• データ永続ストレージユーザーのタスクやそのステータスなどの情報は、Neon Postgresデータベースに保存され、データの永続性とトレーサビリティを保証します。
• Gitインテグレーション・オートメーションスマートボディはコード修正が完了すると、指定したコードリポジトリに自動的に新しいブランチを作成し、コードをコミットします。
• 最新技術スタックフロントエンドのインターフェイスは、アプリケーションのパフォーマンスと応答性を確保するためにNext.js 15とReact 19を使って構築され、Tailwind CSSを使ってスタイリングされました。

ヘルプの使用

以下は、このテンプレートのインストール方法と使用方法の詳細です。

環境準備

始める前にgit歌で応えるpnpm.また、以下のアカウントと認証情報を準備する必要がある：

• PostgreSQLデータベース接続アドレス（Neon、Supabase、その他のPostgreSQLプロバイダなど）。
• アンソロピック APIキー（クロードモデル用）。
• GitHub Personal Access Token を取得し、コードリポジトリへの読み書き権限を付与します。
• Vercelアカウントを取得し、チームID、プロジェクトID、APIトークンを取得します。

設置プロセス

1. クローン・コード・リポジトリ
   まず、ターミナルを開きgitコマンドを使って、プロジェクトのコードをGitHubからローカル・コンピューターにクローンする。

   git clone https://github.com/vercel-labs/coding-agent-template.git
   

   次に、プロジェクトのあるディレクトリに移動する：

   cd coding-agent-template
   

2. プロジェクトの依存関係をインストールする
   このプロジェクトではpnpmをパッケージ・マネージャーとして使用する。プロジェクトのルート・ディレクトリで以下のコマンドを実行し、必要な依存ライブラリをすべてインストールする。

   pnpm install
   

3. 環境変数の設定
   これが最も重要なステップだ。プロジェクトが正しく機能するためには、複数のAPIキーと設定情報を読み込む必要がある。テンプレート・ファイル.env.exampleコピーを作成し、名前を変更する.env.local.

   cp .env.example .env.local
   

   次に、テキストエディタで.env.localファイルに、あなた自身のコンフィギュレーション情報を記入してください。

   # 必需的环境变量
   POSTGRES_URL="你的PostgreSQL数据库连接字符串"
   ANTHROPIC_API_KEY="你的Anthropic API密钥"
   GITHUB_TOKEN="你的GitHub个人访问令牌"
   VERCEL_TEAM_ID="你的Vercel团队ID"
   VERCEL_PROJECT_ID="你的Vercel项目ID"
   VERCEL_TOKEN="你的Vercel API令牌"
   # 可选的环境变量（如果需要使用其他AI智能体）
   CURSOR_API_KEY="你的Cursor API密钥"
   OPENAI_API_KEY="你的OpenAI API密钥"
   NPM_TOKEN="你的NPM令牌（用于私有NPM包）"
   

4. データベースのセットアップ
   データベースの接続アドレスを設定したら、データベースのテーブル構造を初期化する必要があります。このプロジェクトではDrizzle ORMを使用してデータベースを管理します。以下のコマンドを実行してマイグレーションファイルを生成し、データベースに適用します。

   # 生成迁移文件
   pnpm db:generate
   # 将表结构同步到数据库
   pnpm db:push
   

5. 開発サーバーの起動
   以上の手順がすべて完了したら、以下のコマンドを実行してローカル開発サーバーを起動する。

   pnpm dev
   

   起動に成功すると、ターミナルにアプリケーションが起動していることが表示されます。この時点で http://localhost:3000 プラットフォームにアクセスし、利用することができる。

仕組み

1. タスクの作成アプリのメイン画面に入力欄があります。まず、AIに操作させたいGitHubのコードリポジトリのURLを入力します。
2. 要件について説明する:: 以下のテキストボックスに、AIに実行してもらいたい具体的なコーディング作業を自然言語で詳しく記述してください。例えば、「ログインボタンを追加し、クリックされたときにジャンプするロジックを実装するのを手伝ってください」、または、「ログインボタンをクリックしたときにジャンプするロジックを実装するのを手伝ってください。utils.jsそのファイルの並べ替えのバグ」。
3. 進捗状況の監視タスクを送信すると、アプリケーション・インターフェースにタスクの実行ログがリアルタイムで表示されます。AIインテリジェンスが要件を分析し、ファイルを探し、コードを修正し、コードを送信するプロセス全体を見ることができます。
4. レビュー結果タスクが完了すると、AI は自動的に GitHub リポジトリに新しいブランチを作成し、すべてのコード変更をそのブランチにコミットします。あなたは GitHub リポジトリにアクセスしてこの新しいブランチを見つけ、同僚のコードをレビューするのと同じように AI の変更をレビューすることができます。
5. 管理業務: アプリのサイドバーには、過去のタスクとそのステータス（進行中、完了、失敗など）の一覧が表示され、管理やトレーサビリティが簡単に行えます。

アプリケーションシナリオ

1. コード・リファクタリングの自動化
   大規模なプロジェクトや歴史的なレガシーコードの場合、開発者は、すべてのJavaScriptコードをTypeScriptに移行したり、プロジェクト内のすべてのAPIのエラー処理形式を統一したりするなど、反復的で時間のかかるリファクタリング作業をAIインテリジェンスに指示することができる。
2. 新機能の迅速なプロトタイピング
   新機能のアイデアを検証する必要がある場合、開発者はコード・リポジトリと機能の明確な説明を提供することで、AIインテリジェンスが機能的なプロトタイプ・コードを迅速に生成することができる。これにより、アイデアからデモ可能な製品までの時間が大幅に短縮される。
3. プログラムのバグを修正する
   開発者は、既知のバグ情報（エラーログや問題の説明など）をタスクの指示としてAIインテリジェンスに与えることで、問題のあるコードを自動的に特定し、修正ロジックを記述し、修正プログラムを提出することができる。
4. 学習とコードサンプル生成
   初心者はこのツールを使って新しいテクニックを学ぶことができる。AIに要件を尋ね、完成したプロジェクトでどのように新機能を追加したり問題を解決したりするかを観察することで、コードの構成や実装のロジックを視覚的に理解することができる。

品質保証

1. このプロジェクトでは、AIによるコードの修正が安全であることをどのように保証しているのですか？
   プロジェクトは、Vercel Sandboxテクノロジーを統合することで保護されている。 各コーディングタスクは、独立したクラウドベースのマイクロ仮想マシン（microVM）で実行されます。 この環境は外部システムから完全に隔離されており、AIが生成または修正したコードは、ローカルファイルやホストアプリケーションにアクセスすることなく、このサンドボックス内でのみ実行できるため、潜在的なセキュリティリスクを回避できます。このサンドボックスは、タスクが完了すると直ちに破棄されます。
2. 自分のAIモデルを使うことはできますか？
   現在のテンプレートは、ClaudeやOpenAI Codexなど、主要なコード化されたAIサービスの多くをサポートするように設計されています。 テンプレート自体は、カスタムモデルへの「プラグアンドプレイ」インターフェースを提供しませんが、オープンソースであるため、経験豊富な開発者は、ソースコードを修正することで、独自の訓練されたAIモデルや他のAIモデルを統合することができます。または他のAIモデルを統合するためにソースコードを修正することができます。
3. このテンプレートを使用するためにお金を払う必要がありますか？
   テンプレート・プロジェクト自体はオープンソースで無料だ。しかし、それを実行するには、コストが発生する可能性のある多くのサードパーティ・サービスに依存する。例えば、PostgreSQLデータベース、AIモデルを呼び出すためのAPI（Anthropic、OpenAIなど）、Vercelプラットフォームを利用するためのリソース（Sandbox、AI Gatewayなど）には、適切な料金を支払う必要があります。
4. なぜ多くのAPIキーとトークンが必要なのですか？
   それぞれのキーは中核機能に対応している：POSTGRES_URLデータベース・ストレージ・タスクへの接続に使用する；ANTHROPIC_API_KEYもしかしたらOPENAI_API_KEY思考とコーディングのためにAIマクロモデルを呼び出すために；GITHUB_TOKENコード・リポジトリへの読み書き；VERCEL関連するIDとトークンは、セキュアなサンドボックス実行環境の作成と管理に使用される。