NeVibeCode · 2 909 карточек
Скиллы по теме «Фронтенд и UI»
Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов.
react-flow скилл Помогает ассистенту создавать интерактивные диаграммы и графы на базе @xyflow/react. Пригодится при настройке узлов, связей и управлении зумом.
CX Codex +1
1 300установок
adding-error-tracking скилл Скилл подключает Sentry к веб-приложению: ловит ошибки, считает трейсы и загружает source maps. Пригодится, когда нужен crash reporting без ручной настройки.
CX Codex +1
386установок
comparing-branches-visually скилл Разворачивает две ветки в отдельных worktree, поднимает оба дев-сервера на разных портах и делает скриншоты одних и тех же страниц для сравнения.
CX Codex +1
383установок
react-web скилл Скилл настраивает разработку веб-компонентов на React с обязательным подходом «сначала тесты». Срабатывает при создании и правке файлов в src/components, src/pages или с расширением .tsx.
CX Codex +1
339установок
static-rendering скилл Скилл объясняет статическую генерацию: какие страницы можно собрать в HTML заранее и как это сделать в Next.js. Пригодится, когда контент не меняется от запроса к запросу.
CX Codex +1
910установок
site-architecture скилл Настраивает техническое SEO сайта: файлы robots.txt, XML-карты, метатеги и индексацию страниц поисковиками и поисковыми ИИ-ботами.
CX Codex +1
336установок
iphone-duo-vertical-bars скилл Скилл подсказывает агенту, как перенести тулбары, навбары и таббары на боковую ось iPhone Duo и что для этого нужно в коде.
CX Codex +1
596установок
nextjs-shadcn скилл Скилл помогает агенту собрать интерфейс Next.js с shadcn/ui: выбрать шрифты, тему, фон и эффекты под задачу продукта.
CX Codex +1
835установок
adding-analytics скилл Помогает ассистенту внедрить PostHog в веб-приложение: от настройки провайдера до трекинга событий, веб-аналитики и флагов фич.
CX Codex +1
371установок
programmatic-seo скилл Помогает строить сотни однотипных SEO-страниц из шаблона и данных: города, сравнения, интеграции. Пригодится, когда нужен трафик по длинному хвосту.
CX Codex +1
419установок
streaming-ssr скилл Учит агента отдавать HTML чанками через renderToPipeableStream и Suspense. Пригодится, когда страница большая и ждать полной отрисовки перед первым байтом нельзя.
CX Codex +1
883установок
signup-flow-cro скилл Скилл для аудита и оптимизации воронок регистрации. Помогает сократить отток на формах, настроить социальные логины и сформулировать гипотезы A/B-тестов.
CX Codex +1
417установок
adding-stripe скилл Проводит агента по шагам подключения Stripe: SDK, ключи, checkout-сессия, вебхуки и портал управления подпиской.
CX Codex +1
369установок
slide-creator скилл Скилл верстает презентации формата 16:9 на HTML и CSS, а затем экспортирует их в PDF через headless Chromium.
CX Codex +1
4 100установок
adding-feature-flags скилл Настраивает фиче-флаги для поэтапного выката функций и A/B-тестирования через PostHog или переменные окружения.
CX Codex +1
361установок
tanstack-virtual скилл Скилл подсказывает агенту, как подключить TanStack Virtual и рисовать только видимые строки в больших списках, таблицах и сетках.
CX Codex +1
2 500установок
tailwindcss скилл Задаёт агенту стиль работы с TailwindCSS: утилитарные классы прямо в разметке, мобильный первым, тёмная тема через вариант dark:.
CX Codex +1
1 500установок
mobile-touch скилл Скилл для ИИ-агента, который помогает проектировать жесты, хаптику и анимации в iOS и Android. Пригодится, когда нужно оживить интерфейс без выдумывания таймингов с нуля.
CX Codex +1
2 400установок
playwright скилл Скилл для Playwright в Next.js: 45 правил по 8 категориям — от архитектуры тестов до отладки в CI. Пригодится, когда тесты падают через раз.
CX Codex +1
485установок
framer-motion скилл Скилл оптимизирует анимации Framer Motion в React: предотвращает лишние ререндеры, уменьшает размер бандла и настраивает переходы жестов или скролла.
CX Codex +1
1 100установок
react-native-moq скилл Скилл помогает писать и проверять код для live-видео, аудио и данных через MoQ relay в React Native. Нужен при работе с react-native-moq.
CX Codex +1
398установок
api-design скилл Скилл помогает проектировать и проверять публичные API библиотек на TypeScript, JavaScript, React и React Native.
CX Codex +1
609установок
maplibre-mapbox-migration скилл Помогает перевести веб-приложение с Mapbox GL JS на открытую библиотеку MapLibre GL JS. Пригодится при отказе от коммерческой лицензии и смене источников тайлов.
CX Codex +1
464установок
sap-fiori-add-visual-filter скилл Добавляет визуальные фильтры с графиками в панели фильтрации Fiori Elements на базе CAP или ABAP RAP. Помогает прописать агрегацию и аннотации CDS без ручных ошибок в синтаксисе.
CX Codex +1
603установок
typescript-react-reviewer скилл Скилл для ревью кода на TypeScript и React 19: находит антипаттерны, ошибки хуков и проблемы типизации. Пригодится перед мержем PR.
CX Codex +1
9 000установок
css-animation-creator скилл Скилл для ИИ-кодинга, который помогает писать CSS-анимации, переходы, микроинтеракции и анимации по скроллу. Пригодится, когда нужно добавить движение в интерфейс без ручного подбора таймингов.
CX Codex +1
805установок
sap-fiori-app-development скилл Скилл задаёт агенту правила сборки SAP Fiori Elements: List Report, Object Page, Worklist, подключение к CAP или внешнему OData.
CX Codex +1
595установок
sap-fiori-analytical-chart скилл Скилл добавляет на страницу List Report в SAP Fiori Elements график по агрегированным данным и таблицу под ним. Нужен, когда отчёт просят показать диаграммой, а не строкой за строкой.
CX Codex +1
591установок
chart скилл Строит интерактивные графики на Apache ECharts: линии, столбцы, свечи, точки. Отдаёт готовую HTML-страницу и PNG-скриншот.
CX Codex +1
3 900установок
mapbox-ios-patterns скилл Официальные шаблоны интеграции Mapbox Maps SDK v11 в iOS-приложения на Swift, SwiftUI и UIKit. Пригодится, когда нужно добавить карту, маркеры или геоданные.
CX Codex +1
1 500установок
mapbox-mcp-devkit-patterns скилл Скилл описывает, как подключить Mapbox MCP DevKit Server к ИИ-ассистенту и работать со стилями, токенами и валидацией прямо в чате.
CX Codex +1
1 500установок
sap-fiori-eslint-plugin скилл Скилл настраивает, переносит и запускает ESLint с плагином @sap-ux/eslint-plugin-fiori-tools в проектах SAP Fiori. Пригодится, когда линтера в проекте нет или он сломан.
CX Codex +1
584установок
sap-fiori-create-cli скилл Даёт агенту доступ к CLI @sap-ux/create: генерация приложений SAP Fiori, добавление конфигов, конвертация проектов. Пригодится, если вы ведёте Fiori-проект и не хотите держать в голове флаги.
CX Codex +1
584установок
frontend-accessibility-best-practices скилл Скилл с 7 правилами доступности для React: семантическая вёрстка, скринридеры, клавиатура, настройки пользователя. Пригодится при сборке форм и интерактивных элементов.
CX Codex +1
863установок
css-architecture скилл Скилл для ИИ-агента, который помогает разложить CSS по методологиям BEM, SMACSS и CSS-in-JS. Пригодится, когда стили в проекте растут быстрее, чем вы успеваете их переименовывать.
CX Codex +1
959установок
pulsar-haptics скилл Скилл настраивает тактильный отклик через библиотеку Pulsar в мобильных и веб-приложениях. Он помогает внедрять пресеты, переносить код с expo-haptics и связывать виброотклик с макетами Figma.
CX Codex +1
380установок
animation-designer скилл Скилл для веб-анимаций: переходы страниц, появление компонентов, параллакс и микро-взаимодействия на Framer Motion и CSS.
CX Codex +1
1 900установок
aem-cli скилл Помогает запускать и настраивать Adobe AEM CLI для Edge Delivery Services, отлаживать сервер aem up, сертификаты и синхронизацию контента.
CX Codex +1
840установок
lorem-ipsum скилл Генерирует текст-рыбу через готовый Python-скрипт с точным контролем структуры, длины и формата. Помогает наполнить макеты интерфейсов или тестовые документы реалистичным контентом.
CX Codex +1
511установок
react-query скилл Задаёт агенту правила работы с React Query: кэширование, фоновые обновления, инвалидация запросов и оптимистичные апдейты.
CX Codex +1
1 400установок
1 721–1 760 из 2 909