تطوير متجر عطور فاخر كامل: Next.js، Express، PostgreSQL

مشروع قطرات للعطور (Qatrat Perfumes) — متجر إلكتروني فاخر يجمع بين واجهة متجر للعملاء، لوحة تحكم للإدارة، وواجهة برمجية (REST API) على خادم واحد للمنطق والبيانات. الهدف تجربة شراء أنيقة (هوية بصرية «Luxury Midnight») مع إدارة طلبات ومخزون وتحليلات من لوحة منفصلة آمنة.

الموقع (واجهة العميل — Frontend)

تقنية: Next.js 15 مع React 19 وTypeScript، وتنسيق بـ Tailwind CSS، وحركات بـ Framer Motion.

تجربة المتجر: الصفحة الرئيسية، شبكة المنتجات، تفاصيل المنتج، سلة جانبية (Cart Drawer)، إتمام الطلب (Checkout)، تتبع الطلب برقم تتبع، تسجيل الدخول / إنشاء حساب، وصفحة الحساب.

دعم ضيف بدون حساب عبر بيانات الضيف في الطلب، مع تكامل مع الـ API العامة.

عناصر تجربة مستخدم إضافية مثل زر واتساب عائم (رقم من متغيرات البيئة).

الاتصال بالخادم عبر NEXT_PUBLIC_API_URL.

لوحة التحكم (Dashboard — Admin)

تطبيق Next.js منفصل عن المتجر (منفصل عن واجهة العملاء) يعمل على منفذ مخصص (مثلاً 3002 في التطوير)، لتقليل المخاطر وفصل الصلاحيات.

مسارات: تسجيل دخول المشرف، ثم لوحة تشمل على الأقل: نظرة عامة، المنتجات، الطلبات، المخزون، التحليلات (حسب هيكل المشروع في المستودع).

استخدام socket.io-client حيث يلزم تحديثات/تفاعل لحظي مع الخادم (حسب التطبيق الفعلي عندك).

رابط فتح المتجر من اللوحة عبر NEXT_PUBLIC_STORE_URL حيث يناسب.

الباك اند (Backend — API)

Node.js مع Express 5، هيكل وحدات (controllers, routes, middleware).

قاعدة بيانات PostgreSQL مع Prisma ORM (مخطط يشمل مستخدمين، أدوار، فئات، منتجات، عروض، سلة، طلبات، تقييمات، تفضيلات، سجلات طلبات، إلخ).

المصادقة: JWT للعملاء؛ مسارات الإدارة محمية بـ RBAC (مثلاً requireAdmin).

الطلبات: تدفق حالات من pending إلى processing ثم shipped ثم delivered (أو cancelled)؛ معرف تتبع فريد مثل QT-YYYYMMDD-XXXX ورقم فاتورة.

الدفع/الإتمام: إنشاء الطلب مع تخفيض المخزون تلقائيًا عند الطلب؛ دعم بيانات الضيف.

الفواتير والتتبع: استخراج فاتورة HTML عبر API؛ تتبع عام بالـ trackingId.

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

رفع الملفات: صور المنتجات/الأفاتار تُخزَّن محليًا وتُخدم من /uploads/ مع إعداد مجلد الرفع.

واجهات إضافية: تصنيفات، منتجات، عروض، سلة (بما في ذلك حزم)، مراجعات، اشتراك نشرة، نموذج اتصال، إلخ — كلها عبر REST موحد.

طريقة التنفيذ (باختصار)

تصميم ثلاثي: واجهة عميل + واجهة إدارية + API مركزية؛ قاعدة بيانات واحدة عبر Prisma؛ أسرار وبيئة عبر .env؛ جاهز للتشغيل المحلي ثم النشر على استضافة مناسبة.