К основному содержанию
промпт GP ChatGPT

React State Management taste — промпт для ChatGPT и Claude.ai

Сводка правил по управлению состоянием в React: когда использовать useState, Zustand, Context и TanStack Query. Помогает избежать типичных ошибок вроде лишних глобальных сторов.

Открыть на GitHub

Что делает React State Management taste

Промпт задаёт набор правил для выбора инструмента состояния в React-приложении. Начинать советует с локального useState, а поднимать состояние только когда двум соседним компонентам оно действительно нужно. Серверные данные предлагает держать как кэш через TanStack Query, не сваливая их в глобальный стор.

Что попадает в URL: фильтры, вкладки, пагинацию — хранить в search params. Для общего клиентского состояния, которое переросло одно дерево компонентов, брать Zustand. Redux для новых проектов не советует, если команда уже не привязана к его devtools и middleware.

Отдельные правила касаются асинхронного статуса (одно поле-юнион вместо нескольких булевых), форм (React Hook Form с zod-схемой), оптимистичных обновлений и откатов. Промпт настаивает на явной типизации сторов и запрете any. Это вкусовой набор рекомендаций с оценками уверенности от 0.70 до 0.95, а не строгая архитектура.

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

  • выбрать между useState, Zustand и Context для конкретной задачи
  • перестать хранить серверные данные в глобальном сторе
  • вынести фильтры и пагинацию в URL
  • убрать дублирование состояния через useEffect
  • типизировать сторы без any

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

  • Вставь промпт в ChatGPT и спроси, какой стор выбрать для корзины в интернет-магазине
  • Дай промпт в Claude.ai и опиши компонент с фильтрами: куда положить состояние фильтров
  • Попроси ассистента проверить мой код по этим правилам и указать, где состояние хранится неправильно

Как установить React State Management taste

Как использовать

Вставьте текст в начало диалога или в инструкции проекта

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

Весь набор →
Kubernetes taste Промпт задаёт ИИ-ассистенту набор правил платформенной команды: GitOps, пробы, ресурсы, безопасность подов. Пригодится, когда просите модель писать или проверять манифесты. GP ChatGPT ★ 174 597звёзд репо Git Workflow taste Промпт задаёт ИИ-ассистенту привычки trunk-based команды: короткие ветки, Conventional Commits, squash-merge и защита main. GP ChatGPT ★ 174 597звёзд репо Monorepo taste Промпт задаёт агенту свод правил для монорепозитория: pnpm workspaces, Turborepo, границы пакетов и общие конфиги. Пригодится, когда нужно привести структуру репо к одному стилю. GP ChatGPT ★ 174 597звёзд репо Rust CLI taste Промпт задаёт набор правил, по которым ИИ пишет консольные утилиты на Rust: разбор аргументов, ошибки, вывод, тесты. GP ChatGPT ★ 174 597звёзд репо Observability taste Набор правил для ИИ-ассистента: как расставлять трейсы, метрики и логи в сервисе, чтобы потом не гадать по дашбордам. Пригодится, когда просите модель написать код с телеметрией. GP ChatGPT ★ 174 597звёзд репо Python Packaging taste Промпт задаёт агенту набор правил для упаковки Python-проектов: pyproject.toml, src/, uv, Ruff. Пригодится, когда нужно привести новый пакет к одному стилю. GP ChatGPT ★ 174 597звёзд репо Dockerfile and CI taste Набор правил для Dockerfile и CI: многоэтапные сборки, непривилегированный пользователь, проверка образов. Пригодится, когда просишь ИИ написать или разобрать конфиг сборки. GP ChatGPT ★ 174 597звёзд репо Senior Code Reviewer (severity-ranked) Промпт для ревью кода: расставляет замечания по важности от блокеров до придирок и заканчивает вердиктом. Пригодится, когда нужно быстро понять, что в чужом патче ломает логику. GP ChatGPT ★ 174 597звёзд репо

Похожие

