E-Commerce (MERN Stack)

متجر إلكتروني متطور يقدم تجربة تسوق فريدة وآمنة. ينقسم المشروع إلى قسمين رئيسيين: جزء المستخدم وجزء المسؤول.

ميزات المستخدم:

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

نسيان كلمة المرور: توفير وسيلة لإعادة ضبط كلمة المرور في حال فقدانها.

إضافة لقائمة الرغبات: يمكن للمستخدمين إضافة المنتجات إلى قائمة الرغبات للمراجعة لاحقاً.

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

الدفع: توفير واجهة دفع آمنة وموثوقة لإتمام عمليات الشراء.

تصفية البحث: إمكانية تصفية المنتجات حسب الفئة، اللون، والعلامة التجارية.

ميزات المسؤول:

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

معالجة الطلبات: إمكانية قبول الطلبات الجديدة أو حذفها من قبل المسؤول.

متابعة الرسائل: توفير واجهة لمتابعة وإدارة رسائل الزبائن والاستفسارات.

بعض الحزم المستخدمة:

react-redux: لإدارة حالة التطبيق وإدارة البيانات.

axios: لإجراء طلبات HTTP إلى الخادم.

react-router-dom: لإدارة توجيهات التطبيق.

react-toastify: لعرض إشعارات المستخدم بشكل مرئي.

react-bootstrap: لاستخدام مكونات وتصميمات مسبقة في واجهة المستخدم.

react-helmet: لإدارة العناوين والوصف والعلامات الأخرى لصفحات HTML.

cloudinary: لإدارة وتخزين الوسائط مثل الصور.

bcryptjs: لتشفير كلمات المرور لتوفير أمان إضافي.

multer: لمعالجة تحميل الملفات.

swiper: لتوفير ميزات الانزلاق والتصفح في الواجهة.

yup: لإجراء التحقق من البيانات والتحقق من صحة المدخلات.

compression: لضغط ملفات CSS و JavaScript لتحسين أداء التحميل.

uniqid: لإنشاء معرفات فريدة للمنتجات والعناصر الأخرى.

body-parser: لتحليل وتحويل طلبات HTTP.

يتميز المشروع بتصميم متجاوب وواجهة مستخدم جذابة، مع الاهتمام بأدق التفاصيل لضمان تجربة مستخدم سلسة وممتعة.