نظام متجر إلكتروني متكامل بُني باستخدام إطار عمل Angular

عرض المنتجات وتفاصيلها بطريقة تفاعلية.

نظام عربة تسوق متكامل مع حفظ البيانات.

نظام تسجيل دخول وإنشاء حساب بمعايير أمان عالية.

المميزات الرئيسية

1. نظام إدارة المنتجات

عرض المنتجات في شكل شبكة أو قائمة مع إمكانية التصفح.

دعم تقييم المنتجات بنظام النجوم (5 نجوم مع دعم نصف النجوم).

صفحة تفاصيل المنتج مع عرض الصور والمعلومات الأساسية مثل:

السعر الأصلي وسعر الخصم.

التقييمات وعدد المراجعات.

حالة التوفر (متوفر / غير متوفر).

2. نظام عربة التسوق (Shopping Cart)

إضافة وإزالة المنتجات من العربة.

تعديل الكميات (زيادة/نقصان).

حساب المجموع الكلي تلقائيًا.

حفظ بيانات العربة في LocalStorage حتى بعد إغلاق المتصفح.

إشعارات تفاعلية عند إضافة أو تعديل المنتجات.

3. نظام المستخدمين (Authentication)

تسجيل الدخول (Login)

نموذج تسجيل دخول بتحقق قوي من البيانات باستخدام Reactive Forms.

تحقق من صحة البريد الإلكتروني باستخدام Regular Expressions.

متطلبات كلمة المرور:

8 أحرف على الأقل.

تحتوي على حروف كبيرة وصغيرة.

تحتوي على أرقام ورموز خاصة.

إنشاء حساب جديد (Register)

نموذج تسجيل بسيط وسهل الاستخدام.

تحقق من تطابق كلمة المرور مع حقل التأكيد.

إمكانية تطويره ليشمل مزيدًا من الحقول مثل رقم الهاتف والعنوان.

الجوانب التقنية

مبنية بإستخدام Angular مع أحدث الممارسات:

Standalone Components (مكونات مستقلة).

Reactive Programming باستخدام RxJS.

Routing متعدد الصفحات.

إدارة الحالة (State Management):

استخدام Services لمشاركة البيانات بين المكونات.

LocalStorage لحفظ بيانات العربة.

واجهة مستخدم متجاوبة (Responsive UI):

متوافق مع مختلف أحجام الشاشات (موبايل - تابلت - كمبيوتر).

تصميم نظيف وسهل الاستخدام.

الأمان:

تحقق من صحة البيانات قبل إرسالها.

كلمات مرور مشفرة (يمكن دمجها مع Firebase أو Backend API).

كيف يمكن تطويره مستقبلًا؟

ربطه بـ واجهة برمجة تطبيقات (API) مثل Firebase أو Node.js.

إضافة نظام الدفع الإلكتروني.

دعم اللغات المتعددة (الإنجليزية / العربية).

إضافة بحث متقدم وتصنيف المنتجات.

لماذا هذا المشروع مميز؟

كود نظيف ومنظم يسهل صيانته وتطويره.

واجهة مستخدم سهلة تحسن تجربة الزائر.

قابل للتوسيع بإضافة ميزات جديدة بسهولة.