مراجعة مكونات Reactتدريب على البرمجة

مراجعة مكونات React: الحالة والخطافات وإعادة العرض

التسليم من 1 يومالتعديلات مشمولةفحص الجودة
الباقات
حماية الدفعالتفاصيل
  • التعديلات ضمن الباقة مجانية.
  • إذا لم تردّ خلال 3 أيام من التسليم، يُقبل العمل تلقائيًا.
اطلب · ‏35 US$

يُحجز المبلغ عند الدفع ولا يُحوَّل إلا بعد قبولك العمل.

مراجعة مكونات React: الحالة والخطافات وإعادة العرض

مثال على النتيجة

مثال على الباقة القياسية

مراجعة شيفرة: سكربت Python لاستيراد الطلبات في متجر إلكتروني صغير

ماذا تفعل الشيفرة

  1. تقرأ orders.csv من ملف التصدير.
  2. لكل سطر طلب، تبحث عن المنتج برمز SKU في stock.xlsx وتطرح الكمية.
  3. تكتب المخزون المحدّث وتسجّل الإجماليات في import_log.txt.

البنية واضحة وأسماء الدوال جيدة. معظم المشكلات تتعلق بمدخلات لا تأتي بالشكل الذي يتوقعه السكربت.

الأخطاء ونقاط الضعف

#السطرالخطورةالمشكلة
148عاليةيمكن استيراد ملف CSV نفسه مرتين؛ لا يوجد تحقق من أرقام الطلبات المعالجة سابقًا. هذا السبب الأرجح للمخزون السالب.
272عاليةint(row["qty"]) يتعطل مع القيم الفارغة أو "2.0" في الطلبات المستردة.
395متوسطةالبحث عن SKU حساس لحالة الأحرف: "gt-101" و"GT-101" يُعامَلان كمنتجين مختلفين.
4130متوسطةيُفتح الملف دون encoding="utf-8"، فتتلف أسماء المنتجات العربية على Windows.
5201منخفضةexcept: المجرد يخفي الأخطاء الحقيقية ويجعل السجل بلا فائدة.

مقاطع مصحّحة

المشكلة 1: تجاوز الطلبات المستوردة مسبقًا

processed = load_processed_ids("processed_orders.txt")
for row in reader:
    if row["order_id"] in processed:
        continue
    # ... المنطق الحالي ...
    processed.add(row["order_id"])
save_processed_ids("processed_orders.txt", processed)

السبب: يُطبَّق كل طلب مرة واحدة، حتى لو شغّلت السكربت على الملف نفسه مجددًا.

المشكلة 2: قراءة الكمية بأمان

raw = (row.get("qty") or "").strip()
try:
    qty = int(float(raw))
except ValueError:
    log.warning("الطلب %s: كمية غير صالحة %r، تم تجاوزه", row["order_id"], raw)
    continue

السبب: تُتجاوز الأسطر المستردة كليًا أو جزئيًا مع ملاحظة واضحة، بدل إيقاف الاستيراد كله.

المشكلة 3: توحيد رموز SKU

sku = row["sku"].strip().upper()

طبّقي .strip().upper() نفسها عند بناء قاموس المخزون.

الأسلوب وسهولة القراءة

  • الدالة process() طولها 90 سطرًا؛ قسّميها إلى read_orders وapply_to_stock وwrite_report.
  • استبدلي أرقام الأعمدة الثابتة (row[7]) بأسماء العناوين.

يُرجى اختبار كل إصلاح على نسخة من ملفاتك: قرأنا الشيفرة لكننا لم نشغّلها.

العميل: صاحبة متجر شاي إلكتروني كتبت سكربت Python من 310 أسطر يستورد الطلبات من ملف CSV المُصدَّر إلى جدول المخزون المشكلة المبلّغ عنها: "أحيانًا يصبح المخزون سالبًا، ويتعطل السكربت مع بعض الملفات."

العميل وجميع التفاصيل افتراضية.

عن هذه الخدمة

معظم أخطاء React تأتي من مواضع قليلة: useEffect بقائمة تبعيات خاطئة، أو حالة منسوخة من props، أو key مفقود في قائمة، أو قيمة قديمة محبوسة في closure. نراجع مكوناتك، ونشرح متى يُعرض كل منها ولماذا، ونشير إلى الخطافات والحالة التي تسبب الحلقات أو الوميض أو إعادة العرض الزائدة. تستلم شيفرة مكونات مصحّحة مع شرح بسيط لكل تغيير.

