Use when an agent in this TanStack AI monorepo needs a playground app to try a new feature. Trigger: new feature to try in a Start React app in this repo.
يُحدَّد Prompt الذي يراجع المصدر أولًا بشكل افتراضي. يمكنك التبديل إلى أمر مباشر أو تنزيل نسخة محلية.
مراجعة ملفات المصدر
اقرأ SKILL.md وأي ملفات مرافقة يعرضها SkillsMP قبل أن تقرر التثبيت.
عرض SKILL.md
SKILL.md
تعليمات المصدر · معاينة للقراءة فقط
name
new-react-playground
description
Use when an agent in this TanStack AI monorepo needs a playground app to try a new feature. Trigger: new feature to try in a Start React app in this repo.
# new-react-playground
Pick a kebab-case name. Then generate a React chat lab under `examples/react/<name>/`.
The generator writes a thin chat lab. The app includes:
- BYOK
- Model picker
- `/api/chat` with `chat()`
The index route is the chat shell. The dev server uses port `3100`.
## Must
1. Pick a kebab-case name.
2. From the repo root, run `pnpm nx g @tanstack/workspace-plugin:react-app <name>`. The app lands at `examples/react/<name>/`.
3. Run `pnpm install`.
4. Implement the feature on the index route. If the server must change, edit `/api/chat`.
5. Run `pnpm --filter <name> dev` (port 3100).
Do not commit the new example. After a human asks to keep it, you can commit it.
## Later
If you need live model keys, copy `.env.example` to `.env.local`.
Open `http://localhost:3100`. The chat lab is live. Your feature is on the index route.
Follow https://skillsmp.com/skill-install/prompt.md to install only the Agent Skill at https://github.com/TanStack/ai/tree/main/.agents/skills/new-react-playground.
يتجاوز الأمر المباشر Prompt المخصّص للمراجعة. افحص المصدر قبل تشغيله.