NeVibeCode · 2 909 карточек
Скиллы по теме «Фронтенд и UI»
Скиллы по теме «Фронтенд и UI»: у каждой карточки — что делает, команда установки и примеры запросов.
mapbox-web-integration-patterns скилл Официальные паттерны встраивания Mapbox GL JS в React, Vue, Svelte, Angular и на чистом JavaScript. Пригодится, когда карта течёт по памяти или не инициализируется в нужном хуке.
CX Codex +1
2 600установок
svg-animation скилл Скилл для анимации SVG: отрисовка штриха, морфинг форм, движение по пути, анимированные градиенты и фильтры. Пригодится, когда нужен самодостаточный HTML-файл с векторной анимацией.
CX Codex +1
2 500установок
60fps-animation скилл Переводит тяжёлые анимации CSS на transform и opacity для 60 кадров в секунду. Помогает убрать дёргания интерфейса, настроить технику FLIP и плавно анимировать height: auto.
CX Codex +1
2 600установок
accessible-animation скилл Скилл учит агента уважать prefers-reduced-motion: убирает опасное движение, но оставляет плавные переходы и подсказки интерфейса.
CX Codex +1
2 600установок
static-import скилл Объясняет синтаксис import в ES2015 и помогает решить, когда модуль стоит грузить сразу, а когда переключиться на динамический импорт.
CX Codex +1
1 400установок
prpl скилл Скилл обучает ИИ-агента паттерну PRPL для ускорения первой загрузки веб-приложений на слабых устройствах и медленных сетях.
CX Codex +1
1 400установок
tree-shaking скилл Скилл объясняет tree shaking и подсказывает агенту, как убрать неиспользуемые экспорты из JavaScript-бандла. Пригодится, когда сборка тянет лишнее.
CX Codex +1
1 400установок
route-based скилл Подсказывает агенту, как разбить SPA по маршрутам и грузить только тот код, который нужен на текущей странице. Пригодится, когда маршрутов много, а стартовая загрузка тормозит.
CX Codex +1
1 400установок
virtual-lists скилл Обучает агента технике виртуализации списков и таблиц в веб-приложениях. Помогает убрать задержки при скролле и ускорить начальную отрисовку страниц.
CX Codex +1
1 500установок
third-party скилл Подсказывает, как снизить влияние сторонних скриптов на загрузку страницы и Core Web Vitals, не выкидывая аналитику и виджеты.
CX Codex +1
1 500установок
import-on-visibility скилл Скилл учит агента откладывать загрузку компонентов и картинок до момента, когда пользователь доскроллит до них. Пригодится, если первый экран грузится слишком долго.
CX Codex +1
1 500установок
awwwards-animations скилл Скилл для React-анимаций уровня Awwwards и FWA: скролл, кастомные курсоры, переходы страниц, генеративная графика. Пригодится, когда нужен плавный 60fps-скролл и сложные эффекты.
CX Codex +1
2 900установок
imagen скилл Скилл генерирует изображения через модель Google Gemini и сохраняет их в проект. Пригодится, когда нужны иконки, плейсхолдеры или иллюстрации для документации.
CX Codex +1
626установок
senior-fullstack скилл Разворачивает каркасы веб-проектов на Next.js, FastAPI, Django или MERN и запускает статический аудит кодовой базы. Пригодится на старте сервиса или при ревизии качества кода.
CX Codex +1
311установок
maplibre-pmtiles-patterns скилл Помогает развернуть векторные и растровые тайлы PMTiles в MapLibre GL JS без тайлового сервера. Пригодится для хостинга карт в S3, Cloudflare R2 или GitHub Pages.
CX Codex +1
762установок
ui-design скилл Выбирает визуальное направление, пишет код интерфейса и проверяет готовый фронтенд на дефекты. Полезен, когда нужен лендинг, тёмная тема или разбор чужой вёрстки.
CX Codex +1
1 400установок
slide-deck скилл Собирает презентации в React/Next.js: черновик по брифу, правки существующей колоды, конвертация PPTX и экспорт в HTML, PDF или на Vercel.
CX Codex +1
342установок
mapbox-web-performance-patterns скилл Скилл учит ИИ-агента оптимизировать приложения на Mapbox GL JS: убирать каскадные задержки данных, уменьшать бандл стилей и переводить маркеры на GPU-слои.
CX Codex +1
2 500установок
cloud скилл Подключает AssistantCloud к приложению на assistant-ui: история тредов между сессиями, обратная связь по сообщениям и загрузка файлов.
CX Codex +1
5 000установок
gsap-web скилл Скилл помогает настраивать анимации на GSAP: от таймлайнов и ScrollTrigger до эффектов SplitText, Flip и плавной прокрутки с Lenis.
CX Codex +1
2 500установок
micro-interaction скилл Скилл для мелкой анимации интерфейса: ховеры, тоглы, тосты, шторки, перестановка списков. Пригодится, когда UI нужно оживить, а не украсить.
CX Codex +1
2 500установок
react скилл Скилл помогает писать и проверять компоненты и хуки React 19 с учётом React Compiler. Пригодится при настройке компилятора, работе с состоянием и тестами.
CX Codex +1
448установок
atomic-design-fundamentals скилл Помогает разложить компоненты интерфейса по уровням Atomic Design: от токенов до страниц. Пригодится, когда в проекте уже сотня компонентов и непонятно, куда класть новый.
CX Codex +1
766установок
tailwindcss скилл Скилл настраивает работу агента с Tailwind CSS v4. Он заставляет применять утилиты, проектные дизайн-токены и избегать динамической сборки имён классов.
CX Codex +1
447установок
gpt-taste скилл Заставляет агента сначала генерировать визуальные референсы страниц, детально их разбирать и только потом писать код фронтенда.
CX Codex +1
398установок
design-taste скилл Скилл помогает создавать и дорабатывать веб-интерфейсы, разбирая визуальную иерархию, типографику, цвет, отступы и анимацию. Пригодится для редизайна и ревью UI.
CX Codex +1
720установок
screenshot-to-code скилл Превращает скриншот, макет или экспорт из Figma в рабочий фронтенд-код и сверяет результат с картинкой. Пригодится, когда есть дизайн, но нет вёрстки.
CX Codex +1
1 300установок
tanstack-pacer скилл Скилл подсказывает агенту, как подключить TanStack Pacer: дебаунс, троттлинг, лимиты запросов, очереди и батчинг в одном пакете.
CX Codex +1
3 900установок
tanstack-start скилл Скилл помогает создавать и сопровождать приложения на фреймворке TanStack Start с потоковым SSR, серверными функциями и маршрутизацией.
CX Codex +1
3 900установок
responsive-testing скилл Скилл открывает приложение в браузере Cursor на пяти размерах экрана, делает скриншоты и сообщает, где вёрстка поехала.
CX Codex +1
561установок
langsmith-custom-apps скилл Скилл ведёт через жизненный цикл LangSmith Custom App: инициализация, локальная разработка, пуш и передача исходников наружу.
CX Codex +1
398установок
quick-game скилл Генерирует черновой играбельный прототип на Phaser или Three.js без графики, звука и полировки. Пригодится, когда нужно сразу запустить и проверить базовую механику.
CX Codex +1
866установок
meticulous-cli скилл Скилл обучает агента управлять утилитой Meticulous: запускать воспроизведение сессий, проверять визуальные регрессии и работать с диффами.
CX Codex +1
8 600установок
monetize-game скилл Регистрирует браузерную игру на Play.fun, подключает клиентский SDK с очками и таблицей лидеров, а затем выдаёт ссылку для игроков.
CX Codex +1
862установок
typescript скилл Скилл с 44 правилами по типам, tsconfig и async-коду. Пригодится, когда агент правит конфиг компилятора или разбирает сложные дженерики.
CX Codex +1
520установок
page-transition-animation скилл Скилл для анимации переходов между страницами в Next.js App Router и починки неработающего exit в Framer Motion AnimatePresence.
CX Codex +1
2 300установок
glassmorphism скилл Скилл для ИИ-агента, который добавляет в интерфейс матовое стекло: размытие фона, светлая кромка, слоистые тени и жидкое преломление.
CX Codex +1
2 400установок
meticulous-use-session-data скилл Скилл находит записанные сессии Meticulous под изменённый код ветки и скачивает их локально. Помогает изучить пользовательские сценарии и получить моки сетевых ответов для тестов.
CX Codex +1
8 500установок
meticulous-test скилл Запускает прогон Meticulous после правок во фронтенде и передаёт результат скиллу meticulous-review, чтобы разметить каждое визуальное изменение.
CX Codex +1
8 500установок
meticulous-iterative-dev скилл Ведёт многошаговую правку фронтенда и после каждого шага сверяет картинку с записанными сессиями Meticulous, чтобы регрессии всплывали сразу.
CX Codex +1
8 500установок
1 521–1 560 из 2 909