Claude Dojo

A visual agent dashboard for Claude AI - watch agents work in an interactive 3D hex-grid interface.

!Claude Dojo
!Node
!License

Features

- 3D Hex Grid Visualization - Watch multiple Claude sessions as interactive hexagonal tiles with real-time status updates
- Subagent System - Visualize spawned subagents (Explore, Plan, Bash, Read, Write, Glob) orbiting their parent session
- Real Tool Execution - Claude can read/write files and execute shell commands on your system
- Permission System - Approve or deny file writes and command execution (like Claude Code CLI)
- Real-time Streaming - Watch responses stream in as Claude generates them
- Token Tracking - Visual context bar showing token usage with color-coded thresholds
- Session Persistence - Sessions survive server restarts
- Slash Commands - 14 built-in commands with autocomplete
- Markdown Rendering - Rich formatting with syntax-highlighted code blocks
- Resizable Panels - Drag to adjust the canvas/chat split

Quick Start

$3

- Node.js >= 18.0.0
- Anthropic API key (or AWS credentials for Bedrock)

$3

``bash


Set your API key

export ANTHROPIC_API_KEY="your-api-key-here"

Run with npx (no install needed)

npx claude-dojo
`

This starts the server and opens the dashboard in your browser at http://localhost:3001.

$3

`bash
npx claude-dojo [options]

Options:
--dangerously-skip-permissions Skip all permission prompts (auto-approve everything)
--help, -h Show help message
`

Warning: The --dangerously-skip-permissions flag will auto-approve all file writes and shell commands without prompting. Use with caution and only in trusted environments.

$3

`bash
npx claude-dojo@latest
`

Configuration

$3

| Variable | Description | Default |
|----------|-------------|---------|
| ANTHROPIC_API_KEY | Your Anthropic API key | Required (unless using Bedrock) |
| PORT | Server port | 3001 |
| ANTHROPIC_MODEL | Claude model to use | claude-sonnet-4-20250514 |
| CLAUDE_CODE_USE_BEDROCK | Use AWS Bedrock instead of Anthropic API | false |
| AWS_REGION | AWS region for Bedrock | us-east-1 |
| CLAUDE_DOJO_NO_BROWSER | Don't auto-open browser on start | false |

$3

To use Claude via AWS Bedrock instead of the Anthropic API:

`bash


Set environment variables

export CLAUDE_CODE_USE_BEDROCK=1
export AWS_REGION=us-east-1
export ANTHROPIC_MODEL=anthropic.claude-sonnet-4-20250514-v1:0

Ensure AWS credentials are configured

aws configure

Run Claude Dojo

npx claude-dojo
`

The Bedrock SDK is included - no additional installation needed.

Slash Commands

Type / in the input to see available commands with autocomplete.

| Command | Description |
|---------|-------------|
| /help | Show available commands and usage |
| /status | Display session status, token usage, and system info |
| /clear | Clear conversation history |
| /compact | Compress context by summarizing older messages |
| /todos | View and manage the task list |
| /resume | List and resume previous sessions |
| /rewind | Undo recent messages or restore snapshots |
| /export | Export conversation to JSON or Markdown |
| /model | View or change the Claude model |
| /system | View or modify the system prompt |
| /settings | View and modify session settings |
| /file | Read a file into the conversation |
| /search | Search for patterns in files |
| /run | Execute a shell command |

Keyboard Shortcuts

| Key | Action |
|-----|--------|
| 1-9 | Select session by index (when not typing) |
| Esc | Deselect current session |
| / | Start typing a command |
| Enter | Send message |
| Shift+Enter | New line in message |
| Tab | Accept autocomplete suggestion |
| ↑/↓ | Navigate autocomplete options |

Permission System

When Claude tries to write files or execute commands, a permission dialog appears:

- Allow Once - Permit this specific operation
- Allow Always - Remember permission for similar operations this session
- Deny - Block the operation

Dangerous commands (like rm -rf, sudo) show enhanced warnings.

Tool Capabilities

Claude has access to real tools that execute on your system:

| Tool | Description |
|------|-------------|
| read_file | Read file contents |
| write_file | Write content to files (requires permission) |
| bash | Execute shell commands (requires permission) |
| glob | Find files matching patterns |
| task | Spawn specialized subagents |

Data Storage

- Sessions: Persisted to .claude-dojo/sessions/ in your working directory
- Panel width: Stored in browser localStorage

Development

`bash


Clone the repository

git clone https://github.com/anthropics/claude-dojo.git
cd claude-dojo

Install dependencies

npm install

Run in development mode (hot reload)

npm run dev

Build for production

npm run build

Start production server

npm start
`

Architecture

`
claude-dojo/
├── client/ # React frontend with Three.js 3D visualization
│ ├── src/
│ │ ├── components/ # UI components (HexGrid, SessionPanel, etc.)
│ │ ├── hooks/ # Custom React hooks
│ │ ├── stores/ # Zustand state management
│ │ └── types/ # TypeScript types
│ └── dist/ # Production build
├── server/ # Express backend
│ ├── src/
│ │ ├── commands/ # Slash command handlers
│ │ ├── claudeService.ts # Claude API integration
│ │ └── sessionManager.ts # Session persistence
│ └── dist/ # Compiled server
└── bin/ # CLI entry point
`

Troubleshooting

$3

`bash


Use a different port


PORT=3002 npx claude-dojo
`

$3

Ensure you have write permissions to the .claude-dojo/` directory in your working directory.

License

MIT

Credits

Built with Claude Code (claude-opus-4-5-20250514)