0Pricing
React Academy · درس

تسمية الملفات وحدود المكوّنات وتسمية الخصائص

اعتمد اصطلاحات بسيطة: PascalCase للمكوّنات، ومجلدات واضحة، وحدودًا صغيرة للمكوّنات، وأسماء معبّرة للخصائص.

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

لماذا تساعد الاصطلاحات

الهدف: جعل قاعدة التعليمات البرمجية قابلة للتنبؤ.

  • ملفات المكوّنات بصيغة PascalCase
  • مكوّنات صغيرة ومركّزة
  • أسماء واضحة ووصفية للخصائص

قائمة سريعة بأسماء الملفات والمجلدات

  • الملفات: UserCard.jsx وProductList.jsx
  • المجلدات: components/UserCard وpages/Profile
  • التصديرات: افتراضية أو مسماة، لكن يجب أن تطابق اسم الملف

عرض تجريبي: شجرة مشروع مصغّرة

تخطيط صغير لمشروع يحتوي على ملفات مكوّنات بصيغة PascalCase.


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

عرض تجريبي: أجزاء صغيرة قابلة لإعادة الاستخدام

حافظ على تركيز المكوّنات: استخدم UserCard صغيرًا داخل Profile.


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

عرض تجريبي: خصائص واضحة وقيم افتراضية

استخدم أسماء وصفية للخصائص؛ واضبط قيمًا افتراضية بسيطة أثناء التفكيك.


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

قائمة تحقق

  • استخدم PascalCase للمكوّنات والملفات
  • ملف واحد ومكوّن رئيسي واحد
  • الخصائص: أسماء واضحة (label وonPress) وقيم افتراضية بسيطة

أفضل ممارسة لتسمية الملفات

ما التسمية الأنسب لملف مكوّن React؟

خلاصة

خلاصة: استخدم صيغة PascalCase لأسماء الملفات والمكوّنات، وحافظ على تركيز المكوّنات، واختر أسماء معبّرة للخصائص مع قيم افتراضية بسيطة.

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

هل درس «تسمية الملفات وحدود المكوّنات وتسمية الخصائص» مجاني؟

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

ماذا ستتعلم في «تسمية الملفات وحدود المكوّنات وتسمية الخصائص»؟

اعتمد اصطلاحات بسيطة: PascalCase للمكوّنات، ومجلدات واضحة، وحدودًا صغيرة للمكوّنات، وأسماء معبّرة للخصائص. تتمرن على React Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

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

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

كم من الوقت يستغرق درس «تسمية الملفات وحدود المكوّنات وتسمية الخصائص»؟

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

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

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

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

  1. ESLint وقواعد React وتكامل Prettier
  2. تسمية الملفات وحدود المكوّنات وتسمية الخصائص
  3. متغيرات البيئة وتنظيم الإعدادات
← العودة إلى React Academy