تطبيق المنتجات هو تطبيق تجارة إلكترونية ديناميكي وسهل الاستخدام، صُمم لعرض وإدارة مجموعة من المنتجات. بُني التطبيق باستخدام تقنيات تطوير الويب الحديثة، ويوفر تجربة تسوق سلسة للمستخدمين، حيث يمكنهم تصفح المنتجات، إضافة العناصر إلى سلة التسوق، وإدارة الكميات بكفاءة.
الميزات الرئيسية:
قائمة المنتجات:
يعرض مجموعة واسعة من المنتجات مع تفاصيل مثل الاسم، السعر، العلامة التجارية، نسبة الخصم، والكمية المتاحة.
يتضمن صورًا عالية الجودة للمنتجات لتجربة مستخدم جذابة.
سلة التسوق:
يمكن للمستخدمين إضافة المنتجات إلى سلة التسوق وتعديل الكميات.
يتم تحديث السلة ديناميكيًا لتعكس السعر الإجمالي وعدد العناصر.
يضمن التطبيق ألا يتجاوز المستخدم الكمية المتاحة من أي منتج.
إدارة المنتجات:
يمكن للمستخدمين إضافة أو إزالة العناصر من السلة باستخدام أزرار "زيادة" و"تقليل" بديهية.
يتم التحقق من الكميات في الوقت الفعلي لضمان بقائها ضمن النطاق المسموح به (بحد أدنى 1 وبحد أقصى الكمية المتاحة).
تصميم متجاوب:
التطبيق متجاوب بالكامل، مما يوفر تجربة عرض مثالية عبر الأجهزة (سطح المكتب، الأجهزة اللوحية، والهواتف المحمولة).
إدارة الحالة:
يتم استخدام خدمات Angular (CartService وTotalPriceService) لإدارة حالة سلة التسوق والسعر الإجمالي بكفاءة.
يضمن التطبيق اتساق البيانات والتحديثات في الوقت الفعلي.
واجهة مستخدم سهلة الاستخدام:
واجهة مستخدم نظيفة وعصرية مع أزرار واضحة لإضافة/إزالة العناصر.
يعرض السعر الإجمالي بشكل بارز لتسهيل عملية الدفع.
التحقق من الكمية المتاحة:
يمنع المستخدمين من إضافة عناصر أكثر من الكمية المتاحة.
يعطل زر "الزيادة" عند الوصول إلى الحد الأقصى للكمية المتاحة.
التنقل بين الصفحات:
يتضمن ميزات تنقل للسماح للمستخدمين بالانتقال بين سلة التسوق والصفحات الأخرى (مثل تفاصيل المنتج أو الصفحة الرئيسية).
التقنيات المستخدمة:
واجهة المستخدم: Angular (مكونات، خدمات، أوامر، أنابيب)
التصميم: CSS، Bootstrap (للتنسيق المتجاوب)
إدارة الحالة: خدمات Angular
الأدوات: Lodash (لوظائف المساعدة مثل uniqBy)، RxJS (للبرمجة التفاعلية)
التحديات التي تم حلها:
تحديثات السلة الديناميكية: تم ضمان تحديث السلة في الوقت الفعلي عند إضافة أو إزالة العناصر.
إدارة الكمية المتاحة: تم تنفيذ التحقق لمنع المستخدمين من تجاوز الكمية المتاحة.
تحسين واجهة المستخدم: تم تصميم واجهة مستخدم نظيفة وبديهية لتجربة تسوق سلسة
| اسم المستقل | عبدالله ش. |
| عدد الإعجابات | 1 |
| عدد المشاهدات | 11 |
| تاريخ الإضافة | |
| تاريخ الإنجاز |
