Skip to main content

Getting Started

New to ClaudeSpace? Start here to get up and running quickly.

Node Types Reference

Learn about the 7 node types that make up your agent systems:

Architecture Overview

┌─────────────────────────────────────────┐
│         Electron Desktop App            │
├─────────────────────────────────────────┤
│  Vue 3 + TypeScript + Vite              │
│  ┌────────────┐  ┌──────────────────┐   │
│  │ Node Graph │  │  Chat Interface  │   │
│  │ (Vue Flow) │  │  (Agent Testing) │   │
│  └────────────┘  └──────────────────┘   │
├─────────────────────────────────────────┤
│  Pinia State Management                 │
├─────────────────────────────────────────┤
│  Claude Agent SDK Integration           │
└─────────────────────────────────────────┘
Tech Stack:
  • Electron 28 - Desktop application framework
  • Vue 3 - Modern UI framework with TypeScript
  • Vue Flow - Node graph canvas
  • Pinia - State management
  • Claude Agent SDK - AI agent execution

Why ClaudeSpace?

The Problem

Manually editing .claude configuration folders is error-prone and difficult to visualize:
  • Hard to understand agent architecture at a glance
  • Easy to misconfigure permissions and tool access
  • Difficult to manage complex multi-agent systems
  • No way to test changes in real-time

The Solution

ClaudeSpace provides a visual interface for building Claude AI agents: Visual Node Graph
  • Drag-and-drop canvas for building agent workflows
  • Clear visualization of agent architecture
  • Real-time validation and error checking
Integrated Testing
  • Chat interface built right into the IDE
  • Test agents as you build them
  • See agent thinking process and tool calls
Full Ecosystem Management
  • Skills, Commands, MCPs, Sub-agents, Hooks
  • All managed through intuitive GUI
  • Reusable component library

Community & Support


ClaudeSpace - Making AI agent development visual, one node at a time.
⚡ Electron + Vue + Claude SDK = 🚀
MIT License - View License