Ls Command
1) ما هو أمر ls ولماذا نستخدمه؟ أمر ls اختصار لـ List، ووظيفته عرض محتويات المجلد: يعني بدل ما “تدخل” كل مجلد لتعرف ماذا بداخله، ls يريك المحتويات بسرعة. 2) الصيغة العامة (Syntax) 3) الاستخدام الأساسي لأمر ls أ) عرض…
صفحة التصنيفات
نمشي كذا: 1️⃣ شكل البيانات (افتراض بسيط يشبه اللي عندك) 🔹 ملف التصنيفات: categories_data.dart 🔹 ملف المنتجات: products_data.dart 🔹 موديل المنتج: productModel.dart (المهم هنا حقل التصنيف) 2️⃣ من كارد التصنيف → الانتقال لصفحة التصنيف مع تمرير الاسم افترض عندك صفحة…
تقييم النجوم للمنتج
خلّينا نعملها كـ ⭐⭐⭐⭐⭐ تقدر تغيّرها بالضغط، وبنفس الوقت تقدر لاحقًا تربطها بقاعدة بيانات. 1️⃣ منطق التقييم (ببساطة) 2️⃣ إضافة متغيّر للتقييم في صفحة التفاصيل داخل _ProductDetailsPageState: 3️⃣ ودجت لعرض النجوم والتفاعل معها أضِف هذه الدالة داخل نفس الكلاس: هذا…
مجموع سعر المنتجات
1️⃣ أولًا: تأكد أن الـ Product فيه سعر في الـ ProductModel (مثال): وفي ملف الـ data: 2️⃣ في صفحة التفاصيل: استخدم السعر * الكمية داخل State: 3️⃣ عرض السعر + السعر الإجمالي في الواجهة مثال: تحت الكمية مباشرة نعرض السعر…
صفحة التصنيفات
صفحة (Screen) للتصنيف تُعرض فيها فقط المنتجات اللي تنتمي لهذا التصنيف. رح نمشي بهالخطوات: 1️⃣ تعديل الـ ProductModel وإضافة التصنيف خلينا نفترض عندك Product شبيه بهذا (عدّل حسب موديلك): بإمكانك تخليها String بسيطة أو لاحقًا تحوّلها لـ enum، بس كبداية…
إضافة المقاسات للمنتج
فكرة المقاسات (S – M – L – XL …) هي نفس فكرة الألوان تماماً،لكن بدل ما نعرض مربعات ألوان، نعرض أزرار أو مربعات نصية فيها المقاس. المبدأ نفسه: وسأشرح لك كيف تطبّقها خطوة خطوة 👇 ✅ 1) تعديل الـ…
إضافة الالوان للمنتج
1️⃣ تعديل الـ Model (لو لسه ما فيه ألوان) لنفرض إن عندك Product بهذا الشكل (مثال): نضيف له حقل خاص بالألوان، وليكن قائمة أرقام int تمثل ألوان ARGB: استخدمنا List<int> بدل List<Color> لأن أسهل شيء تخزن الألوان كقيمة رقمية مثل…
إضافة أزرار الزيادة والنقصان للكمية
1️⃣ إضافة متغيّر الكمية في الـ State داخل _ProductDetailsPageState: 2️⃣ ويدجت لبناء زر + رقم + زر – أضِف هذه الدالة داخل نفس الكلاس: تقدر تستبدل GestureDetector + Container بـ IconButton لو تحب شكل أبسط. 3️⃣ استدعاء الودجت داخل الـ…
createAsyncThunk 2
0️⃣ أوّل شيء: مشكلة صغيرة في الـ import أنت كاتب: في react-hot-toast الصحيح هو: إذن غيّر السطر الأوّل إلى: وباقي الكود يمشي عادي مع toast.error(…). (وبرضه الجملة اللي في التوست تقول “تم جلب البيانات بنجاح” والأفضل تخليها toast.success 😉، راح…
createAsyncThunk
سأقسّم الشرح لمراحل: 1️⃣ تركيب المكتبات المطلوبة لو ما ركّبتها من قبل: 2️⃣ عمل ملف Axios مستقل (اختياري لكنه أفضل تنظيمًا) ملف: api.js الفائدة: لو بكرا غيرت الـ baseURL أو أضفت توكن، تعدّل مكان واحد فقط. 3️⃣ إنشاء Slice للتعامل…