0Pricing
React Academy · درس

اصطلاحات مجلد Hooks ووضع الاختبارات بجانب الشيفرة

أنشئ اصطلاحًا بسيطًا لـ hooks (البادئة use* والحفاظ على المنطق النقي)، وضع hooks في مجلدات الميزات، وأبقِ الاختبارات بجانب الوحدات التي تتحقق منها.

اصطلاحات مجلد Hooks ووضع الاختبارات بجانب الشيفرة درس مجاني في React Academy على CoddyKit. هذا هو الدرس 2 من أصل 3. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في React Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة React Academy 3 دروس في المجموع.

لماذا اصطلاحات الخطافات؟

الهدف: الحفاظ على ترتيب الخطافات وقابليتها للاختبار.

  • البادئات: use*
  • المنطق النقي داخل الخطافات، وواجهة المستخدم خارجها
  • وضع الاختبارات بجوار الوحدات

فكرة تخطيط المجلدات

  • features/counter/useCounter.js
  • features/counter/CounterPanel.jsx
  • features/counter/useCounter.test.jsx
  • ui/Button.jsx

نمط Hook: useCounter

تُرجع Hooks الحالة + الإجراءات؛ احرصوا على أن تكون API صغيرة وقابلة للتوقّع.

<div id="root"></div>

نمط Hook: إعادة استخدام useToggle

من السهل إعادة استخدام Hooks الصغيرة. يشترك مكوّنان في سلوك useToggle نفسه.

<div id="root"></div>

اختبار محاكاة: useCounter

احتفظوا بملف اختبار صغير بجوار Hook، مثل useCounter.test.jsx. نحاكي هنا عبارات التحقق.

<div id="root"></div>

نصائح وقائمة تحقق

  • سمّوا Hooks باستخدام use*
  • اجعلوا Hooks نقية (من دون DOM)، وأعيدوا منها API صغيرة
  • ضعوا الاختبارات بجوار Hooks والمكوّنات

التحقق من أساسيات وضع الاختبارات بجوار الوحدة

لماذا نضع الاختبارات بجوار المكوّن أو Hook قيد الاختبار؟

مراجعة

مراجعة: ضعوا Hooks صغيرة ونقية في مجلدات الميزات، وأعيدوا منها API بسيطة، وخزّنوا الاختبارات بجوار الوحدات مباشرةً حتى تنتقل معًا أثناء إعادة الهيكلة.

الأسئلة الشائعة

هل درس «اصطلاحات مجلد Hooks ووضع الاختبارات بجانب الشيفرة» مجاني؟

نعم — نص درس «اصطلاحات مجلد Hooks ووضع الاختبارات بجانب الشيفرة» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة React Academy، انتقل إلى CoddyKit PRO. تتضمن دورة React Academy 3 دروس في المجموع.

ماذا ستتعلم في «اصطلاحات مجلد Hooks ووضع الاختبارات بجانب الشيفرة»؟

أنشئ اصطلاحًا بسيطًا لـ hooks (البادئة use* والحفاظ على المنطق النقي)، وضع hooks في مجلدات الميزات، وأبقِ الاختبارات بجانب الوحدات التي تتحقق منها. تتمرن على React Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ React Academy؟

لا تُشترط خبرة سابقة. React Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 2 من أصل 3.

كم من الوقت يستغرق درس «اصطلاحات مجلد Hooks ووضع الاختبارات بجانب الشيفرة»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس React Academy هذا؟

نعم. كل درس في React Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. مجلدات الميزات والمكوّنات المرئية مقابل المركبة
  2. اصطلاحات مجلد Hooks ووضع الاختبارات بجانب الشيفرة
  3. إرشادات إعادة الهيكلة
← العودة إلى React Academy