MCP.so
Sign In

MCP HTML Sync Server

@yujiosaka

Repository

About MCP HTML Sync Server

A real-time HTML syncing server with hot reload capabilities, built using the Model Context Protocol (MCP)

#html#sync#server#mcp#static#hot-reload#mcp-server

Config

Add this server to your MCP-compatible client using the configuration below.

{
  "mcpServers": {
    "mcp-html-sync-server": {
      "command": "docker",
      "args": [
        "pull",
        "yujiosaka/mcp-html-sync-server"
      ]
    }
  }
}

Tools

No tools detected

We auto-extract tools from the README. The maintainer can list them under a ## Tools heading to populate this section.

Overview

What is MCP HTML Sync Server?

MCP HTML Sync Server is a real-time HTML syncing server with hot reload capabilities, built using the Model Context Protocol (MCP). It enables AI agents to create, update, and destroy HTML pages dynamically, with all connected clients receiving updates in real-time.

How to use MCP HTML Sync Server?

Install via Docker (docker pull yujiosaka/mcp-html-sync-server), npx (npx mcp-html-sync-server), or from source. Configure using environment variables or a .env file (SERVER_HOST, SERVER_PORT, BASE_URL, PAGE_MAX_AGE, PAGE_MAX_COUNT). Integrate with Claude Desktop or VS Code by adding an MCP server entry to their configuration JSON, and invoke the server’s tools (create_page, update_page, destroy_page) from an AI agent.

Key features of MCP HTML Sync Server

  • Real-time HTML syncing with instant client updates
  • WebSocket hot reload for connected browsers
  • Script management via CDN URLs or inline content
  • Stylesheet management via CDN URLs
  • Built for AI agents using the Model Context Protocol
  • Automatic page expiration after configurable time
  • Configurable maximum page count with cleanup of oldest pages
  • Lightweight with minimal dependencies

Use cases of MCP HTML Sync Server

  • AI agents creating and previewing dynamic HTML pages in real time
  • Adding JavaScript and CSS to pages for interactive demos or prototypes
  • Collaborative editing where content updates are instantly reflected in all clients
  • Hot-reloading web pages during development without manual refresh

FAQ from MCP HTML Sync Server

How do I install MCP HTML Sync Server?

Install via Docker (docker pull yujiosaka/mcp-html-sync-server), npx (npx mcp-html-sync-server), or by cloning the repository and using bun install then bun run start.

What configuration options are available?

Configure via environment variables or a .env file: SERVER_HOST (default localhost), SERVER_PORT (default 3000), BASE_URL (default http://localhost:3000/), PAGE_MAX_AGE (default 1h), and PAGE_MAX_COUNT (default 1000).

What MCP tools does the server provide?

Three tools: create_page (creates a new HTML page with optional scripts and stylesheets), update_page (updates an existing page’s body), and destroy_page (removes a page and disconnects all clients).

How does page expiration and limit work?

Pages have a configurable maximum age (PAGE_MAX_AGE, e.g., 1h). When the total number of pages exceeds PAGE_MAX_COUNT, the oldest pages are automatically removed.

Does the server support real-time updates?

Yes. When a page is created or updated, all connected browsers receive updates in real-time via WebSocket hot reload.

Frequently asked questions

How do I install MCP HTML Sync Server?

Install via Docker (`docker pull yujiosaka/mcp-html-sync-server`), npx (`npx mcp-html-sync-server`), or by cloning the repository and using `bun install` then `bun run start`.

What configuration options are available?

Configure via environment variables or a `.env` file: `SERVER_HOST` (default localhost), `SERVER_PORT` (default 3000), `BASE_URL` (default http://localhost:3000/), `PAGE_MAX_AGE` (default 1h), and `PAGE_MAX_COUNT` (default 1000).

What MCP tools does the server provide?

Three tools: `create_page` (creates a new HTML page with optional scripts and stylesheets), `update_page` (updates an existing page’s body), and `destroy_page` (removes a page and disconnects all clients).

How does page expiration and limit work?

Pages have a configurable maximum age (`PAGE_MAX_AGE`, e.g., 1h). When the total number of pages exceeds `PAGE_MAX_COUNT`, the oldest pages are automatically removed.

Does the server support real-time updates?

Yes. When a page is created or updated, all connected browsers receive updates in real-time via WebSocket hot reload.

Comments

Basic information

Category

Other

License

MIT license

Transports

stdio

Author

yujiosaka

More Other MCP servers

Maestro

mobile-dev-inc

Painless E2E Automation for Mobile and Web

14.8K

Inbox Zero AI MCP

elie222

The world's best AI personal assistant for email. Open source app to help you reach inbox zero fast.

11.6K

🚀 Model Context Protocol (MCP) Curriculum for Beginners

microsoft

This open-source curriculum introduces the fundamentals of Model Context Protocol (MCP) through real-world, cross-language examples in .NET, Java, TypeScript, JavaScript, Rust and Python. Designed for developers, it focuses on practical techniques for building modular, scalable,

16.7K

MCP Go 🚀

mark3labs

A Go implementation of the Model Context Protocol (MCP), enabling seamless integration between LLM applications and external data sources and tools.

8.9K

ghidraMCP

LaurieWired

MCP Server for Ghidra

9.4K