Claude AI - MCP - Lifx lights

June 21st 2025

Hello again kind people of the internet.

This blog is about my most recent effort to have Claude AI chat control a LIFX lightbulb through an MCP server. This is a learning & demonstration project to find out how to wire up an MCP server to the LIFX API and to also have the Claude API chat control the light.

Full disclosure: Yes I had CoPilot Agent (Claude Sonnet 4) help on this project...and I learned a ton...and you can too. These agents are like bicycles for the mind.

GitHub Project

Most of what you need to know to do this project yourself is explained in the README within my GitHub...you probably should review that as well.
https://github.com/tenace2/lifx-claude-vue

The codebase is Vue.js and Quasar frameworks.

I'll attempt to add some extra context in this blog (in addition to the project README) as there is a really a lot to learn about the Model Context Control (MCP) protocol, and how the Claude API actually works (which is not intuitive). This demo project has several front end components:
1. The MCP Server Control
2. Quick Light Control
3. Claude AI Assistant

The Architecture is and especially the backend server explained at the end of this blog.

The MCP Server Control

This is where you input your Lifx API key, and can view the server logs from both the back end server, and the Lifx MCP sever. You can Copy the Sever Logs to your clipboard for offline review.

SET TOKEN

Stores the API key in a password field, and is only good for the life of your browser session.

Quick Light Controls

You don't need Claude configured for this to work.

Quick Light front end control Vue.js component simply communicates via HTTP to the Backend Server Manager (an Express server running in the background), then from the Backend Server via JSON RPC up to the LIFX MCP Server...you just have to input your Lifx API key first (green Ready indicator) to spin up the LIFX MCP server.

Claude AI Assistant

The Claude AI Assistant requires the Claude API key (they have a cheap $5 dollar meal deal). This api key is also stored in a Password field of the app and is only good for the length of your browser session.

Apologies: The above component is a real piece of development sausage, but that's what happens when you start crashing around with a new technology.

Claude AI chat input field

The actual Claude Chat Input field ended up non-intuitively way down the middle of the page, and no, I didn't take the time to clean that up.

Claude AI System Prompt Controls - Guard Rails

This is where things got interesting.

If this was a public app for controlling the light bulb with a ChatBot, you probably would not want the user to do anything but control the light, and not prompt the Chat interface for let's say: Please provide me a potato salad recipe.

So the best way to do set up these guard rails is with a System "pre-prompt".

Suggest turning the System Prompt off and attempting chat's like "make me bacon and eggs".

Note: The chat bot can potentially do insane things like interpret the "on" in "bacon" as wanting to turn the lights on (word boundary issues.) for which on is within the lexicon of a light control. So have fun!

No API Memory

Each request to Claude via the API key is kinda a "one shot" deal. At this point (June 2025) I did not find a way to have 'session memory' over a series of api induced chat requests. So, the pre-prompt needs to be 'hard wired' and sent each time.

Client side Key Word Filtering

A common sense solution to needlessly burning tokens when you know Claude (using the pre-prompt) is going to reject the input (per the pre-prompt instructions), is to have some key word filtering on the client side.

Highly suggest turning off both the keyword filtering and the System pre Prompt and watching the behavior (carefully examine the Server Output). Very interesting stuff.

Architecture Overview

This is also explained in the README...suggest you review that as well.

🎯 Claude Chat Communication Path
Claude chat goes THROUGH the mcp-server-manager.js - it does NOT communicate directly with lifx-api-mcp-server.js

Here's the flow:

📋 Communication Chain:

🔄 Step-by-Step Process:

Let's explain the fundamental technical constraints that make the middle layer necessary.

🚫 Why Vue Frontend Can't Talk Directly to MCP Server

1.JSON-RPC Protocol Mismatch
The LIFX MCP Server uses JSON-RPC over stdio (standard input/output streams), not HTTP: This is how the MCP servers communicate:

		process.stdin  // Receives JSON-RPC requests
		process.stdout // Sends JSON-RPC responses

Web browsers (and Vue.js) cannot directly communicate with stdio streams of external processes. Browsers can only make HTTP requests, WebSocket connections, or similar web protocols.

2.Process Management Limitation
The LIFX MCP Server is a Node.js child process that needs to be:

Backend Server

This was one of the non-intuitive parts of the project (at least for me).

mcp-server-manager.js

Highly suggest turning off the backend server in your project root and observing the behavior of the app.

	pkill -f "mcp-server-manager.js

To restart the backend server:

server && node mcp-server-manager.js
Backend Server Control Indicator

In the upper right hand corner of the app there is an indicator if the backend server is running.

Lifx MCP Server

I found this up on MCP.so web site, and shamelessly borrowed it for this project.
This MCP server from James Furey seems to be working great. Note that James also used AI to generate this MCP server.

https://mcp.so/server/lifx-api-mcp-server/furey?tab=content

GitHub link:
https://github.com/furey/lifx-api-mcp-server

Highly suggest reviewing the README from James that is within the MCP server folder...it's very well put together.

Burke Holland Roll Your Own MCP

I just have to mention this guy...he has some great stuff. The following video got me started down this MCP rabbit hole.

Burke explains how you can use the CoPilot Agent mode to roll-your-own Lifx MCP server by:
A. copying the MCP protocol guidelines into an markdown file.
B. and copying the Lifx API specs into an markdown file.
Then directing the Claude AI Agent to review both the md files and generating an MCP sever.

Highly suggest review this video:
https://www.youtube.com/watch?v=yUaz89m1M5w