# 5 Skills لتحسين مشاريع Vibe Coding

> يستعرض Abdul Osama (عبدول أسامة) خمس Skills يراها مهمة عند بناء مشروع بأسلوب Vibe Coding: Superpowers وFront-End Design وSecurity Review وReact Best Practices وWeb Testing. تغطي تنظيم العمل والتصميم والأمان وجودة كود React واختبار الموقع بعد الانتهاء منه.

- عبدول أسامة (Abdul Osama) — الذكاء الاصطناعي والتسويق والأعمال بالعربي
- 5 أكتوبر 2026
- URL: https://abdulosama.com/feed/five-vibe-coding-skills
- Video: https://abdulosama.com/feed/video/117
- Instagram: https://www.instagram.com/reel/DbAh0dws2e2/

## أهم النقاط

- Superpowers مخصصة لتنظيم خطوات البناء وطرح الأسئلة المناسبة.
- Front-End Design لا تحل محل اختيارك لنظام تصميم وخطوط وألوان مميزة.
- Security Review تساعد على اكتشاف الأخطاء والثغرات الأمنية.
- React Best Practices تهدف إلى تحسين كود React، ثم تأتي Web Testing لفحص الموقع.
- الـSkills الخمس مهمة في رأي عبدول؛ لا يضع واحدة فوق البقية.

## ما الـSkills التي يقترحها للمشروع؟

يقترح Abdul Osama (عبدول أسامة) استخدام خمس Skills عند بناء مشروع بأسلوب Vibe Coding: Superpowers، وFront-End Design، وSecurity Review، وReact Best Practices، وWeb Testing. لكل واحدة دور مختلف، من التخطيط إلى فحص ما بنيته، ولا يصف أيًّا منها بأنها أهم من البقية.

> «كلهم مهمين.» — عبدول أسامة

### دور كل Skill

| Skill | كيف يشرح دورها؟ |
| --- | --- |
| Superpowers | سير عمل يطرح عليك الأسئلة المناسبة ويساعدك على البناء بمنطق، لتجنب مشكلات قد تنشأ من قلة الخبرة. |
| Front-End Design | تساعد في تصميم واجهة لا تبدو نسخة نمطية من مواقع أنشأها الذكاء الاصطناعي. |
| Security Review | تساعد في العثور على ثغرات أو أخطاء أمنية في ما بنيته ومحاولة إصلاحها. |
| React Best Practices | تساعدك على اتباع الممارسات الجيدة عند كتابة كود React. وينسبها إلى Vercel. |
| Web Testing | تُستخدم بعد الانتهاء لفحص الموقع بحثًا عن أخطاء ربما لم تلاحظها. |

يؤكد أن Front-End Design لا تغني عن اجتهادك: أنشئ نظام تصميم خاصًا بك، واختر الخطوط ولوحة الألوان، وحدد فكرة تميز المشروع. ويصف Front-End Design وWeb Testing بأنهما من Anthropic؛ ويستحسن التحقق من أسماء الـSkills والجهة التي نشرتها قبل البحث عنها.

## بالأرقام

- **5 Skills** تغطي مراحل مختلفة من بناء المشروع ومراجعته.

## خلفية

Vibe Coding أسلوب لبناء البرمجيات بمساعدة أدوات الذكاء الاصطناعي عبر وصف المطلوب ومراجعة ما تنتجه. والـSkill هنا إرشادات أو سير عمل يُستخدم مع مساعد برمجي. React مكتبة لبناء واجهات المستخدم، وVercel منصة لأدوات تطوير الويب؛ أما Anthropic فهي شركة تعمل على نماذج الذكاء الاصطناعي.

## ماذا تفعل بعد ذلك؟

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

## أسئلة وأجوبة

### ما أسماء الـSkills الخمس المذكورة؟

Superpowers وFront-End Design وSecurity Review وReact Best Practices وWeb Testing.

### هل تكفي Front-End Design للحصول على تصميم مميز؟

لا. يشدد عبدول على ضرورة الاجتهاد في إعداد نظام تصميم، واختيار الخطوط ولوحة الألوان وفكرة تميز الموقع.

### ما فائدة Security Review؟

تساعد في البحث عن ثغرات وأخطاء أمنية في ما بنيته والعمل على إصلاحها.

### متى تستخدم Web Testing؟

بعد الانتهاء من البناء، لفحص الموقع بحثًا عن أخطاء لم تلاحظها.

## النص الكامل للفيديو

خمس Skills ماينفعش تبني بيهم لو بتعمل Vibe Coding ومش أقول لك إن آخر واحدة أهم واحدة كلهم مهمين وأنا بحبش الحركة دي. أول واحدة Superpowers. Workflow محترم معمول من ناس شطرة في المجال ده من زمان عاملة لنفسها نظام إزاي بتبني. فهيجبرك إن أنت ترد على الأسئلة الصح وتبني بشكل منطقي عشان ما تقعش في مشاكل بسبب قلة خبرتك. التانية اسمها Front-End Design. ودي معمولة من Anthropik أصلاً وهتساعدك إنك إلى حد كبير تعمل حاجة مش AI Slop ما تعملش موقع شبه كل موقع اللي طالعة بس طبعاً لازم تجتهد زي ما قولنا قبل كده. عملك Design System بتاعك واختيار الفونتات وتميز نفسك بـ Color Palette محترمة وفكرة معينة. تالت واحدة Security Review. دي عشان لما تبني حاجة ما تبقىش مخارمة من كل النواحي. هي AI هيساعدك إلى حد ما تلاقي الـ Vulnerabilities أو الأخطاء الـ Security اللي أنت عاملها وتصلحها. رابع واحدة عشان كل الناس بتستخدم React. React هم مش عارفين فواحدة اسمها React Best Practices by Vercel رغم أنهم مقاطعة مش هنستخدم Vercel هنستخدم الحاجة بتاعتهم ونقول لهم هم تص. ومهمة جداً عشان هتخلي الكود بتاعك يمشي بالBest Practices بتاعت React. وبعد كده عندنا آخر واحدة اسمها Web Testing by Anthropik برضو. ودي لما تخلص هتستيلك الحاجة على الWeb عشان تطمن لو في أي أخطاء أنت مش شايفها لأنك مش هتستفصلح حالك. لو عايز لستة بكل الSkills دي ابعتلي رد وهبعتلك على الخاصن عبد القسامة. تابعنا عشان تعرف كل جديد في الزكاء الصناعي والتسويق.

---
كُتب هذا النص بمساعدة الذكاء الاصطناعي من الفيديو.