react-development — скилл для Claude Code: React по докам react.dev
Скилл для ИИ-агента: подсказывает, как писать компоненты, хуки, состояние и эффекты в React по официальной документации.
npx skills add manutej/luxor-claude-marketplace --skill react-development -a claude-codeЧто делает react-development
Скилл добавляет агенту справочник по React: функциональные компоненты, JSX, пропсы, useState, useEffect, работа с объектами и массивами в состоянии, композиция компонентов. Внутри — примеры кода из документации react.dev, привязанной через Context7. Когда вы просите написать форму, список задач или загрузку данных, агент опирается на эти примеры, а не на память модели.
Ставится одной командой через npx skills add. Скилл кладётся в папку платформы: в Claude это ~/.claude/skills/react-development/SKILL.md, в Cursor — .cursor/skills/react-development/SKILL.md, в Codex — .agents/skills/react-development/SKILL.md. Для GitHub Copilot установка идёт через gh skill install.
Учтите: описание покрывает хуки, состояние, контекст и оптимизацию производительности, но примеры в файле обрываются на загрузке данных через useEffect — по продвинутым темам агент будет опираться на общие знания. Скилл про React, а не про конкретный фреймворк поверх него: про Next.js или Remix здесь ничего нет, поэтому в таких проектах он закрывает только базовый слой.
Какие задачи решает
- написать форму с контролируемыми полями и обработкой отправки
- заменить классовый компонент на функциональный с хуками
- собрать список с ключами и удалением элементов
- вынести повторяющуюся логику в кастомный хук
- починить эффект, который срабатывает слишком часто
Примеры запросов агенту
- Напиши компонент формы с полями name и email через useState
- Переделай этот классовый компонент на хуки
- Покажи, как загрузить данные пользователя в useEffect с обработкой ошибок
Как установить react-development
1Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill react-development -a claude-code2Вручную: положить файлы
~/.claude/skills/react-development/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/react-development/
1Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill react-development -a codex2Вручную: положить файлы
.agents/skills/react-development/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill react-development -a cursor2Вручную: положить файлы
.cursor/skills/react-development/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install manutej/luxor-claude-marketplace react-development2Вручную: положить файлы
.github/skills/react-development/SKILL.md1Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill react-development -a gemini-cli2Командой платформы
gemini skills install https://github.com/manutej/luxor-claude-marketplace --path plugins/luxor-frontend-essentials/skills/react-developmentВручную: положить файлы
.devin/skills/react-development/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add manutej/luxor-claude-marketplace --skill react-development -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Из того же набора31
Похожие
Рядом в теме «Фронтенд и UI»
Всё по теме «Фронтенд и UI» →Вопросы о react-development
Как установить react-development в Claude?
Выполните npx skills add manutej/luxor-claude-marketplace --skill react-development -a claude-code. Файл появится по пути ~/.claude/skills/react-development/SKILL.md.
Что делает react-development?
Даёт агенту примеры и правила по React: компоненты, JSX, пропсы, хуки useState и useEffect, работа с состоянием и оптимизация производительности. Материал построен на официальной документации react.dev.
С какими платформами работает скилл?
Claude, Codex, Cursor, GitHub Copilot, Gemini CLI и OpenCode. Для каждой платформы своя команда установки и своя папка для файла скилла.
