
shadcn MCP Server
आधिकारिक MCP सर्वर जो AI असिस्टेंट्स को प्राकृतिक भाषा का उपयोग करके shadcn/ui कंपोनेंट्स को सीधे रजिस्ट्रियों से ब्राउज़, खोज और इंस्टॉल करने में सक्षम बनाता है, जिससे बिना भ्रम (hallucination) के AI-चालित UI विकास संभव होता है।
अवलोकन
shadcn MCP Server, shadcn/ui के लिए Model Context Protocol (MCP) का आधिकारिक कार्यान्वयन है। यह AI असिस्टेंट्स और एजेंट्स को shadcn-संगत कंपोनेंट रजिस्ट्रियों से सुरक्षित रूप से जुड़ने, उपलब्ध कंपोनेंट्स को ब्राउज़ करने, विशिष्ट कंपोनेंट्स की खोज करने, सोर्स कोड, डेमो और मेटाडेटा प्राप्त करने, और यहां तक कि उन्हें प्राकृतिक भाषा निर्देशों का उपयोग करके सीधे प्रोजेक्ट्स में इंस्टॉल करने की अनुमति देता है।
यह AI की सामान्य समस्याओं जैसे पुरानी जानकारी या काल्पनिक props को समाप्त करता है, क्योंकि यह नवीनतम रजिस्ट्रि डेटा तक संरचित और रीयल-टाइम पहुंच प्रदान करता है और shadcn CLI के साथ एकीकृत होता है।
विशेषताएँ
- रजिस्ट्रियों को ब्राउज़ और खोजें: AI किसी भी shadcn-संगत रजिस्ट्रि से कंपोनेंट्स, ब्लॉक्स और चार्ट्स को सूचीबद्ध और क्वेरी कर सकता है।
- सटीक डेटा प्राप्त करें: नवीनतम TypeScript सोर्स कोड, props/इंटरफेस, उपयोग उदाहरण और इंस्टॉलेशन कमांड्स प्राप्त करें।
- सीधा इंस्टॉलेशन: एकीकृत CLI ब्रिज के माध्यम से AI को
shadcn addकमांड्स स्वतः चलाने का निर्देश दें। - फ्रेमवर्क-स्वतंत्र रजिस्ट्रियां: React और Tailwind आधारित कंपोनेंट्स सहित किसी भी shadcn रजिस्ट्रि (आधिकारिक या कस्टम) के साथ काम करता है।
- सुरक्षित और लोकल निष्पादन: एक लोकल सर्वर (आमतौर पर npx या इंस्टॉल्ड पैकेज के माध्यम से) के रूप में चलता है, जिसमें कॉन्फ़िगरेबल ऑथेंटिकेशन होता है।
- IDE और टूल एकीकरण: Cursor, Claude Desktop, Zed और अन्य MCP-सक्षम टूल्स में नेटिव सपोर्ट।
यह कैसे काम करता है
- MCP सर्वर इंस्टॉल करें (आमतौर पर npx या प्रोजेक्ट सेटअप के माध्यम से)।
components.jsonमें अपनी रजिस्ट्रि कॉन्फ़िगर करें।- अपने AI असिस्टेंट को लोकल MCP एंडपॉइंट से कनेक्ट करें।
- "shadcn चार्ट्स के साथ एक सुंदर डैशबोर्ड जोड़ें" जैसे प्राकृतिक भाषा प्रॉम्प्ट का उपयोग करें — AI रजिस्ट्रि को क्वेरी करता है, कंपोनेंट्स चुनता है और उन्हें इंस्टॉल करता है।
उपयोग के मामले
- Cursor या Claude Code में AI-संचालित UI प्रोटोटाइपिंग।
- बड़े कोडबेस में कंपोनेंट इंस्टॉलेशन को स्वचालित करना।
- मल्टी-एजेंट वर्कफ़्लो बनाना, जहां एक एजेंट कंपोनेंट्स की खोज करता है और दूसरा UI तैयार करता है।
- एंटरप्राइज डिज़ाइन सिस्टम्स के लिए कस्टम रजिस्ट्रि इंटीग्रेशन।
शुरुआत कैसे करें
आधिकारिक दस्तावेज़ देखें: https://ui.shadcn.com/docs/mcp
आमतौर पर इसे इस तरह शुरू किया जाता है:
npx shadcn@latest mcp
या अपने प्रोजेक्ट में कॉन्फ़िगर करके और संगत AI टूल्स के साथ उपयोग करके।
कई कम्युनिटी फोर्क्स और उन्नत संस्करण उपलब्ध हैं (जैसे Svelte/Vue के लिए मल्टी-फ्रेमवर्क सपोर्ट), लेकिन अधिकांश उपयोगकर्ताओं के लिए shadcn/ui का आधिकारिक संस्करण अनुशंसित है।