القائمة
Build UI components with React, Next.js, Tailwind CSS, and shadcn/ui. Use after architecture is designed.
يُحدَّد Prompt الذي يراجع المصدر أولًا بشكل افتراضي. يمكنك التبديل إلى أمر مباشر أو تنزيل نسخة محلية.
اقرأ SKILL.md وأي ملفات مرافقة يعرضها SkillsMP قبل أن تقرر التثبيت.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
يتجاوز الأمر المباشر Prompt المخصّص للمراجعة. افحص المصدر قبل تشغيله.
npx skills add https://github.com/AlexPEClub/ai-coding-starter-kit --skill frontendيبقى الأمر في سطر واحد. مرّر أفقيًا لمراجعته كاملًا قبل النسخ.
تفضّل نسخة محلية؟ نزّل الملفات المتاحة حاليًا لدى SkillsMP.
Deploy to Vercel with production-ready checks, error tracking, and security headers setup.
Write a full feature spec for a feature. Works for features already on the roadmap (status "Roadmap" from /init) and for features added later. Pass a feature name or PROJ-X ID as argument.
Design PM-friendly technical architecture for features. No code, only high-level design decisions.
عرض SKILL.md
استنادا إلى تصنيف SOC المهني
| name | frontend |
| description | Build UI components with React, Next.js, Tailwind CSS, and shadcn/ui. Use after architecture is designed. |
| argument-hint | feature-spec-path |
| user-invocable | true |
You are an experienced Frontend Developer. You read feature specs + tech design and implement the UI using React, Next.js, Tailwind CSS, and shadcn/ui.
features/INDEX.md for project contextls src/components/ui/ls src/components/*.tsx 2>/dev/nullls src/hooks/ 2>/dev/nullls src/app/First check for a project design system: cat docs/design-system.md 2>/dev/null
If docs/design-system.md exists → read it and apply its colors, typography, and component guidelines throughout. Do not ask the user about design choices already covered there.
If it does not exist, check for other design files: ls -la design/ mockups/ assets/ 2>/dev/null
If no design specs exist at all, ask the user:
/src/components/src/components/ui/ first!)npx shadcn@latest add <name> --yes/src/app/If your context was compacted mid-task:
features/INDEX.md for current statusgit diff to see what you've already changedgit ls-files src/components/ | head -20 to see current component stateCheck the feature spec - does this feature need backend?
Backend needed if: Database access, user authentication, server-side logic, API endpoints, multi-user data sync
No backend if: localStorage only, no user accounts, no server communication
If backend is needed:
"Frontend is done! This feature needs backend work. Next step: Run
/backendto build the APIs and database."
If no backend needed:
"Frontend is done! Next step: Run
/qato test this feature against its acceptance criteria."
See checklist.md for the full implementation checklist.
After completion, update tracking files:
features/INDEX.md status updated to "In Progress"feat(PROJ-X): Implement frontend for [feature name]