متجر إلكتروني متكامل (E-Commerce Web Application) يتيح للمستخدمين تجربة تسوق إلكترونية سلسة وممتعة عبر الإنترنت. تم بناء التطبيق بتصميم عصري ومتجاوب، ويشتمل على دورة التسوق الكاملة بدءاً من تصفح المنتجات وحتى إتمام عملية الدفع وهمياً (Checkout Simulation).
🌟 أبرز المميزات والخصائص الفنية:
تصفح واستعراض المنتجات:
عرض المنتجات في شبكة عصرية (Product Grid) تضم التفاصيل الأساسية (الاسم، السعر، والصورة).
صفحة تفاصيل متخصصة لكل منتج (Product Details Page) تعرض وصفاً شاملاً ومواصفات المنتج.
نظام سلة التسوق (Shopping Cart System):
إمكانية إضافة المنتجات للسلة بضغطة زر (Add to Cart).
تحديث عداد السلة وإجمالي التكلفة ديناميكياً فور إضافة أي منتج.
نظام التحقق وتأكيد الطلب (Authentication & Checkout Flow):
تقييد مرحلة إتمام الشراء والـ Checkout لتشترط وجود حساب وتدعم تسديد الطلب للمستخدمين المسجلين دخولهم فقط (Logged-in Users).
تحويل الزائر غير المسجل لصفحة تسجيل الدخول تلقائياً عند محاولة الدفع.
حاكاة الدفع وإتمام الطلب (Checkout Simulation):
بيئة دفع محاكاة (Mock Checkout) تدعم إدخال بيانات الشحن والدفع وهمياً لتجربة سيناريو الشراء كاملاً بدون بوابات دفع حقيقية.
إدارة الحالات (State Management):
اعتماد الـ localStorage للحفاظ على عناصر سلة التسوق وجلسة المستخدم حتى بعد إعادة تحميل الصفحة.
🛠️ التقنيات المستخدمة (Tech Stack):
HTML5: لبناء هيكلية متجاوبة ومنظمة لجميع الصفحات.
CSS3: لتنسيق واجهات الشراء، الكروت، وسلة التسوق المتجاوبة.
JavaScript (Vanilla JS / React.js): لإدارة منطق إضافة المنتجات، مصفوفة السلة، وتفعيل اشتراطات تسجيل الدخول أثناء الشراء.
Font Awesome: للأيقونات التفاعلية وأشكال سلة التسوق.