Artifacts في Claude Code: دليل المشغل
أضافت Anthropic ميزة Artifacts إلى Claude Code. تحول هذه الميزة عملك البرمجي إلى صفحات ويب حية يمكنك مشاركتها مع فريقك.
الـ Artifacts ليست ملفات ثابتة، بل هي صفحات HTML تفاعلية. يتم تحديثها أثناء عملك، وتستخدم الكود الفعلي والملفات ونتائج الاختبارات الخاصة بك لبناء العروض المرئية.
يمكنك استخدامها من أجل:
- جولات استعراض طلبات السحب (PR) مع فروقات الكود (code diffs)
- مخططات بنية النظام
- لوحات تحكم تفاعلية
- صفحات حالة الحوادث المباشرة
- عمليات تدقيق الأمان والتراخيص
كيفية استخدامها:
- تسجيل الدخول: قم بتشغيل
/loginفي جلسة Claude Code الخاصة بك. - اطلب: اطلب من Claude بناء لوحة تحكم أو مخطط.
- البناء: يقوم Claude بإنشاء صفحة HTML.
- المشاركة: انقر على زر المشاركة لإرسال رابط خاص إلى فريقك.
التوفر والخصوصية:
- هذه الميزة في المرحلة التجريبية (Beta) لخطط Team و Enterprise.
- الخطط الفردية لا تملك حق الوصول إليها بعد.
- الـ Artifacts خاصة؛ حيث لا يمكن إلا للأعضاء الموثقين في مؤسستك رؤيتها.
قامت Anthropic أيضًا بتحديث Claude Design لسد الفجوة بين التصميم والكود. يمكنك الآن استخدام الأمر /design-sync.
سير عمل /design-sync:
- سحب نظام التصميم الخاص بك من GitHub إلى Claude Design.
- استخدم
/design-syncفي واجهة السطر البرمجي (terminal) لإدراج تلك التصاميم في الكود الخاص بك. - دفع الكود (Push) مرة أخرى إلى Claude Design لإجراء تعديلات مرئية.
يؤدي هذا إلى إنشاء حلقة كاملة؛ حيث تنتقل من التصميم إلى الكود ثم إلى التوثيق دون مغادرة نظام الذكاء الاصطناعي.
يحل هذا مشكلة كبيرة؛ فعادةً ما يظل عمل البرمجة بالذكاء الاصطناعي مخفيًا في واجهة السطر البرمجي (terminal)، مما يضطر المطورين بعد ذلك إلى كتابة التحديثات يدويًا في Slack أو Jira. أما Artifacts فتجعل العمل مرئيًا على الفور.
يصبح العمل هو وسيلة التواصل.
المصدر: https://dev.to/max_quimby/artifacts-in-claude-code-the-operators-guide-4fb0
مجتمع تعليمي اختياري: https://t.me/GyaanSetuAi