diff --git a/src/content/docs/sandbox/tutorials/claude-code.mdx b/src/content/docs/sandbox/tutorials/claude-code.mdx new file mode 100644 index 000000000000000..50ffcbd026c87bf --- /dev/null +++ b/src/content/docs/sandbox/tutorials/claude-code.mdx @@ -0,0 +1,120 @@ +--- +title: Run Claude Code on a Sandbox +pcx_content_type: tutorial +sidebar: + order: 1 +description: Use Claude Code to implement a task in your GitHub repository. +--- + +import { Render, PackageManagers } from "~/components"; + +Build a Worker that takes a repository URL and a task description and uses Sandbox SDK to run Claude Code to implement your task. + +**Time to complete:** 5 minutes + +## Prerequisites + + + +You'll also need: +- An [Anthropic API key](https://console.anthropic.com/) for Claude Code +- [Docker](https://www.docker.com/) running locally + +## 1. Create your project + +Create a new Sandbox SDK project: + + + +```sh +cd claude-code-sandbox +``` + +## 2. Set up local environment variables + +Create a `.dev.vars` file in your project root for local development: + +```sh +echo "ANTHROPIC_API_KEY=your_api_key_here" > .dev.vars +``` + +Replace `your_api_key_here` with your actual API key from the [Anthropic Console](https://console.anthropic.com/). + +:::note +The `.dev.vars` file is automatically gitignored and only used during local development with `npm run dev`. +::: + +## 3. Test locally + +Start the development server: + +```sh +npm run dev +``` + +:::note +First run builds the Docker container (2-3 minutes). Subsequent runs are much faster. +::: + +Test with curl: + +```sh +curl -X POST http://localhost:8787/ \ + -d '{ + "repo": "https://github.com/cloudflare/agents", + "task": "remove the emojis from the readme" + }' +``` + +Response: + +```json +{ + "logs": "Done! I've removed the brain emoji from the README title. The heading now reads \"# Cloudflare Agents\" instead of \"# 🧠 Cloudflare Agents\".", + "diff": "diff --git a/README.md b/README.md\nindex 9296ac9..027c218 100644\n--- a/README.md\n+++ b/README.md\n@@ -1,4 +1,4 @@\n-# 🧠 Cloudflare Agents\n+# Cloudflare Agents\n \n ![npm install agents](assets/npm-install-agents.svg)\n " +} +``` + +## 4. Deploy + +Deploy your Worker: + +```sh +npx wrangler deploy +``` + +Then set your Anthropic API key as a production secret: + +```sh +npx wrangler secret put ANTHROPIC_API_KEY +``` + +Paste your API key from the [Anthropic Console](https://console.anthropic.com/) when prompted. + +:::caution +After first deployment, wait 2-3 minutes for container provisioning. Check status with `npx wrangler containers list`. +::: + +## What you built + +You created an API that: +- Accepts a repository URL and natural language task descriptions +- Creates a Sandbox and clones the repository into it +- Kicks off Claude Code to implement the given task +- Returns Claude's output and changes + +## Next steps + +- [Analyze data with AI](/sandbox/tutorials/analyze-data-with-ai/) - Add pandas and matplotlib for data analysis +- [Code Interpreter API](/sandbox/api/interpreter/) - Use the built-in code interpreter instead of exec +- [Streaming output](/sandbox/guides/streaming-output/) - Show real-time execution progress +- [API reference](/sandbox/api/) - Explore all available methods + +## Related resources + +- [Anthropic Claude documentation](https://docs.anthropic.com/) +- [Workers AI](/workers-ai/) - Use Cloudflare's built-in models \ No newline at end of file