متجر إلكترونيات عربي متكامل | Madar Ecommerce

متجر إلكترونيات عربي متكامل (مدار) لبيع الجوالات والآيباد والساعات الذكية والإكسسوارات، صممته وبنيته من الصفر بواجهة RTL متجاوبة، مع تجربة شراء كاملة تبدأ من تصفح الأقسام والعروض والبحث والتصفية، مرورًا بصفحة المنتج واختيار المتغيرات والكمية والمخزون، وحتى السلة وإتمام الطلب والدفع وتتبع الطلب.

يتضمن المشروع واجهة متجر متعددة الصفحات، وحسابات العملاء، وقائمة المفضلة، وسلة محفوظة على الخادم، وإتمام شراء للزائر، وصفحات تتبع الطلب والطلبات السابقة، مع دعم كامل للعربية RTL والإنجليزية LTR.

نفذت الدفع عبر PayTabs خلف طبقة تجريد (Payment Gateway Registry) مع وضع تجريبي آمن عند غياب بيانات التاجر، ودعم مدى وفيزا وماستركارد، وواجهة جاهزة لتفعيل تابي وتمارا. يعتمد تأكيد الطلب على التحقق من الخادم للبيانات والمخزون، مع معالجة الـ webhook والـ callback بشكل idempotent.

يشمل المشروع لوحة إدارة عربية للمنتجات والطلبات: إضافة وتعديل وحذف المنتجات مع رفع الصور، وإدارة الطلبات وتحديث الحالات (مدفوع/تم الشحن/مسترد) مع إعادة المخزون عند الاسترجاع، وصلاحيات وصول للمدير فقط.

من أصعب الأجزاء معالجة البيع الزائد عند الطلبات المتزامنة، وتم حلها بتحديثات ذرية داخل معاملات قاعدة البيانات، إضافة إلى حماية النماذج بـ CSRF وTurnstile والتحقق من المدخلات بـ Zod على الخادم.

التقنيات المستخدمة: Next.js 16 (App Router)، React 19، TypeScript، Tailwind CSS 4، PostgreSQL 18، Prisma 7، Better Auth، next-safe-action، React Hook Form، next-intl، Vitest وPlaywright وaxe-core. المشروع مغطى بـ 45 اختبار وحدة و24 اختبار تكامل و34 اختبار E2E في متصفح حقيقي، مع فحص وصول WCAG A/AA.