Atelier – React E-commerce Store

قمتُ بتصميم وتطوير متجر إلكتروني بسيط وأنيق لبيع الملابس مستوحى من العلامات التجارية الفاخرة مثل COS وEverlane وArket. تم بناء الواجهة الأمامية باستخدام React 18 وTypeScript وVite، بينما تم تطوير الواجهة الخلفية باستخدام Express.js مع قاعدة بيانات SQLite.

يتضمن المتجر كتالوج منتجات متجاوب بتخطيط شبكي (Grid Layout)، وصفحات تفصيلية للمنتجات مع إمكانية اختيار المقاس، بالإضافة إلى لوحة تحكم متكاملة للمشرف (Admin Dashboard) تتيح تنفيذ عمليات CRUD لإدارة المنتجات (إضافة، تعديل، حذف، وعرض).

تم تصميم واجهة المستخدم باستخدام Tailwind CSS مع مكونات shadcn/ui، ويعتمد التصميم على ألوان محايدة دافئة مع لمسات بلون التيراكوتا، إلى جانب حركات انتقالية خفيفة تضيف لمسة جمالية للتجربة. تتم إدارة حالة البيانات باستخدام TanStack Query (React Query) مع استخدام React Router للتنقل بين الصفحات.

كما يتضمن المشروع RESTful API يحتوي على 5 نقاط اتصال (Endpoints)، بالإضافة إلى سكربت لتهيئة قاعدة البيانات (Database Seeding) يتضمن 20 منتجًا تجريبيًا لعرض المتجر وتشغيله بسهولة.