state-management akillness Скилл помогает решить, кому принадлежит состояние в React-приложении, и выбрать самый узкий подходящий инструмент вместо спора о библиотеках. CX Codex +1 365установок frontend-state-management aj-geddes Скилл для работы с состоянием фронтенда: подсказывает, как организовать Redux, MobX, Zustand или Context API в приложении. CX Codex +1 480установок zustand-state-management Mindrally Задаёт правила архитектуры сторов Zustand в React и TypeScript: от нарезки слайсов до SSR и тестов. Помогает избежать лишних ререндеров и ошибок гидратации. CX Codex +1 959установок react-state-management Seth Hobson Помогает выбрать и настроить управление состоянием в React: локальное, глобальное, серверное, URL и состояние форм. CX Codex 15 286установок zustand pedronauck Скилл для ИИ-агента, который подсказывает паттерны Zustand: структуру сторов, селекторы, middleware и персистентность. CX Codex +1 353установок react-vite-dashboard официальный google-labs-code Скилл превращает макеты из Stitch в рабочий код дашборда на React и Vite. Он связывает дизайн-токены из DESIGN.md с кодом и подключает выборку данных через TanStack Query. CX Codex +1 5 500установок react-specialist VoltAgent Community Субагент для разбора и доработки React-кода: производительности, состояния, архитектуры и тестов. Подходит, когда проект уже есть и нужны точечные изменения. 815установок frontend-patterns affaan-m Скилл подсказывает паттерны для React и Next.js: компоненты, состояние, загрузка данных и производительность. Нужен при разработке и ревью интерфейса. CX Codex +1 5 900установок

Рядом в каталоге

Все промпты по теме «Фронтенд и UI» →

Вопросы о React State Management taste

Как установить React State Management taste в Claude Code?

Промпт добавляется в файл .claude/commands/prompts.csv.md. После этого команда prompts.csv станет доступна в Claude Code.

Что делает React State Management taste?

Это подборка правил по выбору инструментов состояния в React: когда использовать локальный useState, когда Context, Zustand или TanStack Query. Каждое правило идёт с оценкой уверенности.

Можно ли использовать этот промпт в ChatGPT?

Да, промпт рассчитан на ChatGPT и Claude.ai. Его можно вставить в начале диалога, чтобы ассистент придерживался этих правил при советах по React.

Исходный текст

prompts.csv · CC0-1.0
# React State Management taste
- Start with local useState and lift state only when two siblings truly need it. Confidence: 0.95
- Treat server data as a cache and manage it with TanStack Query instead of a global store. Confidence: 0.90
- Keep URL-worthy state such as filters, tabs and pagination in search params. Confidence: 0.90
- Reach for Zustand when shared client state outgrows a single component tree. Confidence: 0.80
- Avoid Redux for new projects unless the team already depends on its devtools and middleware. Confidence: 0.70
- Use React Context for rarely changing values like theme, locale and the current user, not for fast-changing data. Confidence: 0.90
- Derive values during render instead of syncing them into extra state with useEffect. Confidence: 0.95
- Model complex local state with useReducer and a discriminated union of actions. Confidence: 0.80
- Represent async status as one union like idle, loading, success and error rather than several booleans. Confidence: 0.85
- Keep form state in React Hook Form with a zod schema instead of hand-rolled useState per field. Confidence: 0.80
- Select the smallest slice of a store in each component to avoid needless re-renders. Confidence: 0.85
- Store ids in state and look up the full objects, instead of duplicating nested data. Confidence: 0.80
- Use optimistic updates for quick user actions and roll back on error. Confidence: 0.75
- Never mutate state objects in place; return new objects or use Immer for deep updates. Confidence: 0.90
- Keep persisted state small and versioned when saving it to localStorage. Confidence: 0.75
- Reset component state by changing its key instead of writing reset effects. Confidence: 0.80
- Colocate stores with the feature that owns them rather than in one global store folder. Confidence: 0.75
- Type every store and context value explicitly and avoid any in state shapes. Confidence: 0.90

© f · CC0-1.0 · f/prompts.chat

Смотрите также

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

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