Claude Code IDE – A Local Web IDE Wrapping Claude Code's CLI

⚡ Claude Code IDE A full-featured local web IDE that wraps Claude Code's CLI with real-time terminal emulation, project/session management, file processing, and MCP integration. Built entirely in Python and vanilla JavaScript — no frameworks, no Electron, no cloud dependencies. This is not a thin wrapper or a chat UI that calls an API. It manages real PTY processes, streams bidirectional I/O over WebSockets, renders raw terminal output through a virtual terminal emulator, and extends Claude Code's capabilities through a custom MCP tool server. What It Does Interactive Terminal — Runs Claude Code in a real terminal (xterm.js) inside your browser Session Recording — Every conversation is automatically captured and cleaned via virtual terminal rendering (pyte) Session Resume — Resume any saved session using Claude Code's native --resume flag Project Organization — Group related sessions into named projects with custom working directories Session Viewer — Browse and read past conversations with clean, readable transcripts Session Export — Download transcripts as .md or .txt files Session Compare — Side-by-side diff view of any two sessions within a project CLAUDE.md Editor — Read, edit, and save CLAUDE.md project instructions directly in the IDE File Upload — Upload files (Excel, Word, images, etc.) to the project directory for Claude to read via MCP tools Screenshot Capture — One-click Windows Snipping Tool integration: capture a screen region and Claude analyzes it automatically Conversation Import — Paste text from claude.ai, ChatGPT, email, or any source into a modal; saved as a file and Claude picks up where it left off Quick-Resume — Hover any project to one-click resume the most recent session Pin Projects — Right-click to pin frequently used projects to the top of the sidebar Work-Related Filter — Right-aligned "Work" checkbox column in the sidebar with a header toggle (⚑) to filter the list to work projects only Most-Recent-First Sort — Projects are ordered by the timestamp of their most recent session (pinned projects still float to the top) Project Search — Search box below the PROJECTS header filters the project list by name in real time (Esc clears) Live URLs — Per-project list of live URLs (production, staging, localhost, etc.); a 🌐 button next to the Git tab opens the URL or shows a dropdown when more than one is configured Copy Session UUID — Right-click any session in the sidebar and pick Copy UUID to copy its Claude Code session ID to the clipboard File Tree — Toggle a file explorer panel alongside the terminal showing the project's working directory with path display; click any file to ask Claude to read it Git Integration — Dedicated Git tab showing branch, changed files, recent commits, and full color-highlighted diffs; initialize new repos from the UI Timestamps — Projects and sessions display their creation date and time in the sidebar Search — Full-text search across all saved sessions (Ctrl+Shift+F) Settings — Configurable Claude Code command, default project, and terminal font size Context Menus — Right-click projects to rename, delete, set working directory, or pin; right-click sessions to rename, delete, or move to another project Import External Sessions — Pull in any Claude Code session from outside the IDE by selecting from a list or pasting a UUID; creates a new project with the session immediately resumable Session UUID Display — View and copy session UUIDs from the session viewer toolbar for use with…

This excerpt is published under fair use for community discussion. Read the full article at GitHub.