MCP-агент: Забудьте всё, что вы знали об LLM. Это — новый уровень

Перед вами MCP протокол — умный инструмент, который может рассуждать, создавать тексты и решать интеллектуальные задачи. Но что, если дать ему возможность "видеть" веб-страницы, рисовать дизайны или анализировать ваши файлы? Именно для этого и созданы MCP-серверы — они превращают текстового помощника в многофункциональный инструмент, способный взаимодействовать с реальным миром. Давайте разберемся, как это работает и почему это может быть полезно именно вам.

Введение: Что такое MCP и зачем он нужен?

MCP (Model Context Protocol) — это открытый протокол, разработанный компанией Anthropic, который позволяет языковым моделям, таким как Claude, подключаться к внешним инструментам и источникам данных. Представьте, что у вашего искусственного интеллекта появились "руки и ноги", которыми он может дотянуться до других программ и сервисов.

Простыми словами, MCP — это своеобразный "мост" между AI-ассистентом и внешним миром. Этот мост дает Claude возможность:

1. Искать актуальную информацию в интернете
2. Анализировать документы на вашем компьютере
3. Создавать дизайны в программах вроде Figma
4. Взаимодействовать с базами данных
5. Автоматизировать действия в браузере
6. И многое другое!

Если раньше Claude был похож на очень умного, но изолированного собеседника в закрытой комнате, то с MCP он получает "окна и двери" во внешний мир. Он может видеть то, что происходит сейчас, и активно взаимодействовать с другими инструментами.

Проблемы, решаемые MCP:

AI-модели, при всей их впечатляющей мощи, страдают от нескольких ограничений, которые MCP помогает преодолеть:

1. Устаревание информации

Claude знает только то, на чем его обучили до определенной даты. Но мир не стоит на месте! С MCP он может получить доступ к актуальным данным через поисковые системы и веб-скрапинг.

2. Отсутствие доступа к личным данным

Без MCP Claude не видит ваши файлы и не может работать с ними. С MCP он может (с вашего разрешения) читать документы, анализировать код и даже редактировать файлы на вашем компьютере.

3. Изоляция от других программ

Обычно AI-ассистенты работают в изоляции от других инструментов. MCP позволяет Claude "протянуть руку" и взаимодействовать с другими программами — от Figma до PostgreSQL.

4. Ограниченные возможности действия

Без MCP Claude может только генерировать текст. С MCP он может совершать реальные действия — создавать дизайны, скрапить сайты, автоматизировать браузер и многое другое.

Как работает MCP?

MCP устроен по принципу клиент-серверной архитектуры. Представьте, что Claude — это клиент, который может подключаться к разным специализированным "серверам навыков".

Схематично это работает так:

1. Вы устанавливаете MCP-сервер (например, для веб-скрапинга или работы с Figma)
2. Claude подключается к этому серверу через специальный протокол
3. Вы просите Claude выполнить задачу, требующую внешнего инструмента
4. Claude отправляет запрос соответствующему MCP-серверу
5. Сервер выполняет действие (например, скрапинг веб-страницы)
6. Результаты возвращаются Claude, который использует их для формирования ответа

Важный момент: MCP-серверы контролируют доступ к своим ресурсам и поддерживают четкие системные границы для безопасности. Вы всегда должны разрешить использование MCP для конкретного чата, что дает вам полный контроль над тем, к чему имеет доступ A.

Практическое применение MCP в Claude

Благодаря MCP-серверам, Claude превращается из простого текстового помощника в универсальный инструмент. Давайте рассмотрим, что он может делать с их помощью:

1. Работа с файловой системой

С помощью Filesystem MCP, Claude может:

1. Читать содержимое файлов на вашем компьютере
2. Анализировать код и документы
3. Находить файлы по заданным критериям
4. Создавать новые файлы и папки

Это превращает Claude в помощника для работы с документами и кодом.

2. Веб-скрапинг и анализ сайтов

С Firecrawl MCP, Claude может:

1. Анализировать содержимое любых веб-страниц
2. Извлекать данные из сайтов, даже если они используют JavaScript
3. Сравнивать информацию с разных ресурсов
4. Клонировать дизайн и структуру сайтов

Это делает Claude мощным инструментом для исследования интернета и сбора информации.

3. Дизайн в Figma

