drawdb-mcp

DrawDB + MCP server

This fork of DrawDB extends the original with AI assistant integration via Model Context Protocol (MCP). AI assistants like Claude can now create, modify, and manage database diagrams programmatically through a WebSocket API.

Demo Video

DrawDB MCP Integration Demo

Watch how to design database schemas using natural language with Claude AI.

Architecture:

  • apps/gui: Original React-based DrawDB frontend
  • apps/backend: NestJS MCP server that enables AI assistants to control the diagram editor
  • Built with Turborepo and pnpm workspaces

Getting Started

Quick Start with Docker (Recommended)

The easiest way to get started is using Docker:

docker run \
  --name drawdb-mcp \
  -p 8080:80 \
  -p 3000:3000 \
  --restart unless-stopped \
  ghcr.io/anatoly314/drawdb-mcp:latest

Then:

  1. Open GUI: http://localhost:8080
  2. Connect Claude Code to the MCP server:
claude mcp add --transport http drawdb-mcp http://127.0.0.1:3000

Now Claude can create and modify database diagrams for you!

See GHCR_DEPLOYMENT.md for available tags and advanced usage.

Local Development

Prerequisites

  • Node.js 20+
  • pnpm 8.15.0+ (install via npm install -g pnpm)

Start both GUI and backend:

git clone https://github.com/anatoly314/drawdb-mcp
cd drawdb-mcp
pnpm install
pnpm dev

Start GUI only:

pnpm gui:dev
# Access at http://localhost:5173

Start backend only:

pnpm backend:dev
# WebSocket at ws://localhost:3000/remote-control

Build

Build both applications:

pnpm install
pnpm build

Build specific app:

pnpm build --filter=gui
pnpm build --filter=backend

Connect Claude Code to MCP Server

When running locally, connect Claude Code:

claude mcp add --transport http drawdb-mcp http://127.0.0.1:3000

The frontend automatically connects to the backend via WebSocket for real-time updates.

Docker Deployment

See DOCKER_BUILD.md for detailed build instructions.

Build with Docker Compose:

docker-compose up --build
# Access at http://localhost:8080

Or build directly:

docker build -t drawdb-mcp:local .
docker run -p 8080:80 -p 3000:3000 drawdb-mcp:local

The Docker image includes both frontend and backend. WebSocket is proxied through Nginx.

Related Servers