يفتح في علامة تبويب جديدة

كل المهاراتAIWIZARD / دليل المهارة

مهارة للذكاء الاصطناعي

Agent Skills: مكتبة Vercel لتطوير الواجهات ومراجعة الكود بمساعدة الوكلاء

مجموعة مهارات من Vercel تساعد وكلاء البرمجة على مراجعة الواجهات، وتحسين مشاريع React وNext.js وReact Native، وتنظيم المكونات والنشر. اختر المهارة المناسبة، وراجع متطلباتها وترخيصها بصورة مستقلة.

intermediateالرخصة: راجع تفاصيل المهارة

Vercel Agent Skills: مجموعة مهارات لتطوير React والواجهات والنشر

ماذا ستنجز؟

مجموعة مهارات من Vercel تساعد وكلاء البرمجة على مراجعة الواجهات، وتحسين مشاريع React وNext.js وReact Native، وتنظيم المكونات والنشر. اختر المهارة المناسبة، وراجع متطلباتها وترخيصها بصورة مستقلة.

ما الذي تحتاجه؟

بيئة تطوير ووكيل يدعم Agent Skills، ومعرفة بالتقنيات المناسبة لمشروعك. المستودع متاح علنًا. تصرّح ملفات مهارات React وComposition Patterns وReact Native بترخيص MIT، لكن لا يجوز تعميمه على المجموعة كلها. راجع ترخيص المهارة والمكونات المستخدمة، ولا تفترض أن خدمات Vercel أو بيئة الوكيل مجانية.

طريقة الاستخدام

  1. راجع المهارات واختر ما يناسب مشروعك.
  2. نفذ npx skills add vercel-labs/agent-skills واتبع تعليمات التثبيت.
  3. حدد الملفات والمشكلة، واطلب مراجعة التغييرات قبل تطبيقها.
  4. شغل الاختبارات وقارن الأداء قبل التغيير وبعده.

حين تستخدم مساعدًا برمجيًا لبناء موقع أو تحسين تطبيق، تصبح جودة التعليمات التي يعمل بها جزءًا من جودة النتيجة. يقدم agent-skills من Vercel مجموعة مهارات لوكلاء البرمجة بالذكاء الاصطناعي، تجمع إرشادات وملفات مساعدة وسكربتات لمهام محددة. يتبع المشروع صيغة Agent Skills، ويُعرض هنا بوصفه مكتبة متعددة المهارات تختار منها ما يناسب عملك، وليس مهارة واحدة تؤدي وظيفة ثابتة. المستودع الرسمي

لماذا قد يفيدك؟

تخيل أنك تعمل على واجهة متجر أصبحت بطيئة بعد إضافة مزايا جديدة. بدل الاكتفاء بطلب عام مثل «حسّن الأداء»، يمكنك توجيه المساعد إلى مراجعة جلب البيانات، وتحميل المكونات، وحجم الحزمة، ثم مناقشة التغييرات المقترحة. هذه طريقة عملية لاستخدام المكتبة: تحويل السؤال الواسع إلى مراجعة محددة، مع الإبقاء على الاختبارات والقياس جزءًا من قرارك النهائي. المثال توضيحي، ولا يعني أن تثبيت المهارات يضمن نتيجة معينة أو نسبة ثابتة من التحسن.

ويمكن لفريق صغير استخدامها كمرجع مشترك أثناء مراجعة العمل. فبدل اختلاف تعليمات كل جلسة، يحدد الفريق المهمة والملفات وإصدار التقنية والقيود التي يريد الحفاظ عليها، ثم يقارن اقتراحات المساعد بالواقع. القيمة هنا في تنظيم الحوار البرمجي وجعله قابلًا للمراجعة، خصوصًا عندما يشرح المساعد سبب التغيير قبل تنفيذه.

