موقع عملي لإدارة المنتجات

قمت بتطوير موقع عملي لإدارة المنتجات باستخدام لغات الويب:

HTML – CSS – JavaScript – Bootstrap

مع التركيز على المنطق البرمجي باستخدام JavaScript لتقديم تجربة استخدام منظمة وسهلة.

يشمل المشروع:

خمسة حقول إدخال (Inputs):

حقل للاسم

حقل لفئة المنتج (Product Category)

حقلان لعملية حسابية (طرح / Subtraction) يتم تنفيذهما تلقائيًا

زر Add Product لإضافة البيانات المدخلة إلى جدول عرض المنتجات

وظائف JavaScript متقدمة:

إضافة البيانات إلى الجدول مباشرة مع كل نقرة على زر Add Product

مسح جميع حقول الإدخال تلقائيًا بعد الإضافة، لتسهيل إدخال بيانات جديدة بدون الحاجة للحذف اليدوي

وظيفة بحث (Search Filter) لعرض أي منتج بسرعة من خلال الاسم أو الفئة

زران لكل منتج داخل الجدول:

Edit للتعديل الفوري على البيانات

Delete لحذف أي منتج بسهولة

تحديث ديناميكي للجدول دون إعادة تحميل الصفحة

تجربة مستخدم سهلة وواضحة:

تم ترتيب الحقول والجدول بأسلوب بسيط ومتجاوب باستخدام Bootstrap، لضمان سهولة الوصول والقراءة على جميع الأجهزة.

هذا العمل يعكس مهارتي في:

JavaScript Logic – DOM Manipulation – Form Handling – Dynamic Tables – Responsive Layouts