Back to Catalog
shadcn MCP Server logo
mcp-server6

shadcn MCP Server

خادم MCP الرسمي الذي يتيح لمساعدي الذكاء الاصطناعي تصفح وبحث وتثبيت مكونات shadcn/ui مباشرة من السجلات باستخدام اللغة الطبيعية، مما يمكّن تطوير واجهات المستخدم المدعوم بالذكاء الاصطناعي بدون هلوسة.

نظرة عامة

يُعد shadcn MCP Server التنفيذ الرسمي لـ Model Context Protocol (MCP) الخاص بـ shadcn/ui. يتيح ذلك لمساعدي ووكلاء الذكاء الاصطناعي الاتصال بشكل آمن بسجلات المكونات المتوافقة مع shadcn، وتصفح المكونات المتاحة، والبحث عن مكونات محددة، واسترجاع الشيفرة المصدرية والعروض التوضيحية والبيانات الوصفية، وحتى تثبيتها مباشرة داخل المشاريع باستخدام أوامر باللغة الطبيعية.

يؤدي ذلك إلى التخلص من المشكلات الشائعة في الذكاء الاصطناعي مثل المعلومات القديمة أو الخصائص المتخيلة، من خلال توفير وصول مباشر ومنظم إلى أحدث بيانات السجل، مع التكامل مع واجهة الأوامر الخاصة بـ shadcn.

الميزات

  • تصفح وبحث السجلات: يمكن للذكاء الاصطناعي عرض واستعلام المكونات والبلوكات والرسوم البيانية من أي سجل متوافق مع shadcn.
  • استرجاع بيانات دقيقة: الحصول على أحدث الشيفرة المصدرية بـ TypeScript، والخصائص/الواجهات، وأمثلة الاستخدام، وأوامر التثبيت.
  • تثبيت مباشر: يمكن للذكاء الاصطناعي تنفيذ أوامر shadcn add تلقائيًا عبر جسر CLI المدمج.
  • سجلات مستقلة عن الإطار: يعمل مع أي سجل shadcn (رسمي أو مخصص)، بما في ذلك المكونات المبنية على React وTailwind.
  • تنفيذ محلي وآمن: يعمل كخادم محلي (عادة عبر npx أو حزمة مثبتة) مع إعدادات مصادقة قابلة للتكوين.
  • تكامل مع IDE والأدوات: دعم أصلي في أدوات مثل Cursor وClaude Desktop وZed وغيرها من الأدوات الداعمة لـ MCP.

كيف يعمل

  1. تثبيت خادم MCP (عادة عبر npx أو إعداد المشروع).
  2. تكوين السجل في components.json.
  3. ربط مساعد الذكاء الاصطناعي بنقطة نهاية MCP المحلية.
  4. استخدام أوامر باللغة الطبيعية مثل "أضف لوحة تحكم جميلة باستخدام مخططات shadcn" — يقوم الذكاء الاصطناعي بالبحث في السجل، واختيار المكونات، وتثبيتها.

حالات الاستخدام

  • إنشاء نماذج أولية لواجهات المستخدم باستخدام الذكاء الاصطناعي في Cursor أو Claude Code.
  • أتمتة تثبيت المكونات في قواعد الشيفرة الكبيرة.
  • بناء سير عمل متعدد الوكلاء حيث يقوم وكيل بالبحث عن المكونات وآخر ببناء الواجهة.
  • دمج سجلات مخصصة لأنظمة التصميم المؤسسية.

البدء

راجع الوثائق الرسمية: https://ui.shadcn.com/docs/mcp

يتم البدء عادةً باستخدام:

npx shadcn@latest mcp

أو من خلال تكوينه داخل مشروعك واستخدامه مع أدوات الذكاء الاصطناعي المتوافقة.

توجد العديد من النسخ المجتمعية والإصدارات المحسّنة (مثل دعم أطر متعددة مثل Svelte وVue)، ولكن يُنصح باستخدام النسخة الرسمية من shadcn/ui لمعظم المستخدمين.

Tags

shadcnmcpai-agentui-componentsregistrytypescriptreacttailwindclaudecursor