نظام إدارة المنتجات هو تطبيق ويب تم تصميمه لتسهيل عملية إدارة بيانات المنتجات في المؤسسات التجارية أو المتاجر الإلكترونية.
يتيح هذا النظام للمستخدم إضافة المنتجات، تعديلها، حذفها، وعرضها بطريقة منظمة وسهلة الاستخدام.
يُعتبر هذا المشروع نموذجًا عمليًا لتطبيق عمليات CRUD (Create, Read, Update, Delete) على قاعدة بيانات باستخدام واجهة تفاعلية جذابة.
إضافة منتج جديد (Create):
يقوم المستخدم بإدخال بيانات المنتج مثل:
الاسم (Title)
السعر الأساسي (Price)
الضرائب (Taxes)
الإعلانات (Ads)
الخصم (Discount)
الفئة (Category)
يقوم النظام بحساب السعر الإجمالي تلقائيًا وعرضه بجانب الحقول.
عرض المنتجات (Read):
يتم عرض جميع المنتجات في جدول منسق يحتوي على:
رقم المنتج (ID)
الاسم
السعر
الضرائب
الإعلانات
الخصم
الإجمالي
الفئة
كما يحتوي الجدول على أزرار لتحديث أو حذف كل منتج.
تحديث بيانات المنتج (Update):
يمكن للمستخدم تعديل بيانات أي منتج موجود عبر زر “Update”، ويتم حفظ التغييرات فورًا.
حذف منتج أو جميع المنتجات (Delete):
يمكن حذف منتج معين باستخدام زر “Delete”.
كما يمكن حذف جميع المنتجات مرة واحدة عبر زر “Delete All”.
البحث عن المنتجات (Search):
يمكن البحث بطريقتين:
حسب الاسم (Title)
حسب الفئة (Category)
الخصائص الإضافية:
تصميم واجهة داكنة (Dark Mode) بتناسق ألوان أسود وأرجواني.
حساب تلقائي للإجمالي (Total = Price + Taxes + Ads - Discount).
دعم إنشاء عدة نسخ من المنتج نفسه في حال إدخال كمية.
تخزين البيانات في LocalStorage لحفظها بعد إغلاق المتصفح.
التقنيات المستخدمة:
HTML5 – لبناء هيكل الصفحة.
CSS3 – لتصميم الواجهة بطريقة عصرية وتفاعلية.
JavaScript (Vanilla JS) – لإدارة العمليات المنطقية والتفاعلية.
LocalStorage API – لتخزين البيانات محليًا على المتصفح دون الحاجة إلى قاعدة بيانات خارجية.
النتيجة النهائية:
يوفر النظام تجربة سهلة وسريعة لإدارة بيانات المنتجات، مما يساعد على تنظيم العمل وتقليل الأخطاء في الحسابات اليدوية، مع واجهة مرنة تدعم التحديث والحذف والبحث الفوري.