# Скиллы по теме «Фронтенд и UI» Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов. 2909 карточек · страница 32 из 73 - HTML: https://affpapa.org/nevibecode/skills/topic/frontend?page=32 - Инструкция для агента: https://affpapa.org/nevibecode/agents.md - [nextjs-code-review](https://affpapa.org/nevibecode/skills/nextjs-code-review.md) — скилл · giuseppe-trisciuoglio · Claude Code, Codex, Cursor +3 · 3800 установок — Проверяет код Next.js перед слиянием изменений: компоненты, серверные действия, кэш и маршруты. - [zod-validation-utilities](https://affpapa.org/nevibecode/skills/zod-validation-utilities.md) — скилл · giuseppe-trisciuoglio · Claude Code, Codex, Cursor +3 · 3800 установок — Помогает писать схемы Zod v4 для проверки API, форм и конфигурации в TypeScript. - [logo-animation](https://affpapa.org/nevibecode/skills/logo-animation.md) — скилл · iart-ai · Claude Code, Codex, Cursor +3 · 2800 установок — Скилл для ИИ-кодинга, который собирает анимацию логотипа: интро, сплэш, лоадер, отрисовку SVG-знака. - [color-motion](https://affpapa.org/nevibecode/skills/color-motion.md) — скилл · iart-ai · Claude Code, Codex, Cursor +3 · 2800 установок — Скилл помогает подбирать палитры для моушн-дизайна, строить градиенты в пространстве OKLCH и устранять выцветание рендеров After Effects из-за сдвига гаммы. - [experience-lwc-runtime-observe](https://affpapa.org/nevibecode/skills/experience-lwc-runtime-observe.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 2000 установок — Скилл запускает локальный предпросмотр компонентов LWC в Salesforce CLI и выгружает отрендеренный DOM для отладки. - [experience-lds-best-practices-apply](https://affpapa.org/nevibecode/skills/experience-lds-best-practices-apply.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 2000 установок — Проверяет и правит слой данных в Lightning Web Component: где хватит UIAPI, а где нужен Apex, и как не получить устаревшие данные после сохранения. - [experience-lwc-design-generate](https://affpapa.org/nevibecode/skills/experience-lwc-design-generate.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 2100 установок — Создаёт компоненты Lightning Web Components по макетам Figma или PRD. - [mvvm-toolkit-messenger](https://affpapa.org/nevibecode/skills/mvvm-toolkit-messenger.md) — скилл (официальный GitHub) · github · GitHub Copilot · 56 установок — Скилл для GitHub Copilot по Messenger из CommunityToolkit.Mvvm: связывает ViewModels через pub/sub, без прямых ссылок друг на друга. - [sentry-sdk-upgrade](https://affpapa.org/nevibecode/skills/sentry-sdk-upgrade.md) — скилл · getsentry · Claude Code, Codex, Cursor +3 · 3100 установок — Скилл помогает обновить Sentry JavaScript SDK между мажорными версиями, например с v7 до v8 или v9. - [sentry-react-sdk](https://affpapa.org/nevibecode/skills/sentry-react-sdk.md) — скилл · getsentry · Claude Code, Codex, Cursor +3 · 3100 установок — Скилл проводит через полную настройку Sentry в React-проекте: сканирует зависимости, предлагает набор функций и пишет конфиг. - [motion-principles](https://affpapa.org/nevibecode/skills/motion-principles.md) — скилл · AThevon · Claude Code, Codex, Cursor +3 · 1100 установок — Скилл задаёт правила интерфейсной анимации: безопасные свойства, тайминги, кривые разгона и режим reduced-motion для веба, SwiftUI и Jetpack Compose. - [nextjs-deployment](https://affpapa.org/nevibecode/skills/nextjs-deployment.md) — скилл · giuseppe-trisciuoglio · Claude Code, Codex, Cursor +3 · 3700 установок — Готовит конфигурацию для деплоя Next.js в продакшен. - [nextjs-data-fetching](https://affpapa.org/nevibecode/skills/nextjs-data-fetching.md) — скилл · giuseppe-trisciuoglio · Claude Code, Codex, Cursor +3 · 3700 установок — Скилл даёт готовые паттерны выборки данных в Next.js App Router: от серверных компонентов и ISR до интеграции с SWR и React Query. - [flowchart-creator](https://affpapa.org/nevibecode/skills/flowchart-creator.md) — скилл · mhattingpete · Claude Code, Codex, Cursor +3 · 735 установок — Скилл собирает блок-схемы и деревья решений в один HTML-файл с SVG. - [shopify](https://affpapa.org/nevibecode/skills/mrgoonie-shopify.md) — скилл · mrgoonie · Claude Code, Codex, Cursor +3 · 450 установок — Скилл для разработки под Shopify: приложения, расширения чекаута и админки, темы на Liquid, работа с GraphQL и REST API. - [better-auth](https://affpapa.org/nevibecode/skills/better-auth.md) — скилл · giuseppe-trisciuoglio · Claude Code, Codex, Cursor +3 · 3600 установок — Скилл с готовыми шаблонами Better Auth: подключение к NestJS, Drizzle ORM и PostgreSQL, вход через соцсети и плагины вроде 2FA и passkey. - [experience-lds-graphql-generate](https://affpapa.org/nevibecode/skills/experience-lds-graphql-generate.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 1900 установок — Скилл строит GraphQL-запросы и мутации к Salesforce LDS по схеме вашей org и встраивает их в Lightning Web Component. - [experience-aura-lwc-migrate](https://affpapa.org/nevibecode/skills/experience-aura-lwc-migrate.md) — скилл · forcedotcom · Claude Code, Codex, Cursor +3 · 1900 установок — Скилл анализирует бандлы компонентов Salesforce Aura и составляет спецификацию PRD для их переноса на LWC. - [localize](https://affpapa.org/nevibecode/skills/localize.md) — скилл · ghaida · Claude Code, Codex, Cursor +3 · 2700 установок — Адаптирует интерфейс под разные культуры и языки: от рендеринга RTL до соответствия GDPR и PIPL. - [include](https://affpapa.org/nevibecode/skills/include.md) — скилл · ghaida · Claude Code, Codex, Cursor +3 · 2700 установок — Внедряет правила доступности и требования стандарта WCAG 2.2 в интерфейсные решения до начала вёрстки. - [fortify](https://affpapa.org/nevibecode/skills/fortify.md) — скилл · ghaida · Claude Code, Codex, Cursor +3 · 2700 установок — Скилл для проработки нештатных сценариев интерфейса: пустых экранов, сетевых сбоев, частичной загрузки данных и ошибок валидации. - [web-testing](https://affpapa.org/nevibecode/skills/web-testing.md) — скилл · mrgoonie · Claude Code, Codex, Cursor +3 · 442 установки — Скилл для веб-тестирования: юнит, интеграция, E2E, нагрузка, безопасность, визуальные регрессии и доступность. - [mantine-custom-components](https://affpapa.org/nevibecode/skills/mantine-custom-components.md) — скилл · mantinedev · Claude Code, Codex, Cursor +3 · 3600 установок — Скилл учит ИИ-агента создавать компоненты для Mantine 9.x по официальным паттернам библиотеки. - [ecommerce-landing-page](https://affpapa.org/nevibecode/skills/ecommerce-landing-page.md) — скилл · nexscope-ai · Claude Code, Codex, Cursor +3 · 1300 установок — Аудирует посадочные страницы интернет-магазинов и готовит план по росту конверсии: разбирает первый экран, призывы к действию, социальные доказательства и гипотезы для A/B-тестов. - [vite-flare-starter](https://affpapa.org/nevibecode/skills/vite-flare-starter.md) — скилл · jezweb · Claude Code, Codex, Cursor +3 · 1200 установок — Скилл разворачивает полное приложение на Cloudflare Workers из шаблона vite-flare-starter: React, Hono, D1 с Drizzle, авторизация и Workers AI. - [motion-background](https://affpapa.org/nevibecode/skills/motion-background.md) — скилл · iart-ai · Claude Code, Codex, Cursor +3 · 2700 установок — Скилл учит агента создавать ненавязчивые анимированные фоны: лёгкие градиенты на CSS и частицы на холсте. - [macos-patterns](https://affpapa.org/nevibecode/skills/macos-patterns.md) — скилл · fayazara · Claude Code, Codex, Cursor +3 · 670 установок — Подсказывает нативные паттерны macOS при создании приложений: меню в строке меню, окна, фокус и системные API. - [sentry-browser-sdk](https://affpapa.org/nevibecode/skills/sentry-browser-sdk.md) — скилл · getsentry · Claude Code, Codex, Cursor +3 · 2900 установок — Скилл проводит агента через полную настройку Sentry в браузерном JavaScript: проверяет проект на фреймворки, выбирает способ установки и подключает нужные функции. - [msw-ui-system](https://affpapa.org/nevibecode/skills/msw-ui-system.md) — скилл · MSW-Git · Claude Code, Codex, Cursor +3 · 9700 установок — Направляет агента при сборке интерфейсов для MapleStory Worlds: создаёт разметку .ui, настраивает компоненты и генерирует привязки для скриптов .mlua. - [mantine-combobox](https://affpapa.org/nevibecode/skills/mantine-combobox.md) — скилл · mantinedev · Claude Code, Codex, Cursor +3 · 3500 установок — Помогает агенту собирать выпадающие списки, автокомплиты и мультиселекты на примитивах Combobox из Mantine 9.x. - [horizontal-scroll-scenes](https://affpapa.org/nevibecode/skills/horizontal-scroll-scenes.md) — скилл · MengTo · Claude Code, Codex, Cursor +3 · 367 установок — Скилл для сцен, которые едут слева направо, пока пользователь скроллит вниз. - [motion-effects](https://affpapa.org/nevibecode/skills/motion-effects.md) — скилл · charlie947 · Claude Code, Codex, Cursor +3 · 1500 установок — Собирает один из 16 моушн-эффектов в вашем бренде как зацикленный HTML-файл на 8 секунд, который покадрово выгружается в MP4 или GIF. - [typegpu](https://affpapa.org/nevibecode/skills/typegpu.md) — скилл · software-mansion-labs · Claude Code, Codex, Cursor +3 · 1600 установок — Скилл для работы с TypeGPU в TypeScript: шейдеры, буферы, пайплайны и хуки @typegpu/react без ручной сверки типов. - [mobile-responsiveness](https://affpapa.org/nevibecode/skills/mobile-responsiveness.md) — скилл · hoodini · Claude Code, Codex, Cursor +3 · 1400 установок — Скилл помогает создавать адаптивные интерфейсы по принципу mobile-first, настраивать брейкпоинты, жесты смахивания и мобильное меню. - [macos-settings-ui](https://affpapa.org/nevibecode/skills/macos-settings-ui.md) — скилл · fayazara · Claude Code, Codex, Cursor +3 · 650 установок — Собирает окно настроек для нативного macOS-приложения на SwiftUI: сайдбар, панели с Form и стеклянная отделка окна в духе macOS 26. - [graphql-operations](https://affpapa.org/nevibecode/skills/graphql-operations.md) — скилл · apollographql · Claude Code, Codex, Cursor +3 · 3600 установок — Скилл для написания GraphQL-операций: запросы, мутации, подписки и фрагменты по правилам проекта. - [tanstack-query](https://affpapa.org/nevibecode/skills/tanstack-query.md) — скилл · tanstack-skills · Claude Code, Codex, Cursor +3 · 9900 установок — Скилл подсказывает агенту, как работать с TanStack Query v5: кэширование, инвалидация, мутации и оптимистичные обновления. - [remotion-video](https://affpapa.org/nevibecode/skills/remotion-video.md) — скилл · iart-ai · Claude Code, Codex, Cursor +3 · 2600 установок — Скилл для сборки MP4, GIF и WebM прямо в React: каждый кадр — чистая функция от useCurrentFrame, поэтому рендер детерминированный и повторяемый. - [design-audit](https://affpapa.org/nevibecode/skills/design-audit.md) — скилл · AThevon · Claude Code, Codex, Cursor +3 · 1000 установок — Проверяет код фронтенда на проблемы с анимацией, доступностью и дизайн-токенами. - [threejs-r3f](https://affpapa.org/nevibecode/skills/threejs-r3f.md) — скилл · AThevon · Claude Code, Codex, Cursor +3 · 1000 установок — Скилл по Three.js и React Three Fiber: правила сцен, хуков, постобработки и производительности. Дальше: https://affpapa.org/nevibecode/skills/topic/frontend.md?page=33 ## Уточнить [react](https://affpapa.org/nevibecode/tag/react.md) · [ui](https://affpapa.org/nevibecode/tag/ui.md) · [typescript](https://affpapa.org/nevibecode/tag/typescript.md) · [css](https://affpapa.org/nevibecode/tag/css.md) · [animation](https://affpapa.org/nevibecode/tag/animation.md) · [accessibility](https://affpapa.org/nevibecode/tag/accessibility.md) · [design-system](https://affpapa.org/nevibecode/tag/design-system.md) · [nextjs](https://affpapa.org/nevibecode/tag/nextjs.md) · [tailwind](https://affpapa.org/nevibecode/tag/tailwind.md) · [javascript](https://affpapa.org/nevibecode/tag/javascript.md) · [webgl](https://affpapa.org/nevibecode/tag/webgl.md) · [typography](https://affpapa.org/nevibecode/tag/typography.md) ## Сузить этот список Параметры: `?platform=`, `&topic=<…>`, `&sort=installs|stars|new|updated` — значения в https://affpapa.org/nevibecode/agents.md --- NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md