Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Vercel Sandbox

オープン
#637 コメント 2 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
4/5
見積もり時間
3〜5日
初心者へのやさしさ
35/100
issue の種類
機能追加
明瞭さ
説明が足りない
活発さ
静か
技術スタック
typescript
領域
ai, web-dev

調査の方向性

リポジトリのファイル、テスト、エントリポイントは指定されていません。まず、リンク先のドキュメントに基づいて、想定されている Vercel Sandbox と AI SDK の統合を確認し、その後、既存のレポート生成フローを特定してください。Done は、ハードコードされたテンプレートではなく、生成されたコードを安全に実行し、HTML スタイルのレポートを生成することとして定義してください。

索引モデルが issue の本文から書いたものです。

説明

Yes. If you're using the Vercel AI SDK ecosystem, there are now a few options for code generation and execution sandboxes:

1. AI SDK Playground

The official AI SDK site includes a playground for experimenting with prompts, tool calls, structured outputs, agents, and UI generation. ([AI SDK][1])

[AI SDK Playground](https://ai-sdk.dev?utm_source=chatgpt.com)


2. Vercel Sandbox (Recommended for Codegen Agents)

Vercel released a dedicated sandbox environment designed specifically for AI-generated code and coding agents. It provides:

  • Isolated execution environments
  • File system access
  • Command execution
  • Live previews
  • Support for generated applications
  • TypeScript and Python runtimes
  • Integration with AI SDK agents

This is the same infrastructure used for AI coding workflows and agent execution. ([Vercel][2])

[Vercel Sandbox Docs](https://vercel.com/docs/vercel-sandbox?utm_source=chatgpt.com)

Example:

import { Sandbox } from "@vercel/sandbox";

const sandbox = await Sandbox.create();

await sandbox.runCommand("npm create vite@latest app");

3. AI SDK + Sandbox Agent Pattern

Vercel has an official guide showing how to:

  1. Generate code with an LLM.
  2. Write files into a sandbox.
  3. Run the code.
  4. Stream logs back to the user.
  5. Return a preview URL.

This is effectively the architecture behind products like v0 and many coding agents. ([Vercel][3])

[Run AI Generated Code Safely Guide](https://vercel.com/guides/running-ai-generated-code-sandbox?utm_source=chatgpt.com)


4. If You're Building a Cursor / Claude Code Competitor

A common architecture is:

User
  ↓
AI SDK Agent
  ↓
Planner
  ↓
Vercel Sandbox
  ↓
Filesystem
  ↓
npm/pnpm
  ↓
Preview Server
  ↓
Live URL

Use HTML styled report generation instead of template hardcoded ones.

主要言語
TypeScript
スター
19
フォーク
6
平均マージ
31分
マージ済み PR(30日)
4

環境構築

  • Dockerfile または Docker Compose ファイルあり
  • プルリクエストのテンプレートなし
  • コントリビューションガイドなし

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

QueueLab/QCX のほかの issue

QueueLab/QCX の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。