موقع تجارة إلكترونية باستخدام React، Tailwind CSS، وReact Query
التقنيات المستخدمة:
React.js: لبناء واجهة مستخدم ديناميكية وسريعة الاستجابة.
Tailwind CSS: لتصميم واجهات أنيقة ومتجاوبة بسهولة.
Hero UI (Headless UI): لإنشاء نوافذ منبثقة (Modals) وقوائم منسدلة (Dropdowns) احترافية.
Context API: لإدارة الحالة العامة للتطبيق.
React Query: لإدارة البيانات القادمة من الـ API وتحسين الأداء.
React Router DOM: لتنظيم التنقّل بين الصفحات بسلاسة.
أهم المميزات:
نظام عربة التسوق (Add to Cart): يعمل بتحديث فوري لتجربة مستخدم سلسة.
تصفية المنتجات والبحث: لسهولة الوصول إلى المنتجات المطلوبة.
صفحة تفاصيل المنتج: بتصميم بسيط وسهل التصفح.
نوافذ منبثقة وقوائم تفاعلية: باستخدام Hero UI.
أداء محسن واستجابة عالية: بفضل استخدام React Query في جلب البيانات وتخزينها المؤقت (Caching).
تصميم متجاوب بالكامل: يعمل بسلاسة على مختلف الأجهزة.
دوري في المشروع:
تطوير الواجهة الأمامية بالكامل باستخدام React وTailwind CSS.
إدارة الحالة العامة للتطبيق باستخدام Context API.
تحسين الأداء وتحديث البيانات في الوقت الحقيقي باستخدام React Query.
تصميم تجربة مستخدم متكاملة تشمل نظام العربة، التصفية، والبحث.
بناء واجهة متجاوبة وسريعة مع تطبيق معايير الأداء الحديثة.