منصة OutFav للتجارة عبر الإنترنت

OutFav E-Commerce هو تطبيق ويب متكامل للتجارة الإلكترونية تم تطويره باستخدام Angular في الواجهة الأمامية وNode.js + Express في الواجهة الخلفية، مع MongoDB & Mongoose كقاعدة بيانات. يهدف التطبيق إلى توفير تجربة تسوق سلسة مع واجهة مستخدم أنيقة، تصميم متجاوب، وأداء عالي، بالإضافة إلى نظام إدارة متكامل للمنتجات، الطلبات، العربة، والمراجعات. المميزات (Features): User Authentication: * تسجيل الدخول وإنشاء حساب جديد باستخدام JWT Tokens. * تشفير كلمات المرور باستخدام bcryptjs. * حماية المسارات من خلال Middleware للتحقق من الصلاحيات. Product Management: * إضافة، تعديل، وحذف المنتجات (CRUD). * رفع الصور وربط المنتجات بالتصنيفات. * حساب التقييمات بناءً على المراجعات. Cart Management: * إضافة المنتجات إلى العربة. * تعديل الكميات أو إزالة المنتجات. * تفريغ العربة بالكامل. Categories Management: * إنشاء، تعديل، وحذف التصنيفات. * ربط المنتجات بالتصنيفات. Customer Management: * إدارة بيانات العملاء. * صلاحيات خاصة للمسؤولين (Admin Access). Reviews System: * إضافة، تعديل، وحذف المراجعات. * عرض التقييمات وحساب المعدل. Address Management: * إضافة، تعديل، وحذف عناوين الشحن. Payment Gateway: * تكامل مع Stripe لإنشاء جلسات دفع آمنة. * إدارة عمليات الدفع وإتمام الطلبات. الواجهة الأمامية (Frontend): * تطوير باستخدام Angular v19 مع إدارة الحالة باستخدام Signals. * تصميم متجاوب باستخدام PrimeNG و Tailwind CSS. * تحميل كسول (Lazy Loading) لتحسين الأداء. * مكونات قابلة لإعادة الاستخدام (Reusable Components). * تحسين تجربة المستخدم باستخدام ngx-spinner أثناء جلب البيانات. * تصميم واجهة احترافية استنادًا إلى تصميمات Figma. الأمان وتحسين الأداء (Security & Performance): * CORS للسماح بالوصول من النطاقات المصرح بها. * Helmet لتأمين الـ HTTP Headers. * Compression لضغط الردود وتحسين سرعة التحميل. * XSS Clean لمنع هجمات XSS. * Rate Limiting للحد من عدد الطلبات لكل IP. * معالجة الأخطاء مركزياً باستخدام AppError Class. التقنيات المستخدمة (Technologies Used): * Backend: Node.js، Express.js، MongoDB، Mongoose، JWT، bcryptjs، express-rate-limit، helmet، compression، xss-clean. * Frontend: Angular v19، Signals، PrimeNG، Tailwind CSS، ngx-spinner، Angular Router، Lazy Loading. طريقة الاستخدام (Usage): 1. إنشاء حساب جديد أو تسجيل الدخول. 2. تصفح المنتجات حسب التصنيفات. 3. إضافة المنتجات إلى العربة أو قائمة المفضلة. 4. إدارة العربة وإتمام عملية الدفع عبر Stripe. 5. تتبع الطلبات والمراجعات عبر لوحة التحكم.