ما المشمول

  • ما الذي تحصل عليهمراجعة مكتوبة في صفحة الطلب: كيف تُعرض مكوناتك، وقائمة بمشكلات الخطافات والحالة حسب الأهمية، وأجزاء مصحّحة من المكونات. وتضيف الباقة المميزة نصائح حول تقسيم المكونات وأين يجب أن تكون الحالة.
  • فحص useEffectالتبعيات والتنظيف والحلقات
  • موضع الحالةالحالة المشتقة ورفعها للأعلى
  • إعادة العرضلماذا يُعرض المكوّن مرة أخرى
  • القوائم والمفاتيحمفاتيح ثابتة وتحديث القوائم
  • مكونات مصحّحةمع أسباب كل تغيير

كيف يعمل

  1. 1
    متطلبات الطلبتلصق المكونات والتحذيرات
  2. 2
    القراءةنتتبع props والحالة والتأثيرات
  3. 3
    المراجعةتستلم المشكلات والشيفرة المصحّحة

ما نحتاجه منك

المكونات ملصوقة كنص أو كلقطات شاشة، وإصدار React وإطار العمل، وما يجب أن تفعله الشاشة، والتحذيرات أو الأخطاء التي تظهر لك.

سنسألك:

  • ما إصدار React وإطار العمل؟
  • أين تحتفظ بالحالة؟
  • ما الخطأ الذي يظهر على الشاشة؟
  • هل تستخدم TypeScript؟

قارن بين الباقات

الباقاتالأساسيةمكونات حتى 100 سطر‏15 US$القياسيةمكونات حتى 400 سطر‏35 US$المميزةحتى 1,000 سطر مع نصائح حول البنية‏69 US$
مدة التنفيذ1 يوم2 يوم3 أيام
التعديلات123
أسطر الشيفرةحتى 100حتى 400حتى 1,000
أجزاء مصحّحةنعمنعمنعم
نصائح حول البنيةلالانعم
اطلب الأساسيةاطلب القياسيةاطلب المميزة

حماية الدفع

تدفع عند الطلب، لكن المبلغ لا يُحوَّل إلا مقابل عمل قبلته.

  • سعر ثابتلا يتغير سعر الباقة بعد الدفع.
  • المبلغ محجوزعند الدفع، يُحجز المبلغ فقط. ولا يُحوَّل إلى Dleex إلا بعد قبولك العمل.
  • فحص قبل التسليمتخضع كل نتيجة لفحص الجودة قبل أن تصل إليك، وتراها في صفحة الطلب قبل قبولها.
  • تعديلات مجانيةاطلب تعديلات ضمن متطلبات طلبك بالعدد الذي تسمح به الباقة.
  • القبول بعد 3 أيامإذا لم تقبل العمل ولم تطلب تعديلات خلال 3 أيام من التسليم، يُقبل تلقائيًا. وإذا كتبت في محادثة الطلب بعد التسليم، يبقى الطلب قيد الانتظار؛ وبعد ردّنا، قد نعيد بدء مهلة 3 أيام وسنُعلمك بذلك في المحادثة.
  • إعادة التنفيذ أو استرداد المبلغ كاملًاإذا لم تطابق النتيجة متطلبات طلبك ولم تُصلحها التعديلات، أو استغرق العمل أكثر من ضعف مدة التنفيذ، فاكتب في محادثة الطلب: سنعيد تنفيذ العمل أو نردّ إليك المبلغ كاملًا.
كيف يعمل →

الأسئلة والأجوبة

هل تشغّلون شيفرتي؟

لا. نقرأها بعناية ونحلل سلوكها منطقيًا، لكننا لا نشغّلها، لذا اختبر كل إصلاح مقترح في مشروعك.

هل يجب أن أغلّف كل شيء بـ useMemo وuseCallback؟

غالبًا لا. نبيّن أين يفيد التخزين المؤقت للنتائج وأين لا يضيف سوى التعقيد، بناءً على طريقة عرض مكوناتك فعليًا.

هل تراجعون مكونات الخادم في Next.js؟

نعم. أخبرنا أي الملفات مكونات خادم وأيها مكونات عميل، وسنتحقق مما يعمل في كل جهة.

الباقات
اطلب · ‏35 US$· 2 يوم