Bluefish MCP Connector

Bluefish MCP Connector

Overview

This skill enables Claude to interact with Bluefish through the Model Context Protocol (MCP). It provides a bridge between Claude's AI capabilities and Bluefish's CLI/Plugin, allowing natural language control of Bluefish operations, intelligent automation, and AI-powered assistance for Bluefish workflows.

When to Use This Skill

• HTML/CSS/JS template generation
• Multi-file search and replace with AI patterns
• Site project management and file organization
• Code validation and W3C compliance checking
• Snippet library management

Architecture

┌─────────────┐     ┌─────────────────┐     ┌──────────────────┐
│   Claude     │────▶│   MCP Server    │────▶│   Bluefish         │
│   (Client)   │◀────│   (TypeScript)  │◀────│   (CLI/Plugin    )│
└─────────────┘     └─────────────────┘     └──────────────────┘

Core Concepts

MCP Server Setup

The connector implements an MCP server that exposes Bluefish operations as tools Claude can invoke. The server translates natural language intentions into CLI/Plugin calls.

Key Endpoints/Interfaces

bluefish-cli open, project-manage, validate, snippet-insert

Implementation

// Bluefish MCP Server Implementation
import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";
import { z } from "zod";

const server = new McpServer({
  name: "bluefish-mcp-connector",
  version: "1.0.0",
});

// Tool: List/Query Resources
server.tool(
  "list_resources",
  "List and query Bluefish resources with optional filters",
  {
    query: z.string().optional().describe("Search query or filter"),
    limit: z.number().optional().describe("Max results to return"),
  },
  async ({ query, limit }) => {
    // Call Bluefish CLI/Plugin
    const response = await fetch(`${BASE_URL}bluefish-cli open`, {
      headers: { "Authorization": `Bearer ${API_KEY}` },
    });
    const data = await response.json();
    return {
      content: [{ type: "text", text: JSON.stringify(data, null, 2) }],
    };
  }
);

// Tool: Create Resource
server.tool(
  "create_resource",
  "Create a new resource in Bluefish",
  {
    name: z.string().describe("Resource name"),
    config: z.object({}).passthrough().optional().describe("Resource configuration"),
  },
  async ({ name, config }) => {
    const response = await fetch(`${BASE_URL}bluefish-cli open`, {
      method: "POST",
      headers: {
        "Authorization": `Bearer ${API_KEY}`,
        "Content-Type": "application/json",
      },
      body: JSON.stringify({ name, ...config }),
    });
    const data = await response.json();
    return {
      content: [{ type: "text", text: `Created: ${JSON.stringify(data)}` }],
    };
  }
);

// Tool: Analyze/Report
server.tool(
  "analyze",
  "AI-powered analysis of Bluefish data",
  {
    type: z.string().describe("Analysis type"),
    timeframe: z.string().optional().describe("Time range for analysis"),
  },
  async ({ type, timeframe }) => {
    // Fetch data and provide AI analysis
    const response = await fetch(`${BASE_URL}bluefish-cli open`, {
      headers: { "Authorization": `Bearer ${API_KEY}` },
    });
    const data = await response.json();
    return {
      content: [{ type: "text", text: JSON.stringify(data, null, 2) }],
    };
  }
);

// Start server
const transport = new StdioServerTransport();
await server.connect(transport);

Claude Desktop Configuration

{
  "mcpServers": {
    "bluefish-mcp-connector": {
      "command": "node",
      "args": ["path/to/bluefish-mcp-connector/index.js"],
      "env": {
        "BLUEFISH_API_KEY": "your-api-key",
        "BLUEFISH_BASE_URL": "https://your-instance-url"
      }
    }
  }
}

Best Practices

1. Authentication: Store API keys securely using environment variables; never hardcode credentials
2. Rate Limiting: Implement request throttling to respect Bluefish API rate limits
3. Error Handling: Provide clear, actionable error messages for common failure scenarios
4. Pagination: Handle paginated responses for large datasets efficiently
5. Caching: Cache frequently accessed read-only data to reduce API calls
6. Security: Validate all inputs before passing to the Bluefish API; sanitize outputs
7. Logging: Log all API interactions for debugging and audit purposes

Example Prompts

"Create a responsive HTML5 template with semantic markup and CSS grid layout"

Security Considerations

• All API credentials must be stored as environment variables
• Implement input validation and sanitization for all tool parameters
• Use HTTPS for all API communications
• Follow the principle of least privilege for API token permissions
• Audit log all write operations for compliance tracking

Resources

• Bluefish Official Documentation
• MCP SDK Documentation: https://modelcontextprotocol.io
• MCP Server Examples: https://github.com/modelcontextprotocol/servers
• SkillGalaxy Repository: https://github.com/Sandeeprdy1729/skill_galaxy

Changelog

Part of SkillGalaxy - 10,000+ comprehensive skills for AI-assisted development.