أبرز المهارات والوظائف

  • تحسين React وNext.js: تتناول مهارة React أنماط جلب البيانات، وتأخير العمليات غير الضرورية، وتقليل التحميل المتسلسل، وحجم الحزمة، وأداء الخادم، وإعادة التصيير. وتُرتب الموضوعات بحسب أثرها، بما يساعد على البدء بالمشكلات الأكبر قبل التحسينات الصغيرة. وهي مناسبة لكتابة مكونات جديدة أو مراجعة مكونات موجودة، مع مراعاة بنية التطبيق الفعلية. مهارة React
  • مراجعة واجهات الويب: تقرأ مهارة تصميم الواجهات الملفات المحددة، وتجلب أحدث الإرشادات من مصدرها، ثم تعرض الملاحظات بصيغة تشير إلى الملف والسطر. يفيد ذلك عندما تريد قائمة مواضع قابلة للفحص، لا انطباعًا عامًا عن جمال الصفحة. ويمكن أن تبدأ بطلب مراجعة نموذج تسجيل أو مكونات التنقل قبل توسيع النطاق. مهارة واجهات الويب
  • تنظيم المكونات القابلة لإعادة الاستخدام: تركز مهارة Composition Patterns على تركيب المكونات، وإدارة الحالة المشتركة، وتقليل تراكم الخصائص المنطقية التي تغيّر سلوك المكون. وتضم شرحًا وأمثلة صحيحة وأخرى غير مناسبة، مع قسم خاص بواجهات React 19 يجب عدم تطبيقه تلقائيًا على الإصدارات الأقدم. مهارة تركيب المكونات
  • تطوير تطبيقات الهاتف: تشمل مهارات React Native وExpo أداء القوائم، والحركة، والتنقل، والصور، والحالة، وتنظيم المشاريع ذات الاعتماديات الأصلية. يمكن الاستفادة منها عند فحص شاشة تحتوي قائمة طويلة أو عند مراجعة التفاعل والحركة، بدل التعامل مع تطبيق الهاتف كأنه صفحة ويب عادية. مهارات React Native
  • مراجعة مشروع منشور على Vercel: تبدأ مهارة vercel-optimize بالمقاييس وبيانات الاستخدام، ثم تبحث في المسارات والملفات التي تشير إليها الأدلة. تتطلب إعدادًا إضافيًا، منها جلسة CLI موثقة ومشروع مرتبط وNode.js مناسب، وتحتاج توصيات مستوى المسارات إلى Observability Plus. لذلك لا تُعرض هذه الوظيفة كفحص كامل متاح بمجرد تثبيت المجموعة. مهارة تحسين Vercel

تضم القائمة الحالية كذلك مهارات لمراجعة الكتابة، وانتقالات React، والنشر على Vercel. وفي مسار النشر تفضل التعليمات معاينة المشروع، ما لم يطلب المستخدم نشر الإنتاج صراحة، وتختار طريقة النشر بحسب حالة الربط وتسجيل الدخول. وجود هذه المهارة لا يلغي الحاجة إلى تحديد الحساب والمشروع والبيئة المطلوبة قبل أي نشر. مهارة النشر

كيف تبدأ؟

  1. افتح المستودع وراجع المهارات المتاحة، ثم حدد المشكلة التي تريد حلها: أداء، واجهة، مكونات، هاتف، أو نشر.
  2. استخدم أمر التثبيت المذكور في الوثائق: npx skills add vercel-labs/agent-skills، واتبع الخيارات التي تظهر في بيئتك. تذكر الوثائق أن الوكيل يستخدم المهارات المثبتة عندما تكون المهمة مناسبة. التثبيت والاستخدام
  3. أعط المساعد طلبًا واضحًا، مثل: «راجع هذه الصفحة وحدد أسباب بطء جلب البيانات، ثم اعرض التغييرات المقترحة قبل تعديل الملفات».
  4. ابدأ بجزء محدود، واطلب فصل المشكلات المؤكدة عن الاحتمالات. احتفظ بنسخة من الحالة السابقة، وشغّل الاختبارات المناسبة بعد التعديل.
  5. قارن النتيجة بمعيار تختاره مسبقًا، مثل زمن تحميل صفحة محددة أو وضوح التنقل بلوحة المفاتيح، بدل الحكم على عدد التعديلات وحده.

لمن تناسب، وما حدودها؟

نرشح النظر فيها لمطوري الواجهات، والفرق التي تستخدم مساعدين برمجيين، ومن يتعلم مراجعة مشاريع React أو Next.js أو React Native بصورة منظمة. أما من يبحث عن منشئ مواقع يعمل دون بيئة تطوير، فقد يحتاج إلى أداة مختلفة. المهارات إرشادات تشغيل ومراجعة داخل سياق الوكيل، وليست ضمانًا لصحة الكود أو توافقه مع كل مشروع. ابدأ بالمراجعة قبل السماح بتعديلات واسعة، ولا تعتمد على فحص آلي وحده عند اتخاذ قرار إنتاجي.

الترخيص والمصدر

تذكر ملفات مهارات React وComposition Patterns وReact Native ترخيص MIT. هذا وصف لهذه المهارات المحددة، ولا يكفي لاعتبار المجموعة كلها مرخصة بترخيص موحد. راجع ملف كل مهارة وما يتصل بها من مكونات أو خدمات قبل إعادة التوزيع أو اعتمادها في منتجك. مثال توثيق الترخيص داخل المهارة

المصدر الأصلي: https://github.com/vercel-labs/agent-skills

تاريخ مراجعة المعلومات: 3 نوفمبر 2026.

المصدر والتوثيق

ابدأ من المرجع الأصلي

راجع تعليمات المصدر ومتطلبات التشغيل قبل التجربة.

افتح المصدر الرسمي

كمّل الاستكشاف

مهارة تكمّل فكرتك

ارجع للمكتبة وقارن الأدوات والمهارات حسب المهمة التي تريد إنجازها.

تصفّح المهارات