skills.rest
liuyu520
liuyu520COMMUNITY
Explore all skills by this author →
GitHub

webui-vibe-coding

Stream Claude Code sessions from a browser via WebSocket.

2|Updated Mar 30, 2026
Search Tags:#frontend#claude code#session management#vibe coding#websocket#webui#go backend
One-click install
npx skills add https://github.com/liuyu520/cc-connect-fork --skill webui-vibe-coding
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: webui-vibe-coding
Source: https://github.com/liuyu520/cc-connect-fork/tree/main/.claude/skills/webui-vibe-coding
Command: npx skills add https://github.com/liuyu520/cc-connect-fork --skill webui-vibe-coding

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Provides a browser-based UI to interact with Claude Code for the Vibe Coding workflow, enabling project selection, session management, and streaming chat without switching contexts.

Core Features & Use Cases

  • Web UI to start Claude Code sessions from a selected project work directory.
  • Real-time streaming chat with Claude Code via WebSocket and a multi-tab interface.
  • Self-contained Go backend and React/Vue frontend integration within the cc-connect framework.

Quick Start

Open the Vibe Coding UI and select a project to start a Claude Code session in your browser.

Frequently Asked Questions about webui-vibe-coding

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I interact with Claude Code through a browser-based WebUI?▼

To interact with Claude Code via a browser-based WebUI, this skill deploys a self-contained Go backend and frontend within the cc-connect framework, enabling real-time streaming chat and project selection directly from your web browser.

How do I start a Vibe Coding session from a specific project work directory?▼

To start a Vibe Coding session from a specific project work directory, open the Vibe Coding UI and select your target project to initiate a Claude Code session without switching contexts.

Does Claude Code WebUI support real-time streaming chat and session management?▼

Yes, the Claude Code WebUI supports real-time streaming chat and session management by utilizing a WebSocket protocol and a multi-tab interface to maintain active conversations and manage permissions.

What backend and frontend technologies are required for a Claude Code WebUI?▼

A Claude Code WebUI requires a Go backend for the management API and webui server, integrated with React or Vue frontend assets, communicating via a WebSocket protocol.

Can I manage attachments and permissions for Claude Code sessions in a browser?▼

Yes, you can manage attachments and permissions for Claude Code sessions in a browser, as the WebUI backend processes these requests dynamically through its management API during active sessions.

What is the best way to run Claude Code remotely without switching terminal contexts?▼

The best way to run Claude Code remotely without switching terminal contexts is using a browser-based Vibe UI, which provides a multi-tab interface for streaming messages and managing project sessions directly online.

Related Skills

Explore More Software Engineering Skills→
333-333-333333-333-333

go-service-bootstrap

Bootstrap Go services with dependency wiring and environment-based configuration.

Community
Intermediate
ohnotnowohnotnow
1

conversation-to-html

Convert Claude Code or Codex CLI session logs into self-contained HTML transcripts.

Community
Advanced
ssssssssassssssssssssssassssss

frontend-integration

Integrate React and Flutter apps with Kailash workflows via HTTP Nexus APIs.

Community
Intermediate
barkleesandersbarkleesanders
5

api2cli

Generate Commander.js CLIs and Claude Code skills from API documentation.

Community
Advanced