К основному содержанию
скилл CX Codex

tanstack — скилл для Claude Code: возможности и установка

Скилл помогает писать React-код с TanStack Query, Router и Form. Пригодится, когда вы меняете работу с данными, маршрутами или формами.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add pedronauck/skills --skill tanstack -a claude-code
Открыть на GitHub

Что делает tanstack

Скилл подсказывает, какие справочные файлы читать для конкретного изменения: отдельно для ключей и кеширования Query, загрузки данных Router или валидации Form. Смежные материалы подключаются, когда задача затрагивает несколько частей. В охват входят Query, Router и Form; TanStack Start, DB и сторонние библиотеки состояния или маршрутизации не рассматриваются.

Для Query описаны запросы, мутации, SSR и обработка ошибок. Для Router — типизация, загрузчики и навигация, для Form — хуки, Zod и компоненты полей. Ключи Query должны включать все зависимости и содержать только сериализуемые значения, иначе этот подход к кешу придётся пересмотреть. Скилл также напоминает откатывать оптимистичные изменения кеша и вызывать throw redirect(...) в Router.

Какие задачи решает

  • подобрать файл со справкой для изменения Query
  • настроить ключи и кеширование запросов
  • загрузить данные в маршруте через Router
  • проверить валидацию формы с Zod

Примеры запросов агенту

  • Проверь ключи Query и кеширование в этом изменении.
  • Добавь загрузку данных для маршрута через Router.
  • Настрой валидацию полей формы с Zod.

Как установить tanstack

1Через Skills CLI (Vercel)

npx skills add pedronauck/skills --skill tanstack -a claude-code

2Вручную: положить файлы

~/.claude/skills/tanstack/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/tanstack/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о tanstack

Как установить tanstack в Claude Code?

Выполните npx skills add pedronauck/skills --skill tanstack -a claude-code. Файл скилла находится по пути ~/.claude/skills/tanstack/SKILL.md.

Что делает tanstack?

Скилл помогает вносить изменения в React-код с TanStack Query, Router и Form, подбирая справочные материалы по затронутой части.

Какие библиотеки охватывает tanstack?

TanStack Query, TanStack Router и TanStack Form. TanStack Start, DB и другие библиотеки состояния или маршрутизации за пределами охвата.

Похожие скиллы

Всё по теме «Фронтенд и UI» →
frontend-design официальный anthropics Скилл задаёт осмысленное визуальное направление для новых интерфейсов и редизайна. Подойдёт, когда стандартный шаблонный UI не устраивает. 1 025 790установок design-taste-frontend Leonxlnx Скилл задаёт арт-дирекцию для публичных страниц и рабочих экранов, а затем проверяет результат в браузере по скриншотам. Нужен, когда интерфейс выглядит шаблонным или недоработанным. CX Codex +1 678 700установок prototype Matt Pocock Создаёт временный прототип, чтобы проверить логику, модель состояния или вид интерфейса до работы над основным кодом. 986 201установок hyperframes heygen-com Скилл задаёт агенту правила рендера HTML-кода в видео через HyperFrames. Помогает собирать проморолики, эксплейнеры и титры прямо в коде проекта. CX Codex +1 1 200 000установок hyperframes-cli heygen-com Управляет проектами HyperFrames через терминал: собирает таймлайн, проверяет контраст кадров, запускает предпросмотр и рендерит видео локально или в облаке. CX Codex +1 1 300 000установок webapp-testing официальный anthropics Скилл запускает проверки локальных веб-приложений через Playwright: помогает отлаживать UI, делать скриншоты и смотреть логи браузера. 186 758установок

Из того же набора18

electron-builder Настраивает сборку десктопных приложений на Electron под Windows, macOS и Linux. Помогает с подписью кода, выпуском релизов и автоматическими обновлениями. CX Codex +1 392установок next-best-practices Скилл с набором правил Next.js: файловые конвенции, границы RSC, async API, метаданные, обработка ошибок. Пригодится, когда агент пишет или ревьюит код на Next.js. CX Codex +1 383установок git-rebase Переносит коммиты на новую базу и разбирает конфликты по одному, не трогая чужие изменения. Пригодится, когда ветка отстала и её надо подтянуть под актуальный target. CX Codex +1 376установок shadcn Задаёт правила сборки интерфейсов на shadcn/ui и Radix UI. Помогает агенту сохранять поддержку тем оформления и доступность экранов. CX Codex +1 369установок zustand Скилл для ИИ-агента, который подсказывает паттерны Zustand: структуру сторов, селекторы, middleware и персистентность. CX Codex +1 353установок brand-storytelling Помогает собрать историю бренда: позиционирование, питч, фреймворк сообщений. Пригодится, когда компания рассказывает о себе, а запоминается только список фич. CX Codex +1 334установок hormozi-ad-factory Раскладывает рекламное объявление на хук, тело и призыв к действию, а потом перемножает заготовки: из одного продукта выходит от 150 до 750 вариантов для тестов. CX Codex +1 333установок to-prompt Собирает бриф по задаче и сохраняет его файлом в docs/prompts/, чтобы другой LLM мог реализовать задуманное. CX Codex +1 332установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой