screenshot
Take a screenshot of a URL or a local path (relative URL appended to http://localhost:3000).
LABSCO SUMMARY
The author calls it a tutorial demo, and that framing is right.
It is a small, readable example of five MCP tools rather than something to point at a production repository. Its own README flags the key-in-source pattern it demonstrates as unsuitable for production — set the variable in your client's MCP settings instead of committing it.
What it is
A TypeScript MCP server with five tools aimed at coding work: calling a reasoning model for a plan, working from a UI screenshot, reviewing a git diff, and reading one file or several.
What you get
- Code Architect — call an advanced reasoning model to produce plans and instructions for a coding agent
- Screenshot Buddy — take a UI design screenshot and use it with the composer agent
- Code Review — trigger a review from git diffs
- Read file and read multiple files — single-file reading for focused analysis, multi-file for bulk work
- One small source file per tool under
src/tools/, so the implementation is readable end to end
Requirements
Node with npm install and npm run build. An API key goes in src/env/keys.ts as OPENAI_API_KEY, or is set inline in your client's MCP interface — which the README recommends instead. Configure the client to run node against the built build/index.js.
Setup effort
Build from source — git clone https://github.com/yeakub108/mcp-server.git
USE CASES
01
Getting a plan before the agent starts typing
Send the problem to a reasoning model and get back instructions the coding agent can follow.
02
Turning a design screenshot into work
Capture the UI you want and hand it to the composer agent as the reference.
03
Reviewing what you just changed
Run a review off the git diff rather than re-reading the whole file.
04
Learning how an MCP server is put together
Read four small tool files and the entry point that registers the five tools they define.
5 tools
Listed in project code.
architect
Analyzes a task description plus some code, then outlines steps for an AI coding agent.
code-review
Run a git diff against main on a specified file and provide instructions to review/fix issues.
read_file
Read the contents of a single file
read_multiple_files
Read the contents of multiple files
BEFORE YOU INSTALL
What to know first
Tools you get
5 tools registered in the project's code.
Requires
Node.js with npm, to build it and run build/index.js
Where it runs
The documented client runs the server on your machine.
INSTALLATION
Connect your client
Server setup
TERMINAL
git clone https://github.com/yeakub108/mcp-server.git
cd mcp-serverCreate the file src/env/keys.ts containing export const OPENAI_API_KEY = "<YOUR_OPENAI_API_KEY>";
TERMINAL
npm install
npm run buildMCP Clients
Windsurf
WINDSURF · JSON
{
"mcpServers": {
"mcp-server": {
"command": "node",
"args": [
"D:\\mpc-server\\build\\index.js"
]
}
}
}D:\mpc-server\build\index.js is the author's own path — put the full path to build/index.js in your clone there.