С Figma MCP, Claude превращается в помощника дизайнера:

1. Создает интерфейсы по текстовому описанию
2. Редактирует существующие дизайны
3. Анализирует файлы Figma и комментирует их
4. Экспортирует изображения из Figma

Достаточно описать словами, что вы хотите увидеть, и Claude воплотит это в визуальный дизайн.

4. Работа с базами данных

Claude может подключаться к базам данных PostgreSQL:

1. Изучать структуру базы данных
2. Выполнять запросы только для чтения
3. Анализировать данные и строить отчеты
4. Помогать с оптимизацией запросов

Это превращает его в помощника для аналитиков и разработчиков баз данных.

5. Поиск в интернете

С Brave Search MCP, Claude получает доступ к актуальной информации в интернете:

1. Ищет свежие новости и данные
2. Находит информацию по конкретным вопросам
3. Проверяет факты и утверждения
4. Исследует темы, выходящие за рамки его базовых знаний

Это делает ответы Claude более точными и актуальными.

6. Автоматизация браузера

Через Puppeteer MCP, Claude может:

1. Автоматизировать действия в браузере
2. Заполнять формы и нажимать кнопки
3. Делать скриншоты веб-страниц
4. Тестировать веб-приложения

Это превращает его в инструмент автоматизации и тестирования.

Как подключить MCP к Claude

Подключение MCP-серверов различается в зависимости от того, каким интерфейсом Claude вы пользуетесь. Рассмотрим основные варианты:

Подключение в Claude Desktop

1. Найдите или создайте файл конфигурации claude_desktop_config.json. На MacOS он обычно находится по пути ~/Library/Application Support/Claude/claude_desktop_config.json.
2. Добавьте в него настройки MCP-сервера в следующем формате:

{  "mcpServers": {    "имя_сервера": {      "command": "команда_для_запуска",      "args": ["аргумент1", "аргумент2"],      "env": {        "ПЕРЕМЕННАЯ_ОКРУЖЕНИЯ": "значение"      }    }  }}

1. Сохраните файл и перезапустите Claude Desktop.
2. При первом использовании MCP в чате, Claude попросит вашего разрешения на использование сервера.

Например, для подключения сервера файловой системы конфигурация будет выглядеть так:

{

  "mcpServers": {

    "filesystem": {

      "command": "npx",

      "args": [

        "-y",

        "@modelcontextprotocol/server-filesystem",

        "C:\\Users\\Mirage\\Desktop",

        "C:\\Users\\Mirage\\Downloads"

      ]

    }

  }

}

Давайте проверим работоспособность, сделав 1 пример.

Теперь вы можете взаимодействовать с файлами на вашем компьютере с помощью Claude. Примеры команд:

1. Создание файла: "Создай файл 'Заметки.txt' в папке 'Документы' с текстом 'Мои заметки'."

1. Поиск файлов: "Найди все файлы с расширением '.docx' в папке 'Работа'."

1. Чтение содержимого файла: "Покажи содержимое файла 'Список дел.txt' с рабочего стола."

При выполнении таких команд Claude будет взаимодействовать с MCP-сервером, который, в свою очередь, обращается к вашей файловой системе для выполнения запрошенных операций.

Подключение в Claude Code

Claude Code предлагает более удобный интерфейс командной строки для управления MCP-серверами:

Откройте терминал и используйте команду claude mcp add:

claude mcp add имя_сервера команда_для_запуска [аргументы]

Например, для подключения доступа к файловой системе:

claude mcp add filesystem -s user -- npx @modelcontextprotocol/server-filesystem ~/ ~/Desktop ~/Downloads ~/Documents

Вы можете указать область видимости сервера с помощью флага -s:

1. -s local (по умолчанию): Доступно только вам в текущем проекте
2. -s project: Доступно всем в проекте через файл .mcp.json
3. -s user: Доступно вам во всех проектах

Чтобы увидеть список всех установленных серверов, используйте команду:

claude mcp list

Подключение в Cursor

Cursor предлагает графический интерфейс для настройки MCP-серверов:

1. Откройте настройки Cursor (Settings).
2. Перейдите в раздел MCP Servers.
3. Нажмите "Add New MCP Server".

1. Введите необходимые данные для сервера (название, команду и аргументы).

1. Сохраните настройки.

Кейс-разбор 1 - используем Firecrawl

