portfolio

2. تطوير واجهة المستخدم (Frontend Development)

عشان الشاشة تظهر وتتفاعل بالشكل ده، تم استخدام لغات وتقنيات الويب الأساسية:

HTML5: لبناء هيكل الصفحة (النصوص، العناوين، القوائم، الأزرار، والبطاقات Card Containers).

CSS3: لتنسيق الألوان، الأبعاد، الخطوط، وتوزيع العناصر (Flexbox & Grid).

الأزرار مثل View Projects و Download CV والتصميم الدائري للبطاقات مُنسقة باستخدام ميزات CSS الحديثة.

JavaScript

محاكي الاختبارات الحي (Live Test Automation Runner): الجزء الموجود على اليمين اللي بيعرض نتائج الاختبارات وأوقاتها (زي Smoke & Sanity Suite و REST API Endpoints) بيتم برمجة التفاعل والتحديثات فيه بـ JavaScript عشان يظهر كأنه شاشة تشغيل حقيقية.

شريط التصفح (Navigation): لتنسيق الانتقال السلس بين الأقسام عند الضغط على القائمة العلوية.

الأيقونات والخطوط (Icons & Typography)

Font Awesome / Lucide Icons / Heroicons: للأيقونات الصغيرة (زي علامة الصح Green Checkmarks، أيقونة التحميل، أيقونة البريد، وأيقونات الأدوات زي Java, Selenium, SQL).

Google Fonts: لاستخدام خطوط حديثة وواضحة باللغة الإنجليزية (مثل Inter أو Roboto أو Poppins).