# lexus2016/claude-code-studio architecture

> Architecture diagram of the GitHub repository lexus2016/claude-code-studio, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-28). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/lexus2016/claude-code-studio
- Repository: https://github.com/lexus2016/claude-code-studio

## Overview

Claude Code Studio is a web and desktop workspace that lets a developer chat with Claude Code, queue autonomous work, and manage projects. The main workflow starts in the browser, passes through the server, and runs Claude CLI work in project sessions; task chaining, isolated worktrees, persistent sessions, terminals, and remote controls extend it. The README documents capabilities beyond the sampled excerpts, so some subsystem wiring is omitted rather than inferred. Paths for documented but unsampled features use only supported files or enclosing directories.

Main entry points: [`server.js`](https://github.com/lexus2016/claude-code-studio/blob/main/server.js) (Studio server), [`electron/main.js`](https://github.com/lexus2016/claude-code-studio/blob/main/electron/main.js) (Desktop shell), [`telegram-bot.js`](https://github.com/lexus2016/claude-code-studio/blob/main/telegram-bot.js) (Telegram control), [`electron/preload.js`](https://github.com/lexus2016/claude-code-studio/blob/main/electron/preload.js) (Desktop bridge)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["User access"]
  node_browser["Browser UI"]
  node_server["Studio server<br/>[server.js]"]
  node_auth["Authentication<br/>[auth.js]"]
  node_desktop["Desktop shell<br/>[main.js]"]
  node_preload["Desktop bridge<br/>[preload.js]"]
end

subgraph group_execution["Agent execution"]
  node_claude["Claude CLI<br/>[claude-cli.js]"]
  node_interactive["Interactive CLI"]
  node_terminal["Terminal bridge<br/>[terminal-bridge.js]"]
  node_tmux["Terminal sessions"]
  node_worktrees["Worktree isolation"]
end

subgraph group_tasks["Task workflows"]
  node_taskmanager["Task MCP"]
  node_agentdag["Agent dependencies<br/>[agent-dag.js]"]
  node_multiresult["Agent results"]
end

subgraph group_state["Sessions and state"]
  node_database[("SQLite adapter<br/>[db-adapter.js]")]
  node_config["Configuration<br/>[config-resolve.js]"]
end

subgraph group_integrations["Remote integrations"]
  node_telegram["Telegram control<br/>[telegram-bot.js]"]
  node_remote["SSH projects<br/>[remote-env.js]"]
  node_remote_files["Remote files<br/>[remote-files.js]"]
  node_tunnel["Public tunnel<br/>[tunnel-manager.js]"]
  node_external_agent["External agents<br/>[bots.js]"]
end

node_developer(("Developer"))
node_claude_service["Claude service"]
node_telegram_service["Telegram"]
node_ssh_host["SSH host"]
node_tunnel_provider["Tunnel provider"]

node_developer -->|"uses"| node_browser
node_browser -->|"sends requests"| node_server
node_server -->|"checks access"| node_auth
node_desktop -->|"launches"| node_server
node_desktop -->|"exposes IPC"| node_preload
node_preload -->|"bridges desktop"| node_browser
node_server -->|"runs tasks"| node_claude
node_claude -->|"invokes"| node_claude_service
node_server -->|"starts sessions"| node_interactive
node_server -->|"handles terminals"| node_terminal
node_terminal -->|"manages sessions"| node_tmux
node_server -->|"isolates work"| node_worktrees
node_server -->|"serves task tools"| node_taskmanager
node_taskmanager -->|"posts actions"| node_server
node_server -->|"resolves dependencies"| node_agentdag
node_server -->|"handles results"| node_multiresult
node_server -->|"reads and writes"| node_database
node_server -->|"loads settings"| node_config
node_telegram -->|"receives updates"| node_telegram_service
node_telegram -.->|"controls tasks"| node_server
node_server -.->|"connects remotely"| node_remote
node_remote -.->|"opens SSH"| node_ssh_host
node_server -.->|"transfers files"| node_remote_files
node_server -.->|"manages exposure"| node_tunnel
node_tunnel -.->|"starts process"| node_tunnel_provider
node_server -.->|"delegates tasks"| node_external_agent

click node_server "https://github.com/lexus2016/claude-code-studio/blob/main/server.js"
click node_auth "https://github.com/lexus2016/claude-code-studio/blob/main/auth.js"
click node_desktop "https://github.com/lexus2016/claude-code-studio/blob/main/electron/main.js"
click node_preload "https://github.com/lexus2016/claude-code-studio/blob/main/electron/preload.js"
click node_claude "https://github.com/lexus2016/claude-code-studio/blob/main/claude-cli.js"
click node_interactive "https://github.com/lexus2016/claude-code-studio/blob/main/claude-interactive.js"
click node_terminal "https://github.com/lexus2016/claude-code-studio/blob/main/terminal-bridge.js"
click node_tmux "https://github.com/lexus2016/claude-code-studio/blob/main/terminal-session.js"
click node_worktrees "https://github.com/lexus2016/claude-code-studio/blob/main/worktree-manager.js"
click node_taskmanager "https://github.com/lexus2016/claude-code-studio/blob/main/mcp-task-manager.js"
click node_agentdag "https://github.com/lexus2016/claude-code-studio/blob/main/agent-dag.js"
click node_multiresult "https://github.com/lexus2016/claude-code-studio/blob/main/multi-agent-result.js"
click node_database "https://github.com/lexus2016/claude-code-studio/blob/main/db-adapter.js"
click node_config "https://github.com/lexus2016/claude-code-studio/blob/main/config-resolve.js"
click node_telegram "https://github.com/lexus2016/claude-code-studio/blob/main/telegram-bot.js"
click node_remote "https://github.com/lexus2016/claude-code-studio/blob/main/remote-env.js"
click node_remote_files "https://github.com/lexus2016/claude-code-studio/blob/main/remote-files.js"
click node_tunnel "https://github.com/lexus2016/claude-code-studio/blob/main/tunnel-manager.js"
click node_external_agent "https://github.com/lexus2016/claude-code-studio/blob/main/bots.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_browser,node_server,node_auth,node_desktop,node_preload toneBlue
class node_claude,node_interactive,node_terminal,node_tmux,node_worktrees toneAmber
class node_taskmanager,node_agentdag,node_multiresult toneMint
class node_database,node_config toneRose
class node_telegram,node_remote,node_remote_files,node_tunnel,node_external_agent,node_developer,node_claude_service,node_telegram_service,node_ssh_host,node_tunnel_provider toneIndigo
```

## Components

### User access

- **Browser UI**
- [Studio server](https://github.com/lexus2016/claude-code-studio/blob/main/server.js): `server.js`
- [Authentication](https://github.com/lexus2016/claude-code-studio/blob/main/auth.js): `auth.js`
- [Desktop shell](https://github.com/lexus2016/claude-code-studio/blob/main/electron/main.js): `electron/main.js`
- [Desktop bridge](https://github.com/lexus2016/claude-code-studio/blob/main/electron/preload.js): `electron/preload.js`

### Agent execution

- [Claude CLI](https://github.com/lexus2016/claude-code-studio/blob/main/claude-cli.js): `claude-cli.js`
- [Interactive CLI](https://github.com/lexus2016/claude-code-studio/blob/main/claude-interactive.js): `claude-interactive.js`
- [Terminal bridge](https://github.com/lexus2016/claude-code-studio/blob/main/terminal-bridge.js): `terminal-bridge.js`
- [Terminal sessions](https://github.com/lexus2016/claude-code-studio/blob/main/terminal-session.js): `terminal-session.js`
- [Worktree isolation](https://github.com/lexus2016/claude-code-studio/blob/main/worktree-manager.js): `worktree-manager.js`

### Task workflows

- [Task MCP](https://github.com/lexus2016/claude-code-studio/blob/main/mcp-task-manager.js): `mcp-task-manager.js`
- [Agent dependencies](https://github.com/lexus2016/claude-code-studio/blob/main/agent-dag.js): `agent-dag.js`
- [Agent results](https://github.com/lexus2016/claude-code-studio/blob/main/multi-agent-result.js): `multi-agent-result.js`

### Sessions and state

- [SQLite adapter](https://github.com/lexus2016/claude-code-studio/blob/main/db-adapter.js): `db-adapter.js`
- [Configuration](https://github.com/lexus2016/claude-code-studio/blob/main/config-resolve.js): `config-resolve.js`

### Remote integrations

- [Telegram control](https://github.com/lexus2016/claude-code-studio/blob/main/telegram-bot.js): `telegram-bot.js`
- [SSH projects](https://github.com/lexus2016/claude-code-studio/blob/main/remote-env.js): `remote-env.js`
- [Remote files](https://github.com/lexus2016/claude-code-studio/blob/main/remote-files.js): `remote-files.js`
- [Public tunnel](https://github.com/lexus2016/claude-code-studio/blob/main/tunnel-manager.js): `tunnel-manager.js`
- [External agents](https://github.com/lexus2016/claude-code-studio/blob/main/bots.js): `bots.js`

### Other components

- **Developer**
- **Claude service**
- **Telegram**
- **SSH host**
- **Tunnel provider**

## Connections

- Developer → Browser UI: uses
- Browser UI → Studio server: sends requests
- Studio server → Authentication: checks access
- Desktop shell → Studio server: launches
- Desktop shell → Desktop bridge: exposes IPC
- Desktop bridge → Browser UI: bridges desktop
- Studio server → Claude CLI: runs tasks
- Claude CLI → Claude service: invokes
- Studio server → Interactive CLI: starts sessions
- Studio server → Terminal bridge: handles terminals
- Terminal bridge → Terminal sessions: manages sessions
- Studio server → Worktree isolation: isolates work
- Studio server → Task MCP: serves task tools
- Task MCP → Studio server: posts actions
- Studio server → Agent dependencies: resolves dependencies
- Studio server → Agent results: handles results
- Studio server → SQLite adapter: reads and writes
- Studio server → Configuration: loads settings
- Telegram control → Telegram: receives updates
- Telegram control → Studio server: controls tasks
- Studio server → SSH projects: connects remotely
- SSH projects → SSH host: opens SSH
- Studio server → Remote files: transfers files
- Studio server → Public tunnel: manages exposure
- Public tunnel → Tunnel provider: starts process
- Studio server → External agents: delegates tasks