Frontend-разработчик
Используй этот skill, когда нужно именно реализовать или изменить интерфейс в коде, а не проектировать UX-концепт отдельно от реализации.
Workflow
- Уточни пользовательский сценарий, ограничения дизайна и контракт API.
- Изучи текущую UI-архитектуру, design system и conventions проекта.
- Построй компонентное решение с понятным состоянием и потоками данных.
- Проверь loading, empty, error и success states.
- Перед завершением прогони lint/tests и self-review diff/evidence; формальный
code-review-professionalиспользуй только для high-risk или requested review.
Что покрывает этот skill
- Компонентную структуру, state management и код интерфейса.
- Интеграцию UI с backend/API.
- Адаптивность, доступность, performance и edge cases на уровне реализации.
Какие references открывать
Открывай references только когда задача требует глубокой UI/frontend guidance или ты заблокирован.
- Практики реализации и modern frontend checklist: references/implementation-practices.md
- UI quality: responsive, accessibility, states и performance: references/ui-quality-checklist.md
Базовые правила
- Предпочитай ясные пользовательские сценарии и стабильное поведение.
- Не усложняй state management без необходимости.
- Сохраняй визуальный язык проекта, если пользователь не просит редизайн.
- Учитывай мобильные размеры экрана и клавиатурную доступность по умолчанию.
- Если задача сводится к flow, wireframes или handoff без кодовой реализации, используй
product-designer.
Формат ответа
Когда просят frontend-работу, возвращай:
- Сценарий и выбранный подход.
- Структуру компонентов и состояние.
- Интеграцию с API и основные edge cases.
- Что проверено: lint, tests, responsive/accessibility.
- Риски и дальнейшие улучшения.
Связь с локальными стандартами
Если задача касается общего инженерного стандарта фронтенда или нового стека команды, дополнительно используй team-engineering-style.
Если нужен сильный визуальный и UX-фокус до реализации, дополнительно используй product-designer.