DevFolio

عنوان المشروع: DevFolio – معرض أعمال تفاعلي

وصف المشروع:

DevFolio هو مشروع تدريبي صمّمته أثناء رحلة تعلّمي المستمرة لانتقالي من CSS النقي إلى استخدام إطارات العمل. الهدف من DevFolio هو استعراض مهاراتي في تصميم واجهات الويب باستخدام HTML وCSS وBootstrap، مع القليل من JavaScript لإضافة تأثيرات تفاعلية بسيطة.

المميزات الأساسية:

- تصميم متجاوب بالاعتماد على مبدأ mobile first لضمان عرض مثالي على الهواتف والتابلت وأجهزة الكمبيوتر.

- استخدام نظام شبكة Bootstrap Grid لتقسيم المحتوى بشكل مرن ومنظم.

- قائمة تنقل ثابتة في أعلى الصفحة مع خاصية Scrollspy التي تميّز القسم النشط تلقائياً.

- تمرير سلس بين الأقسام (Smooth Scrolling) لتحسين تجربة المستخدم.

- قسم "من أنا" (About Me section) يحتوي على صورة شخصية ونبذة مختصرة عن المطور.

- قسم المشاريع (PORTFOLIO section) يعرض بطاقات Projects تحتوي على صورة، عنوان، وصف مختصر، وزر معاينة أو رابط GitHub.

- قسم المهارات (Skills section) يظهر مستوى كل مهارة باستخدام أشرطة تقدم Bootstrap.

- قسم Counter Animation (Animated Counter section) يضم أرقاماً تتزايد تلقائياً عندما تظهر في الشاشة لإضافة لمسة ديناميكية.

- استخدام Bootstrap Carousel لإنشاء سلايدر تفاعلي لعرض المحتوى.

- تأثيرات ظل وخلفيات بسيطة (Shadow & Background Effects) لإبراز عناصر الواجهة.

- نموذج "اتصل بي" (Contact section) مع تحقق أساسي من البيانات بواسطة JavaScript لضمان صحة المدخلات.

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

- HTML5 وCSS3 لبناء الهيكل وتنسيق التصميم.

- Bootstrap 5 لإنشاء شبكة وتصميم سريع ومتجاوب وللاستفادة من المكونات الجاهزة.

- Font Awesome لأيقونات عالية الجودة وقابلة للتوسع.

- JavaScript بسيط لإنشاء التمرير السلس، التحقق من نموذج الاتصال، وتحريك العداد.

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