Front-End Checklist MCP
Front-End Checklist проверяет фронтенд-код и публичные страницы по 386 правилам доступности, SEO, скорости и безопасности.
- 74 722 ★ репозитория
- Последний коммит
- MIT
Минимальный доступ
Почему такой уровень
- Код и адреса страниц уходят на хостовый сервер, если не использовать локальный CLI.
Установка
- Работает в
В терминале, через SkillFoxx CLI
npx skillfoxx add mcp/front-end-checklistОпределит агенты на машине, покажет уровень доступа и зафиксирует версию.
Другие способы установки
Доступ и проверки
Как мы проверяемМинимальный доступИнструмент ничего не запускает и не ходит в сеть.
- Код и адреса страниц уходят на хостовый сервер, если не использовать локальный CLI.
Это чужой код. Посмотрите файлы в репозитории перед установкой.
Что делает
Front-End Checklist превращает популярный чек-лист веб-разработки в инструмент для агента. Через MCP-сервер агент ищет правила по ключевому слову, категории или приоритету, проверяет вставленный код HTML, CSS, JavaScript, React и Next.js и аудирует публичный `https://`-адрес. Те же правила доступны как навыки: есть сквозной навык общего аудита и отдельные навыки по одной теме, например `https`. Для терминала есть CLI `frontendchecklist` с командами `review`, `audit`, `search` и `rule`. Он работает без сети и печатает JSON, когда вывод идет в конвейер.
Для кого. Фронтенд-разработчикам и ревьюерам, которые хотят, чтобы агент сверял код с общим списком правил перед коммитом или релизом.
Подходит, если
- Перед пул-реквестом нужно проверить компонент React на доступность и скорость.
- Запуск сайта: агент проходит чек-лист по SEO, безопасности и изображениям.
- Публичную страницу конкурента или клиента аудируют по ее адресу.
- В ревью спорят о правиле, и агент берет формулировку с примером исправления.
Не подходит, если
- Нужна проверка закрытого стенда за авторизацией: аудит работает только с публичными `https://`-страницами.
- Вместо правил требуется автоматический линтер с исправлением файлов.
- Проект не про веб-интерфейс: бэкенд или мобильное приложение.
Пример запроса к агенту
Используй Front-End Checklist MCP: проверь этот компонент React и сначала назови самые уверенные находки.MCP
- Транспорт
- http, stdio
- Авторизация
- не нужна
Ограничения
Хостовый MCP-сервер получает код и адреса из запросов, поэтому закрытый код лучше проверять локальным CLI или stdio-сервером из репозитория. Результат говорит, что нарушено правило, но не заменяет ручной просмотр и тесты с помощниками чтения экрана. Клиенты иногда находят инструменты MCP лениво, поэтому в запросе стоит назвать сервер прямо. Правила на английском: 386 штук в 11 категориях. Навыки из `npx skills add` и хостовый сервер обновляются независимо, поэтому номера правил в ответах могут расходиться.
Как отключить. Удалите подключение `https://mcp.frontendchecklist.io` из настроек MCP клиента и снимите навыки, установленные через `npx skills`. Глобальный CLI удаляется обычным способом для вашего менеджера пакетов.
Частые вопросы
Какие инструменты MCP использовать первыми?
Для вставленного кода начните с `review_code`. `search_rules` ищет правила, `get_workflow` и `get_checklist_rules` ведут через аудит запуска, `audit_url` проверяет публичный адрес.
Как поставить навыки?
Выполните `npx skills add frontendchecklist/skills`. Одну тему можно взять отдельно: `npx skills add frontendchecklist/skills --skill https`.
Нужен ли ключ или регистрация?
Нет, публичный сервер работает без авторизации. Репозиторий под лицензией MIT, а локальный stdio-сервер лежит в `packages/mcp`.
Можно ли проверять страницу за логином?
Нет. `audit_url` принимает только публичные `https://`-страницы. Для закрытого кода используйте локальный CLI или вставляйте фрагменты в `review_code`.
Как использовать CLI без установки?
Запустите `npx -y @frontendchecklist/cli review <пути>`. CLI работает без сети и печатает JSON, когда вывод идет в конвейер.
Обсуждение
Вопросов и отзывов пока нет.
Похожие
MCP-серверыСканер доступности для агентов и CI: рендерит страницу в Chromium с axe-core или линтит исходники React, Vue и Angular.
Проверка по 147 правилам дизайна: находит признаки ИИ-интерфейса, чинит механические и передает остальное скиллу агента
Набор скиллов для аудита качества сайта: производительность, Core Web Vitals, доступность, SEO и лучшие практики по данным Lighthouse
Скилл проверяет интерфейс по 112 чек-листам Checklist Design или дает честную рецензию: иерархия, типографика, доступность.
Подключает агента к запущенному dev-серверу Next.js 16+: ошибки, маршруты, логи и путь к документации нужной версии
MCP-сервер и скилл для интерфейсов: 31 дизайн-система для shadcn/ui, принципы UI и UX и проверка доступности для кода агента
Сравнение с похожими
Карточки с тем же главным запросом: чем они отличаются.
| Инструмент | Официальный | Авторизация | Звезды репозитория | Главное отличие |
|---|---|---|---|---|
| Front-End Checklist (эта карточка) | нет | не нужна | 74 722 | |
| Web Quality Skills | нет | 3 079 | дает навыки качества веба; Front-End Checklist опирается на пронумерованную базу из 386 правил и отдает ее через MCP и CLI | |
| Frontend Design (Ilm-Alan) | нет | 167 | учит делать интерфейс выразительным; здесь проверяют готовый код по правилам |
Коротко о README
README объединяет сайт с правилами, хостовый MCP-сервер, навыки и сам чек-лист на 386 пунктов с приоритетами от критичных до низких.