اتصال Google Stitch به ایجنت‌های کدنویسی با MCP
هوش مصنوعی
گوگل
فرانتاندخلاصهٔ کامل‌تر
Stitch ابزار طراحی هوش مصنوعی گوگله و حالا یه یکپارچگی MCP داره (یعنی Model Context Protocol، روشی که ابزارها رو به شکل تابع‌های قابل‌صدازدن در اختیار ایجنت هوش مصنوعی می‌ذاره). با این کار ایجنت کدنویسی به جای فایل اکسپورت‌شده، مستقیم به پروژه‌های Stitch دسترسی داره.
روال معمول Stitch با یه فایل zip تموم میشه که توش HTML، تصویرها و فایل design.md هست. به گفتهٔ مقاله، این برای یه تحویل یه‌باره خوبه، ولی وقتی تکرار لازمه دردسر میشه. هر بار باید صفحه رو تو Stitch عوض کنی، دوباره اکسپورت بگیری، وارد کنی و به ایجنت توضیح بدی چی عوض شده. با MCP ایجنت همیشه آخرین نسخه رو مستقیم می‌خونه.
کارهایی که ایجنت وصل‌شده می‌تونه بکنه:
- دیدن لیست پروژه‌های Stitch
- خوندن وضعیت فعلی یه یا چند صفحه
- ساختن طرح جدید از روی prompt
- درخواست ویرایش هدفمند روی یه صفحه
- ساختن variation (یعنی نسخه‌های جایگزین از یه صفحه)
برای راه‌اندازی، اول تو تنظیمات Stitch از بخش API keys یه کلید می‌سازی. مقاله تأکید می‌کنه این کلید فقط باید سمت سرور یا ایجنت بمونه، چون اگه تو کد جاوااسکریپت فرانت بذاری، هر کسی با dev tools می‌بینتش. نمونهٔ مستندشده Antigravity هست: از منوی پنل ایجنت می‌ری به MCP servers، بعد manage MCP servers، تو نمای raw config تنظیمات Stitch رو از مستندات گوگل اضافه می‌کنی و کلید رو می‌ذاری.
نویسنده توصیه می‌کنه بعد از اتصال، اول از ایجنت بخوای پروژه‌هات رو لیست کنه تا مطمئن شی اتصال کار می‌کنه. بعد اسم دقیق پروژه رو بده و بخواه صفحه‌ها رو بررسی کنه، بعد پیاده‌سازی رو شروع کنه. گوگل کنار MCP یه CLI و SDK و چیزی به اسم «Stitch skills» هم منتشر کرده که برای اسکریپت‌نویسی کارهای طراحی و ساخت اپ درست شدن.
به نظر نویسنده، برای یه پروژهٔ تک با یه تحویل تمیز، همون اکسپورت zip ساده‌تره و کلید API نمی‌خواد. MCP وقتی می‌ارزه که رفت‌وبرگشت بین طراحی و کد ادامه داره و می‌خوای ایجنت بدون دخالت تو صفحهٔ جدید یا design system رو بکشه بیرون. هزینه‌ش هم چند مرحله تنظیم بیشتره.
نکات کلیدی:
- Stitch از طریق MCP لیست پروژه، خوندن صفحه، ساخت طرح، ویرایش و variation رو به ایجنت می‌ده
- کلید API از بخش API keys تو تنظیمات Stitch ساخته میشه و نباید تو کد فرانت باشه
- Antigravity از مسیر MCP servers و نمای raw config وصل میشه
- اولین تست بعد از اتصال: لیست‌کردن پروژه‌ها
- راه‌های دیگهٔ خروجی Stitch: HTML/CSS، Figma و انتشار مستقیم
- گوگل یه CLI، SDK و Stitch skills هم برای اسکریپت‌نویسی داده
