What Is MCP? — How AI Talks to Your Tools

So far, we’ve installed Claude Code, recorded context with CLAUDE.md, built our first screen, and looked at what to watch out for as a project grows. In this post, we introduce MCP (Model Context Protocol), which connects the AI to external tools so it can work far more powerfully.

What Is MCP

To understand the term MCP, let’s first look at the words Model and Protocol. The “model” here refers to an AI entity as the term is used in the AI industry — the same “model” as in “language model (LM).” And a “protocol” is an agreement, a set of rules, for communication between different systems. So MCP is a protocol for supplying context to a model.

MCP was released in late 2024 by Anthropic, the maker of Claude. It’s now the industry-standard way for models to communicate, supported not just by Claude Code but by a wide range of AI tools. Once you connect MCP, the AI can directly pull information from external services (documentation sites, browsers, databases, collaboration tools, and more) or perform actions on them — so your tools and data work together as one integrated system.

	Without MCP	With MCP
What the AI can know	The conversation, open files	External service data too
How it works	Writes code only	Can look up and modify external services
Example	”Fix this function"	"Find the latest docs for this library and apply them exactly”

In other words, MCP is like an expansion slot that gives the AI extra hands and eyes.

What Kinds of MCP Can You Connect?

There are many kinds of MCP servers. Here are some go-to examples that are especially useful when you’re just getting started with vibe coding.

MCP Server	What It Does
Context7	Pulls up-to-date official docs for libraries/frameworks so code is written with the correct API
Playwright	Opens a real browser to click through and test the screens you’ve built
Filesystem	Reads and writes files in a folder you specify
GitHub	Looks up issues/PRs and repository information

Beyond these, there are MCPs for databases, design tools, project-structure tracking services, and more. We mentioned MCP earlier when introducing Umtri.io — connect it, and the AI can directly check the node structure, bugs, and history registered there and fold them into new plans, carrying the whole thing through as if it were a single service.

Connecting an MCP to Claude Code

You connect them in the terminal with the claude mcp add command. Each server connects a little differently (running locally, or reaching a remote URL), and the exact command is spelled out in the official docs or that service’s own instructions.

For example, connecting a remote server (over HTTP) looks like this. The YOUR_TOKEN part is a token issued by services that require a login.

claude mcp add <name> \
  --transport http \
  --url https://example.com/mcp \
  --header "Authorization: Bearer YOUR_TOKEN"

For a server that runs locally, it looks like this.

claude mcp add <name> -- npx -y <server-package>

Running the command registers that MCP server with Claude Code, and from then on the connection activates automatically every time you run Claude Code.

Verifying the connection

Start Claude Code and type /mcp to see the list of currently connected MCP servers and their status.

Keep Your Auth Tokens Safe

Some MCP servers require a login and ask for an API token. Since this token grants access to your account, putting it directly in a code file risks exposing it publicly on places like GitHub.

The safe way to manage a token is with an environment variable.

# Create a .env file
echo "SERVICE_TOKEN=your_token_here" > .env

# Add it to .gitignore so it doesn't get pushed to git
echo ".env" >> .gitignore

Then, in the MCP registration command, reference the environment variable instead of pasting the token value directly.

When Is a Good Time to Add an MCP?

You don’t need to connect several MCPs from the start. Basic development gets going just fine with Claude Code and CLAUDE.md alone. A good approach is to add “one MCP that removes a pain point” whenever a pain point actually shows up.

The AI keeps getting a library’s API wrong → connect Context7 for up-to-date docs
Checking your screens by hand every time is tedious → use Playwright for browser testing
Your project has grown and you want to track structure/history automatically → look into a dedicated-service MCP

In the next post, we cover how to get exactly what you want from the AI — that is, prompt engineering.