npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

claude-web-ide

v1.3.1

Published

A beautiful localhost Web IDE / GUI wrapper for Claude Code CLI — file explorer, Monaco editor, split-pane terminal, live chat

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Maintainers

lacquochuylacquochuy

Keywords

claudeclaude-codeweb-ideaiterminalmonacoguilocalhostcoding-assistant

Readme

Claude Web IDE

A beautiful, localhost Web IDE and GUI wrapper for Claude Code CLI.
Gives you a split-pane interface with file explorer, Monaco editor, live terminal, and Claude Code chat — right in your browser.

✨ Features

  • 🗂️ VS Code-style file explorer with live file watching
  • 📝 Monaco Editor (same engine as VS Code) with syntax highlighting
  • 💬 Claude Code chat pane with real-time streaming output
  • 🖥️ Integrated terminal — runs your actual shell (PTY)
  • 🔍 Diff viewer — see exactly what Claude changed before accepting
  • ⚡ Accept / Decline edits buttons — no need to type y or n
  • 🎨 Dark mode, responsive layout, drag-to-resize panes

📦 Requirements

  • Node.js ≥ 18
  • Claude Code CLI installed and authenticated (claude command available in PATH)

🚀 Install & Run

One-time install (global)

npm install -g claude-web-ide

Start the IDE

# Navigate to your project first (optional — you can also pick a folder inside the IDE)
cd /path/to/your/project

# Launch
claude-web-ide

The IDE will open automatically at http://127.0.0.1:5001

⚙️ Options

claude-web-ide [options]

  --port <number>   Run on a custom port  (default: 5001)
  --no-open         Don't auto-open browser
  --help, -h        Show help

Examples:

claude-web-ide --port 8080        # custom port
claude-web-ide --no-open          # headless / server mode

🔄 Upgrade

npm update -g claude-web-ide

🗑️ Uninstall

npm uninstall -g claude-web-ide

🛠️ Running from source (for developers)

git clone <repo-url>
cd claude-web-ide
npm install
npm run dev    # starts Vite dev server + Express server concurrently

📄 License

MIT