محل ملابس بلاك وولف (النسخه الجديده)

أعدت إنشاء وتحسين الموقع من خلال الانتقال

من Vue.js وVuex

إلى ShadcnUI و Next.js وTypeScript وReact Hooks وFirebase وAPI المعتمد على JSON.

هذا الانتقال أدى إلى تحسين الأداء والقابلية للتوسع والامتثال لمعايير الويب. الإصدار الأول، المبني باستخدام Vue.js وVuex، حقق درجة أداء 52% وقابلية وصول 86%. بعد إعادة البناء، تم تحسين الأداء بشكل كبير ليصل إلى 95% في الأداء، و100% في القابلية للوصول (A11Y)، و100% في أفضل الممارسات، و100% في تحسين محركات البحث (SEO).

التحسينات الرئيسية:

- تحسين البحث وإدارة السلة : تم تحسين وظيفة البحث وإدارة السلة واسترجاع المنتجات باستخدام Next.js API Routes.

- إضافة الرسوم المتحركة : دمجت الرسوم المتحركة عبر المنصة لتعزيز تفاعل المستخدم وسهولة التنقل.

- معالجة الأخطاء في الوقت الحقيقي : أضفت معالجة فورية للأخطاء مع تنبيهات مباشرة للمنتجات غير المتوفرة أو المكررة في السلة.

- دمج Firebase : استخدمت Firebase للمصادقة وخدمات قواعد البيانات في الوقت الحقيقي لضمان إدارة سلسة للحسابات ومعالجة البيانات.

- إعادة تصميم كتالوج المنتجات : أعدت تصميم كتالوج المنتجات بإضافة مرشحات متقدمة وتفاصيل دقيقة عن المنتجات لتحسين الاكتشاف.

- تصميم متجاوب بالكامل : ضمنت أن التصميم متجاوب بالكامل لتحسين تجربة المستخدم عبر جميع الأجهزة.

- تحسين تجربه المستخدم باستخدام React Hooks : اعتمدت على React Hooks لتحسين تجربه المستخدم بكفاءة، مما يضمن كتابة كود نظيف وسهل الصيانة.

# الملف المرفق يوضح الفرق بين النسخه الجديده و القديمه . في LightHouse و GTMetrix .