Firecrawl — это мощный MCP-сервер для веб-скрапинга, который позволяет Claude анализировать веб-страницы и извлекать из них информацию. В отличие от простых инструментов скрапинга, Firecrawl может работать с сайтами, использующими JavaScript для отображения контента.

Установка Firecrawl MCP

Шаг 1: Получение API-ключа Firecrawl

1. Зарегистрируйтесь на сайте Firecrawl (https://www.firecrawl.dev/)
2. После регистрации перейдите в дашборд, где вы найдете свой API-ключ.
3. Скопируйте этот ключ, он начинается с "fc-".

Шаг 2: Установка Firecrawl MCP

Для Claude Code

Откройте терминал и выполните следующую команду:

claude mcp add firecrawl -s user -- env FIRECRAWL_API_KEY=fc-YOUR_API_KEY npx -y firecrawl-mcp

Замените fc-YOUR_API_KEY на ваш настоящий API-ключ Firecrawl.

Если вы используете Windows и сталкиваетесь с проблемами, попробуйте:

claude mcp add firecrawl -s user -- cmd /c "set FIRECRAWL_API_KEY=fc-YOUR_API_KEY && npx -y firecrawl-mcp"

Для Claude Desktop, добавьте следующий блок в ваш файл claude_desktop_config.json:

{  "mcpServers": {    "firecrawl": {      "command": "npx",      "args": ["-y", "firecrawl-mcp"],      "env": {        "FIRECRAWL_API_KEY": "fc-YOUR_API_KEY",        "FIRECRAWL_RETRY_MAX_ATTEMPTS": "5",        "FIRECRAWL_RETRY_INITIAL_DELAY": "2000",        "FIRECRAWL_RETRY_MAX_DELAY": "30000",        "FIRECRAWL_RETRY_BACKOFF_FACTOR": "3",        "FIRECRAWL_CREDIT_WARNING_THRESHOLD": "2000",        "FIRECRAWL_CREDIT_CRITICAL_THRESHOLD": "500"      }    }  }}

Шаг 3: Проверка установки

Чтобы убедиться, что сервер успешно установлен, выполните:

claude mcp list

Вы должны увидеть "firecrawl" в списке доступных серверов.

Для Cursor процесс установки еще проще:

1. Откройте Cursor
2. Перейдите в Settings → MCP Servers
3. Нажмите "Add New MCP Server"
4. Введите имя (например, "firecrawl-mcp")
5. В поле Command введите: env FIRECRAWL_API_KEY=fc-YOUR_API_KEY npx -y firecrawl-mcp
6. Сохраните настройки

Использование Firecrawl с Cursor

Теперь, когда Firecrawl установлен, вы можете использовать его для различных задач. Вот несколько практических примеров:

Пример 1: Анализ новостного сайта

Попробуйте попросить Cursor:

"Используя Firecrawl, проанализируй главную страницу сайта ria.ru и расскажи, какие основные новости сегодня в топе."

Cursor подключится к Firecrawl MCP, который загрузит страницу, проанализирует ее содержимое и вернет список главных новостей. При этом Claude сможет извлечь заголовки, краткое содержание и, возможно, изображения.

Пример 2: Сравнение цен на товары

Попросите Cursor:

"С помощью Firecrawl, найди цены на MacBook Pro M2 1TB. Составь таблицу с ценами и доступностью"

Cursor использует Firecrawl для посещения каждого сайта, извлечения информации о ценах и доступности, а затем представит результаты в виде удобной таблицы.

Пример 3: Клонирование структуры веб-сайта

Более сложный пример — клонирование веб-сайта:

"Используя Firecrawl, проанализируй структуру и дизайн лендинг-страницы сайта yandex.ru/pogoda и создай HTML/CSS код для подобной страницы с прогнозом погоды."

Claude проанализирует сайт и создаст код, который воспроизводит его внешний вид и структуру.

Технические особенности Firecrawl

Firecrawl обладает рядом преимуществ по сравнению с обычными скраперами:

1. JavaScript-рендеринг: может работать с сайтами, которые генерируют содержимое через JavaScript
2. Автоматические повторные попытки: если сайт временно недоступен, Firecrawl автоматически повторит запрос
3. Экспоненциальный механизм отката: увеличивает время между повторными попытками для избегания блокировок
4. Пакетная обработка: может обрабатывать несколько URL одновременно
5. Мониторинг использования кредитов: отслеживает использование API для предотвращения перерасхода
6. Фильтрация содержимого: позволяет указать, какие теги HTML включать или исключать

Кейс-разбор 2 - используем Figma

Figma MCP — это сервер, который позволяет Claude взаимодействовать с популярной платформой для дизайна Figma. С его помощью AI может создавать и редактировать дизайны, просматривать существующие файлы Figma и даже экспортировать изображения

Установка Figma MCP

Существует два подхода к использованию Figma MCP.

1. Плагинный подход: позволяет Claude создавать дизайны с нуля через плагин Figma
2. API-подход: позволяет работать с существующими файлами Figma без открытия самого приложения

Шаг 1: Получение API-ключа Figma (для API-подхода)

1. Войдите в свой аккаунт Figma.
2. Нажмите на свое имя в левом верхнем углу и выберите "Settings" (Настройки).
3. Перейдите на вкладку "Security" (Безопасность).
4. Создайте новый личный токен доступа с разрешениями для "File content" и "Comments".
5. Скопируйте этот токен — он будет нужен для настройки MCP-сервера.

Шаг 2: Установка Figma MCP в Claude Code

Для установки сервера с помощью npx выполните следующую команду:

claude mcp add figma-mcp -s user -- npx -y claude-figma-mcp --stdio

Если вы хотите использовать API-подход, добавьте ваш API-ключ:

claude mcp add figma-mcp -s user -- npx -y claude-figma-mcp --stdio --figma-api-key ваш_api_ключ_figma

Для Claude Desktop добавьте следующий блок в ваш файл claude_desktop_config.json:

{  "mcpServers": {    "figma-mcp": {      "command": "npx",      "args": ["-y", "claude-figma-mcp", "--stdio"],      "env": {}    }  }}

Для API-подхода конфигурация будет выглядеть так:

{  "mcpServers": {    "figma-mcp": {      "command": "npx",      "args": ["-y", "claude-figma-mcp", "--stdio", "--figma-api-key", "ваш_api_ключ_figma"],      "env": {}    }  }}

Шаг 3: Настройка плагина Figma (только для плагинного подхода)

1. Откройте Figma и перейдите в меню → Plugins → Development → Import plugin from manifest...
2. Выберите файл figma-plugin/manifest.json из репозитория claude-figma-mcp.
3. Теперь плагин должен быть доступен в меню плагинов Figma.

Использование cursor-talk-to-figma-mcp с Cursor

После настройки Figma MCP вы можете использовать его с Cursor для различных задач дизайна. Вот несколько интересных примеров:

Пример 1: Создание прототипа страницы входа в Instagram на телефоне

Попросите Cursor:

"Используя cursor-talk-to-figma-mcp, создай прототип страницы входа в Instagram на телефоне. Прототип должен быть современным, минималистичным и интуитивно понятным. Включи в дизайн элементы: поля для ввода логина и пароля, кнопку входа, а также дополнительные ссылки для восстановления пароля и регистрации."

Cursor подключится к cursor-talk-to-figma-mcp и создаст прототип согласно вашим указаниям. Вы увидите, как он постепенно добавляет и настраивает элементы пользовательского интерфейса в Figma.

Пример 2: Создание экрана приложения

Попросите Cursor:

"С помощью Figma MCP, создай экран входа для мобильного приложения. Экран должен содержать логотип вверху, поля для ввода email и пароля, кнопку 'Войти' и опцию 'Забыли пароль'."

Cursor создаст дизайн экрана входа в соответствии с вашими инструкциями

Возможности cursor-talk-to-figma-mcp

Cursor-talk-to-figma-mcp предоставляет следующие инструменты:

GitHub репозиторий

Документ и выбор

1. get_document_info — Получить информацию о текущем документе Figma.
2. get_selection — Получить информацию о текущем выборе.
3. get_node_info — Получить подробную информацию о конкретном узле.
4. get_nodes_info — Получить подробную информацию о нескольких узлах, указав массив идентификаторов узлов.

Создание элементов

1. create_rectangle — Создать новый прямоугольник с указанием положения, размера и необязательного имени.
2. create_frame — Создать новый фрейм с указанием положения, размера и необязательного имени.
3. create_text — Создать новый текстовый узел с настраиваемыми свойствами шрифта.

Изменение текстового содержимого

1. set_text_content — Установить текстовое содержимое существующего текстового узла.

Стайлинг

1. set_fill_color — Установить цвет заливки узла (RGBA).
2. set_stroke_color — Установить цвет и толщину обводки узла.
3. set_corner_radius — Установить радиус угла узла с возможностью управления каждым углом.

Макет и организация

1. move_node — Переместить узел на новое место.
2. resize_node — Изменить размер узла с новыми размерами.
3. delete_node — Удалить узел.
4. clone_node — Создать копию существующего узла с необязательным смещением позиции.

Компоненты и стили

1. get_styles — Получить информацию о локальных стилях.
2. get_local_components — Получить информацию о локальных компонентах.
3. get_team_components — Получить информацию о компонентах команды.
4. create_component_instance — Создать экземпляр компонента.

Экспорт и расширенные возможности

1. export_node_as_image — Экспортировать узел как изображение (PNG, JPG, SVG или PDF).
2. execute_figma_code — Выполнить произвольный код JavaScript в Figma (использовать с осторожностью).

Управление подключением

1. join_channel — Присоединиться к определённому каналу для общения с Figma.

Где искать MCP-сервера

Экосистема MCP постоянно расширяется, появляются новые серверы с различными возможностями. Вот основные места, где можно найти MCP-серверы:

1. MCP.so

MCP.so — это специализированная платформа, которая собирает и организует сторонние MCP-серверы. Этот сайт служит центральным каталогом, где пользователи могут находить, делиться и узнавать о различных доступных MCP-серверах для AI-приложений.

На сайте представлены серверы с подробным описанием функциональности, инструкциями по установке и примерами использования.

2. GitHub

Многие MCP-серверы распространяются через GitHub. Вы можете найти их, выполнив поиск по ключевым словам "mcp server claude" или "model context protocol". Некоторые популярные репозитории включают:

1. claude-figma-mcp: MCP-сервер для работы с Figma
2. deepseek-claude-MCP-server: сервер для улучшения рассуждений Claude
3. mcp-server-firecrawl: сервер для веб-скрапинга
4. figma-mcp: альтернативная реализация для работы с Figma

3. Smithery

Smithery — это инструмент, который упрощает установку MCP-серверов. Он автоматизирует процесс настройки, что особенно полезно для начинающих пользователей. Пример команды для установки сервера с помощью Smithery:

npx -y @smithery/cli install @mendableai/mcp-server-firecrawl --client claude

Заключение

MCP-серверы — это революционная технология, которая значительно расширяет возможности Claude и других языковых моделей. Они превращают AI из пассивного собеседника в активного помощника, способного взаимодействовать с внешним миром и использовать различные инструменты.

Благодаря протоколу MCP, Claude, Claude Code и Cursor может:

1. Искать актуальную информацию в интернете
2. Анализировать веб-страницы и извлекать данные
3. Создавать дизайны в Figma
4. Работать с файлами на вашем компьютере
5. Взаимодействовать с базами данных
6. Автоматизировать действия в браузере

Хотя настройка MCP-серверов может показаться сложной для неопытных пользователей, результаты определенно стоят затраченных усилий. С каждым новым MCP-сервером, который вы подключаете, возможности Claude расширяются, открывая новые сценарии использования.

Важно помнить о безопасности при использовании MCP — всегда проверяйте источники серверов, которые устанавливаете, и внимательно следите за разрешениями, которые вы предоставляете AI-ассистенту. MCP предоставляет Claude доступ к внешним ресурсам, поэтому контроль доступа критически важен.

В ближайшем будущем мы, вероятно, увидим еще больше инноваций в этой области — новые MCP-серверы, более простые способы их настройки и более тесную интеграцию между AI и различными инструментами и сервисами. Экосистема MCP только начинает формироваться, и у нее огромный потенциал для трансформации того, как мы взаимодействуем с искусственным интеллектом. 

Если вы хотите разобраться, как работать и с другими инструментами ИИ для создания крутого контента, советую курс «Нейросети: быстрый старт». Не бойтесь экспериментировать! Подключите несколько MCP-серверов к вашему Claude и посмотрите, как расширяются его возможности. Возможно, вы найдете совершенно новые способы применения AI в своей работе или повседневной жизни.