هذه هي التقنيات والواردات التي استخدمتها في الكود الخاص بي:
- قيم TailwindCSS المخصصة، والرسوم المتحركة، والتأثيرات عند توجه الماوس للأزرار وضغطهاز
- استخدام `BrowserRouter` لإدارة المسارات و`Link` للتنقل بين هذه المسارات.
- استخدام `useState` و `useEffect` للعديد من العمليات، وأهمها التعامل مع عدد العناصر في السلة وإضافة تفاصيل المنتج إليها دون تكرار أو حدوث خلل في زر "إضافة إلى السلة" عند النقر على "إزالة الكل" في قسم السلة.
- استخدام `localStorage.setItem` و `getItem.` و `removeItem.` لوضع تفاصيل المنتج في السلة عند الضغط على "إضافة إلى السلة".
- إدارة إعدادات تسجيل الدخول عبر Google OAuth، بما في ذلك `googleLogout`، و `useGoogleLogin`، و `axios` لضمان تسجيل الدخول بنجاح وعرض تفاصيل الحساب في مكون `Nav` (تسجيل الدخول العادي لا يزال قيد التطوير).
- ملف `index.js` يحتوي على بعض الثوابت التي تعمل كقاعدة بيانات محلية لتسهيل تصديرها إلى المكونات.
- استخدام `useRef` لإدارة السلايدر (carousel) وأزرار التنقل الخاصة به بسهولة في قسم تفاصيل المنتج (`/product/:product-name`).
- استخدام `JSON.parse` و `JSON.stringify` لجلب عدد العناصر في السلة وتحديثه في `localStorage`.
- استخدام `.parse` و `parseFloat`** لحساب السعر الإجمالي للمنتجات المضافة إلى السلة وعرضه على الصفحة.