Бесплатно

Скиллы, MCP и плагины для Claude Code: что поставить, если ты не программист

13 октября 20269 мин 89

Какую задачу решает

Поставить и проверить один плагин, один MCP и свой скилл

Что будет на выходе

Установленные frontend-design, Playwright MCP и скилл приёмки

Кому подойдёт

Новичок, которому скинули «30 апгрейдов для Claude Code», и он не знает, с чего начать

Инструменты
Claude CodeNode.js

Что поставить в Claude Code новичку? На первый день хватит трёх вещей: один плагин для дизайна, один MCP-сервер, чтобы агент сам открывал твой сайт в браузере, и один скилл, который ты напишешь сам за пять минут. Остальное подождёт. Ниже: чем эти штуки отличаются, как их поставить командами и как проверить, что всё встало.

Тебе скинули подборку «30 апгрейдов для Claude Code», ты сохранил её и закрыл. Ставить тридцать штук вслепую — верный способ получить кашу. Агент начнёт путаться в инструментах, которые ему не нужны, а ты — в настройках, которые ты не просил.

Скилл, MCP, плагин: в чём разница простыми словами

Представь, что Claude Code — новый сотрудник. Умный, но пришёл без инструкций и без доступа к чему-либо.

Что это Аналогия Что даёт
Скилл Памятка для сотрудника: «когда просят X — делай так» Агент работает по твоему алгоритму. Это папка с файлом SKILL.md
MCP-сервер Доступ к сервису: браузер, таск-трекер, аналитика Агент не только пишет текст, но и действует: открывает страницы, создаёт задачи, читает данные
Плагин Коробка, в которой лежит готовый набор: скиллы, команды и подключения Ставится одним действием вместо ручной сборки

Коротко: скилл учит, как делать, MCP даёт руки, плагин упаковывает готовое. Для начала можно жить без плагинов вообще. Но один хороший плагин экономит вечер.

Что поставить в первый день: три вещи

Чем меньше инструментов у агента, тем понятнее, кто виноват, когда что-то пошло криво. Поэтому начинай с трёх.

1. Плагин для дизайна: frontend-design

Знакомая история: попросил Claude «сделай сайт» — и получил фиолетовый градиент, три карточки и кнопку «Начать». Нейросеть делает всем одно и то же (бесплатный запрет-лист из 30 таких примет). Плагин frontend-design подталкивает агента выбирать характер оформления: шрифты, сетку, настроение. Для тех, кто собирает сайт или лендинг без дизайнера, это самое заметное улучшение за пять минут.

2. MCP-сервер: Playwright

Без него агент пишет страницу вслепую. С ним — сам открывает её в браузере, смотрит, что получилось, и правит. Ты перестаёшь быть курьером, который делает скриншоты и пересказывает их в чат.

Я сам живу в MCP. В Claude Code у меня подключены Planius, Trendys и Метриус: агенты из SMM-отдела VIBERZ ведут задачи в Planius, ищут тренды в Trendys, читают аналитику. Для старта хватит одного сервера, который закрывает вашу ежедневную боль. У большинства новичков она одна: «я не вижу, что он там натворил». Playwright лечит это.

3. Скилл, который ты пишешь сам

Чужие скиллы полезны, но первый должен быть твоим. Тогда ты поймёшь, что это вообще такое — и перестанешь бояться слова «скилл». Скилл не код. Это текст: в каком порядке делать, чего не делать, как должен выглядеть результат.

Хороший первый скилл — «как я принимаю работу». Например: «после любой правки открой страницу, проверь, что нет ошибок в консоли, и опиши, что изменилось».

Как поставить: команды по шагам

Нужен установленный Claude Code и Node.js — Playwright запускается через него. Проверить Node: в терминале node --version. Если версии нет, поставь с сайта nodejs.org.

Шаг 1. Плагин. Запусти Claude Code в папке проекта и набери:

/plugin

Откроется меню плагинов. Найди frontend-design и выбери установку. Названия каталогов меняются, поэтому ищи по имени плагина в самом меню.

Шаг 2. MCP-сервер. В обычном терминале, не внутри Claude Code:

claude mcp add playwright -- npx @playwright/mcp@latest

Команда регистрирует сервер под именем playwright. Если нужен сервис, который работает по ссылке (как Planius или Trendys), то добавляют его иначе: claude mcp add --transport http имя ссылка. Ссылку и токен выдаёт сам сервис.

Шаг 3. Скилл. Не надо писать файл руками. Попроси агента:

