ميزات المشروع
• واجهة مستخدم متجاوبة بالكامل مع جميع الأجهزة (موبايل، تابليت، ديسكتوب).
• بنية مكونات قابلة لإعادة الاستخدام لتسهيل الصيانة والتوسع المستقبلي.
• تحسين الأداء عبر Lazy Loading للصور والموارد وتقليل حجم الحزم.
• Backend آمن لدعم التواصل مع العملاء والتكامل مع الشركاء باستخدام Node.js.
• إعداد Dockerized deployment لتسهيل النشر وضمان استقرار البيئة الإنتاجية.
• تصميم يركز على وضوح المعلومات وتجربة المستخدم مع سهولة التنقل بين الصفحات وفهم الخدمات بسرعة.
• خريطة تفاعلية (Interactive Map): عرض مواقع المشاريع والشركاء مع Timeline ديناميكي وبيانات تفصيلية عند النقر على أي موقع.
• دعم الوصولية (Accessibility) والتنقل بالكيبورد لجميع المستخدمين.
⸻
طريقة التنفيذ
1. تخطيط الهيكلية وتجهيز تصميم واجهة المستخدم والمكونات.
2. تطوير المكونات باستخدام React + TypeScript لبناء واجهة منظمة وقابلة لإعادة الاستخدام.
3. تصميم واجهة متجاوبة باستخدام Tailwind CSS مع مراعاة الوصولية.
4. تحسين سرعة الموقع باستخدام Vite وLazy Loading للصور والمحتوى.
5. تطوير Backend بسيط وآمن للتواصل وتسجيل البيانات مع الشركاء.
6. بناء مكون InteractiveMap.tsx باستخدام مكتبة Leaflet.js أو مشابهة، وربطه بالبيانات الحقيقية للمشاريع والشركاء، مع Timeline ديناميكي.
7. إعداد بيئة Docker للنشر المستقر والمتكرر.
8. إضافة أدوات لضمان جودة الكود مثل TypeScript، وفحص الأخطاء، وإعدادات البناء للإنتاج
