متجر إلكتروني تفاعلي واحترافي - Front-End Angular

تفاصيل العمل

"FastCart - متجر إلكتروني متكامل بنظام (SPA) باستخدام Angular"هذا المشروع هو تجسيد عملي لخبرتي في تطوير تطبيقات الويب الحديثة (Single Page Applications) باستخدام إطار العمل Angular، حيث تم بناء متجر إلكتروني متكامل يحاكي مواقع التجارة العالمية من حيث السرعة، الأداء، وتجربة المستخدم.

الموقع ليس مجرد واجهة، بل هو نظام مترابط يستهلك واجهات برمجية (RESTful APIs) لإدارة العمليات بالكامل بدءاً من تسجيل الدخول وحتى إتمام الطلب.

التقنيات والمهارات البرمجية المستخدمة (Technical Stack):

• أحدث إصدارات Angular: بناء هيكلية المشروع (Architecture) تعتمد على الـ Modular Design لضمان سهولة الصيانة والتطوير.

• الربط مع الـ APIs (API Integration): استخدام HttpClient للتواصل مع السيرفر (Backend) لجلب المنتجات، التصنيفات، والماركات، وإرسال بيانات الطلبات.

• إدارة الحالة (State Management): استخدام RxJS و Observables لمزامنة البيانات لحظياً بين المكونات (مثل تحديث عدد عناصر السلة فوراً عند الإضافة من أي مكان بالموقع).

• نظام التوجيه والحماية (Routing & Guards): تأمين صفحات المستخدم (مثل الدفع والطلبات) باستخدام CanActivate Guards لمنع الوصول غير المصرح به.

• معالجة الأخطاء (Interceptors): استخدام HttpInterceptors لإرفاق الـ Token تلقائياً مع الطلبات ومعالجة الأخطاء بشكل مركزي.

المميزات الوظيفية للمشروع (Key Features):

1. نظام مصادقة متكامل (Authentication): تسجيل دخول، إنشاء حساب، واستعادة كلمة المرور (Forgot Password) مع إدارة الـ Tokens.

2. تجربة تسوق ديناميكية:

• عرض المنتجات وتصفيتها حسب الفئة (Category) أو العلامة التجارية (Brand).

• بحث حي وسريع عن المنتجات.

• صفحة تفاصيل المنتج (Product Details) مع صور متعددة ومعلومات دقيقة.

3. سلة الشراء والدفع (Cart & Checkout):

• إضافة وحذف المنتجات وتعديل الكميات بمرونة تامة.

• إتمام عملية الشراء (Checkout) واختيار طريقة الدفع (Cash on Delivery أو Online Payment).

4. قائمة الرغبات (Wishlist): إمكانية حفظ المنتجات المفضلة للرجوع إليها لاحقاً.

5. واجهة مستخدم تفاعلية (UI/UX):

• تصميم Responsive يعمل بكفاءة على الموبايل واللابتوب.

• شاشات تحميل (Loading Spinners) لتحسين تجربة الانتظار.

• إشعارات تنبيهية (Toastr Notifications) لتأكيد العمليات (نجاح الإضافة للسلة، أخطاء التسجيل.. إلخ).

هذا المشروع يثبت قدرتي على استلام API جاهز وتحويله إلى تطبيق ويب كامل، سريع، وخالٍ من الأخطاء.

بطاقة العمل

اسم المستقل
عدد الإعجابات
0
عدد المشاهدات
12
تاريخ الإضافة
تاريخ الإنجاز
المهارات