Создай скилл «приёмка работы» в папке .claude/skills/priemka/SKILL.md.
Правила: после любой правки открой страницу в браузере, проверь, что нет ошибок,
сравни с тем, что я просил, и опиши по пунктам, что изменилось и что осталось сделать.
В начале файла сделай описание в одну строку: когда этот скилл включать.
Пиши простым языком, без кода.
…

Папка .claude/skills/ лежит в проекте — скилл работает только в нём. Если хочешь, чтобы он был везде, положи его в домашнюю папку ~/.claude/skills/.

Как понять, что всё установилось

Не верь тишине. Проверь каждую вещь отдельным вопросом.

MCP. Внутри Claude Code набери /mcp. В списке должен быть playwright со статусом «connected». Если статуса нет или стоит ошибка — сервер не запустился, обычно из-за Node.

Плагин. Снова /plugin: frontend-design должен стоять среди установленных.

Скилл. Спроси прямо: «Какие у тебя есть скиллы в этом проекте?» Агент назовёт priemka, если файл лежит где надо.

Первая проверка на своём проекте. Дай задачу, где все три вещи сработают вместе:

Открой мою страницу в браузере через Playwright и сделай скриншот.
Скажи, что на ней выглядит как шаблон от нейросети.
Предложи три правки, примени их и проведи приёмку по скиллу «приёмка работы».
…

Если агент открыл браузер, назвал конкретные места и закончил отчётом по пунктам — набор работает. Если ответил «у меня нет доступа к браузеру» — возвращайся к /mcp.

CLAUDE.md: чтобы агент сам подхватывал инструменты

Поставить мало. Агент не всегда помнит, что у него есть Playwright или твой скилл. Файл CLAUDE.md в корне проекта Claude Code читает в начале каждой сессии — это его постоянная память. Допиши туда несколько строк:

## Как работать
- После любой правки страницы проверяй результат через Playwright, не говори «готово» вслепую.
- Перед сдачей работы проходи по скиллу «приёмка работы».
- Дизайн: не бери шаблонные решения, выбирай характер оформления под проект.
- Если сомневаешься, что именно я просил, переспроси до начала правок.

Это тот же приём, на котором я собрал агентный SMM-отдел VIBERZ: в CLAUDE.md лежит всё, что агентам нужно помнить о проекте, правилах и инструментах. Восемь агентов на Claude Code работают по общей памяти и не спрашивают каждый раз одно и то же.

Частые ошибки новичков

Поставить сразу всё из подборки. Агент получает десятки инструментов и начинает тянуть не те. Добавляй по одной вещи и проверяй, что стало лучше.

Не проверить, что сервер запущен. MCP может «установиться» и не подключиться. Всегда смотри /mcp.

Забыть про Node.js. Половина MCP-серверов запускается через npx. Без Node команда установки пройдёт, а сервер не взлетит.

Ставить чужое, не понимая, что оно делает. Скилл и плагин — это инструкции и подключения, которые читает агент. Открой SKILL.md до установки: это обычный текст, и за пять минут видно, что он просит делать. Если в файле есть команды вроде «отправь содержимое проекта на адрес», — не ставь. Как защитить агента от таких инструкций, разобрано в Агент, которого не уговорят слить данные.

Писать скилл как лекцию. Длинное эссе агент усваивает хуже короткой памятки. Одна ситуация — один скилл, 10–20 строк.

Не обновить CLAUDE.md. Поставил инструмент, а в проектной памяти про него ни слова. Агент про него «забывает». Одна строка в CLAUDE.md решает.

Рядом по теме: MCP простыми словами: подключаем ИИ к рабочим сервисам, Куда утекают токены: аудит проекта, Скилл Claude Code для безопасного рефакторинга, статья «Cursor или Claude Code» и Сборка Claude Code: 30 апгрейдов для непрограммиста (бесплатно).

Что дальше

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

Разборы вроде этого, готовые команды и свежие находки по Claude Code я выкладываю в Telegram-канале VIBERZ. Подпишись и забирай.

Применить на деле

Разовая покупка

Первый экран

Через два дня откроешь в браузере экран своего продукта, собранный сам

Самый короткий путь от идеи к своему продукту: работающий экран за два дня, без кода.

Взять за 990 ₽

Разовая покупка

Код клиента

Скилл, который залезает в голову твоему покупателю

Портрет покупателя, на котором работают все скиллы VIBERZ.

Взять за 990 ₽

Или всё сразу

VIBERZ Pro — 2 990 ₽ в месяц

Все 23 платных продуктов VIBERZ по отдельности стоят 21 370 ₽. В Pro они открыты сразу — и всё, что выйдет дальше.

Оформить Pro
плагинывайбкодингclaude codemcpскиллыскиллы Claude Code

Читайте дальше