247afk Block Editor MCP Server

1

Add it to Claude Code

Run this in a terminal.

Run in terminal
claude mcp add 247afk-editor -- npx -y 247afk-mcp
README.md

Lets AI assistants build and edit block editor scripts in real time.

247afk Block Editor MCP Server

Lets AI assistants (Claude Desktop, Cline, Cursor, and any MCP-compatible client) build and edit block editor scripts in real time.

How it works

  1. The MCP server runs locally and starts a WebSocket bridge on 127.0.0.1:3002
  2. Open a script in the 247afk editor, the site will connect to your websocket.
  3. Your ai assistant can now use the MCP server to make changes in scripts.

Install

npm install -g 247afk-mcp

Get Started

Codex CLI

codex mcp add 247afk-mcp -- npx -y 247afk-mcp

Gemini CLI

gemini mcp add 247afk-mcp npx "-y 247afk-mcp"

Claude Code

claude mcp add 247afk-mcp -- npx -y 247afk-mcp

Claude Desktop

{
  "mcpServers": {
    "247afk-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "247afk-mcp"
      ]
    }
  }
}

Cursor

paste this in your browser:

cursor://anysphere.cursor-deeplink/mcp/install?name=247afk%20Block%20Editor%20MCP%20Server&config=eyJjb21tYW5kIjoibnB4IiwiYXJncyI6WyIteSIsIjI0N2Fmay1tY3AiXX0=

Manual

  1. Copy configuration below
  2. Add it to your MCP client configuration
  3. Follow your client's specific setup instructions
  4. Restart your MCP client to apply changes

Configuration

{
  "mcpServers": {
    "247afk-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "247afk-mcp"
      ]
    }
  }
}

Restart antigravity/claude code after saving.

Test without an AI client

npx @modelcontextprotocol/inspector 247afk-mcp

Opens a browser UI to call tools manually.

Changelog

1.0.1

  • Added update_node_data — merge field values into a node without replacing it
  • Added move_node — reposition a node on the canvas
  • Added get_node — inspect a single node's type, position, and data
  • Added clear_graph — wipe all nodes and edges while keeping variables
  • Added validate_graph — run client-side validation and return errors/warnings
  • Added save_graph — save the script to the server (equivalent to Ctrl+S)
  • Added auto_layout — auto-arrange nodes left-to-right by execution flow
  • Added add_variable — add or replace a single variable without touching others
  • Added remove_variable — remove a single variable by name
  • Fixed variable picker dropdowns being empty in MCP-built graphs

1.0.0

  • Initial release

Requirements

  • Node.js 18 or later
  • 247afk account with access to the script editor
  • Browser open on the script to edit. (on https://247afk.com)

Tools (9)

update_node_dataMerge field values into a node without replacing it
move_nodeReposition a node on the canvas
get_nodeInspect a single node's type, position, and data
clear_graphWipe all nodes and edges while keeping variables
validate_graphRun client-side validation and return errors or warnings
save_graphSave the script to the server
auto_layoutAuto-arrange nodes left-to-right by execution flow
add_variableAdd or replace a single variable
remove_variableRemove a single variable by name

Configuration

claude_desktop_config.json
{"mcpServers": {"247afk-mcp": {"command": "npx", "args": ["-y", "247afk-mcp"]}}}

Try it

Auto-layout the current script nodes to make the execution flow easier to read.
Add a new variable named 'api_key' with the value '12345' to my script.
Inspect the node with ID 'node_1' and tell me its current data.
Validate the current graph to check for any errors or warnings.
Move the node 'node_1' to position x: 100, y: 200.

Frequently Asked Questions

What are the key features of 247afk Block Editor?

Real-time script manipulation via WebSocket bridge. Support for node repositioning and data updates. Automated graph layout based on execution flow. Variable management including adding and removing variables. Built-in graph validation and saving capabilities.

What can I use 247afk Block Editor for?

Automating the creation of complex 247afk scripts using AI. Refactoring existing block editor scripts for better readability. Debugging script logic by inspecting node data in real-time. Quickly cleaning up messy node layouts on the canvas.

How do I install 247afk Block Editor?

Install 247afk Block Editor by running: npm install -g 247afk-mcp

What MCP clients work with 247afk Block Editor?

247afk Block Editor works with any MCP-compatible client including Claude Desktop, Claude Code, Cursor, and other editors with MCP support.

Turn this server into reusable context

Keep 247afk Block Editor docs, env vars, and workflow notes in Conare so your agent carries them across sessions.

Need the old visual installer? Open Conare IDE.
Open Conare