SkillSwap — تبادل المهارات

## Skills Swap – منصة لتبادل المهارات والخبرات

### نبذة عن المشروع

قمت بتصميم وتطوير منصة ويب باسم **Skills Swap** تهدف إلى مساعدة المستخدمين على تبادل المهارات والخبرات فيما بينهم. تتيح المنصة للمستخدم إنشاء حساب وملف شخصي يوضح المهارات التي يمتلكها والمهارات التي يرغب في تعلمها، ثم استكشاف المستخدمين المناسبين والتواصل معهم لإرسال طلبات تبادل المهارات.

هذا المشروع من تنفيذي الشخصي، وقد عملت عليه بدايةً من تصميم وتنظيم الواجهات، وحتى ربطها بالخدمات والوظائف الخاصة بالمنصة.

### دوري في تنفيذ المشروع

قمت بتنفيذ المشروع بصفتي **Front-End Developer**، وشملت مسؤولياتي:

- تصميم وتنفيذ واجهات المستخدم بالكامل.

- بناء صفحات تسجيل الدخول وإنشاء الحساب.

- تصميم صفحة الملف الشخصي وعرض المهارات.

- تنفيذ صفحة استكشاف المستخدمين والمهارات.

- تصميم نظام عرض المستخدمين المقترحين للمطابقة.

- تنفيذ صفحات طلبات تبادل المهارات.

- تصميم صفحات الرسائل والإشعارات.

- إنشاء واجهات متجاوبة تعمل على الكمبيوتر والموبايل.

- ربط الواجهات بالـ APIs لعرض البيانات وإرسال الطلبات.

- تنظيم المكونات والصفحات بطريقة تسهّل تطوير المشروع مستقبلًا.

- اختبار الواجهات والتأكد من سهولة الاستخدام وتناسق التصميم.

### آلية تنفيذ المشروع

بدأت أولًا بتحديد الصفحات والوظائف الأساسية المطلوبة داخل المنصة، ثم قمت بتقسيم المشروع إلى مكونات مستقلة، مثل:

- مكونات شريط التنقل.

- صفحات تسجيل الدخول وإنشاء الحساب.

- صفحة لوحة التحكم.

- صفحة استكشاف المهارات والمستخدمين.

- مكونات بطاقات المستخدمين والمهارات.

- صفحات الملف الشخصي والطلبات.

- صفحات الرسائل والإشعارات.

بعد ذلك قمت بإنشاء الواجهات باستخدام **Angular وTypeScript**، مع استخدام **HTML وCSS** لتصميم العناصر وتنسيقها. كما اهتممت بجعل التصميم متجاوبًا مع مختلف أحجام الشاشات.

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

### أهم الصفحات والوظائف

- صفحة تسجيل الدخول.

- صفحة إنشاء حساب جديد.

- لوحة تحكم المستخدم.

- صفحة استكشاف المهارات والمستخدمين.

- صفحة الملف الشخصي.

- صفحة طلبات تبادل المهارات.

- صفحة المطابقة بين المستخدمين.

- صفحة الرسائل.

- صفحة الإشعارات.

- تصميم متجاوب لمختلف الأجهزة.

### التقنيات المستخدمة

- **Angular**

- **TypeScript**

- **HTML5**

- **CSS3**

- **Bootstrap**

- **Node.js**

- **Express.js**

- **MongoDB**

- **REST APIs**

### نتيجة المشروع

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

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

**نوع المشروع:** Web Application

**دوري في المشروع:** Front-End Developer