تفاصيل العمل

نفذت تجربة تسوق كاملة في صفحة واحدةعشان أضمن للمستخدم سرعة وخفة في التنقل. المشروع مش مجرد شكل، ده "سيستم" كامل بيتعامل مع بيانات حقيقية (APIs) وبيشيل عن العميل وجع دماغ التحميل الكتير.

التفاصيل التقنية اللي عملتها:

إدارة البيانات (State Management): استخدمت الـ Context API عشان أربط الـ Cart وباقي أجزاء الموقع ببعض، بحيث لو ضفت منتج يظهر فوراً في السلة من غير ما الصفحة تعمل Refresh.

التعامل مع الـ APIs: ربطت الموقع بـ Live API باستخدام Axios عشان أسحب المنتجات وأعرضها بشكل ديناميكي، مع معالجة حالات الـ Loading والـ Errors.

نظام التأمين والـ Auth: عملت Login و Register كامل، واستخدمت Local Storage عشان أحافظ على بيانات المستخدم وسلة التسوق بتاعته حتى لو قفل المتصفح ورجع تاني.

الفورم والـ Validation: استخدمت Formik و Yup عشان أعمل "فاليشن" قوي على المدخلات، بحيث مفيش داتا غلط تتبعت للـ Server وتجربة المستخدم تكون احترافية.

التصميم والـ Performance: استخدمت Tailwind CSS عشان أطلع ديزاين مودرن وخفيف جداً، والسايت Responsive 100% وشغال زي الفل على الموبايل زي الديسكتوب.

التنقل (Routing): اعتمدت على React Router عشان أخلي التنقل بين الصفحات (زي الـ Checkout والـ Product Details) يتم في لمح البصر.

بطاقة العمل

اسم المستقل
عدد الإعجابات
0
عدد المشاهدات
3
تاريخ الإضافة
المهارات