Skip to content
Back to Templates

Claude Managed Agents

Demo app for Claude Managed Agents hosted on Vercel

Claude Managed Agents

Claude Managed Agents Template

An internal knowledge agent built with Claude Managed Agents. Connect your GitHub, Notion, and Slack via MCP and ask questions across all of them.

Stack

LayerChoice
AppNext.js 16 (App Router), React 19
UIshadcn/ui, Tailwind CSS v4
AuthBetter Auth + Sign in with Vercel
DataNeon + Drizzle ORM
BackgroundWorkflow DevKit
AgentsClaude Managed Agents via @anthropic-ai/sdk

Setup

1. Clone and install

pnpm install

2. Environment variables

Copy .env.example to .env.local and fill in each variable:

VariableWhere to get it
DATABASE_URLAuto-provisioned by the Deploy button, or via vercel integration add neon. Or create a database at neon.tech.
ANTHROPIC_API_KEYconsole.anthropic.com/settings/keys
ANTHROPIC_AGENT_IDCreate an agent via the Managed Agents quickstart.
ANTHROPIC_ENVIRONMENT_IDCreate an environment for your agent and copy the ID.
BETTER_AUTH_SECRETGenerate with openssl rand -base64 32.
BETTER_AUTH_URLhttp://localhost:3000 locally, your deployment URL in production.
VERCEL_CLIENT_IDCreate an OAuth app via Sign in with Vercel. Callback: <your-url>/api/auth/callback/vercel.
VERCEL_CLIENT_SECRETFrom the same Vercel OAuth app.
TOKEN_ENCRYPTION_KEYGenerate with openssl rand -hex 32.
GITHUB_CLIENT_ID(Optional) Create a GitHub OAuth app for the GitHub integration.
GITHUB_CLIENT_SECRET(Optional) From the same GitHub OAuth app.

3. Push database schema

pnpm db:push

4. Run

pnpm dev

Open http://localhost:3000, sign in, and start asking questions.

References