هل يجب دراسة CSS و HTML قبل تعلم React

وعليكم السلام، أنا سعيدة بأنك تطرح هذا السؤال. فيما يتعلق بدراسة CSS و HTML، فهما جزء أساسي من تصميم وتطوير صفحات الويب. لذلك، يجب عليك دراسة هذه اللغات إذا كنت ترغب في أن تصبح مطور ويب محترف. 

أما بالنسبة لـ React، فهو إطار عمل جافاسكريبت يستخدم لتطوير واجهات المستخدم. إذا كان هدفك هو تطوير تطبيقات الويب المعقدة، فإن دراسة React ستكون ضرورية. 

لا يجب أن تعتبر HTML مثل JSX، حيث أن HTML هي لغة وصفية لتحديد بنية صفحات الويب، في حين أن JSX هو اختصار لـ JavaScript XML وهو جزء من React. 

إذا كان لديك الوقت والإمكانية، فأقترح عليك دراسة CSS و HTML قبل التحول إلى دراسة React. وإذا كان هدفك هو التخصص في React، فلا بأس بالانتقال مباشرة إلى دراسة React مع التأكد من فهم أساسيات JavaScript.

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

أولاً، يجب فهم أن HTML و CSS هما لغتان مختلفتان عن JavaScript و React.

HTML و CSS هما لغتان تستخدمان لتصميم صفحات الويب وتنسيقها، في حين أن JavaScript و React يستخدمان لتطوير تطبيقات الويب المتقدمة وإدارة حالة التطبيق.

لذلك، إذا كنت تريد تعلم React وتطوير تطبيقات الويب المتقدمة، فمن الضروري أن تتعلم JavaScript وReact بشكل جيد. ومن المفيد أيضًا أن تتعلم HTML و CSS بشكل أساسي لأنها تساعد في فهم كيفية بناء صفحات الويب وتصميمها بشكل أفضل.

أما بالنسبة للمقارنة بين HTML وJSX، فإن JSX هي لغة تم إنشاؤها بواسطة Facebook والتي تستخدم في React لتصميم واجهات المستخدم.

وتتيح للمطورين كتابة شفرة JavaScript وإنشاء عناصر واجهة المستخدم في نفس الملف، مما يجعل الكود أكثر قراءة وفهمًا.

على الرغم من أن JSX يشبه HTML في بعض النواحي مثل العناصر والخصائص ولكنها لغة مختلفة وتختلف عن HTML في عدد من الأمور مثل طريقة تعريف الخصائص والأحداث والتفاعلات وبعض العناصر الإضافية التي تدعمها JSX ولا تدعمها HTML.

فيما يلي بعض الأمثلة للتوضيح:

مثال على كود HTML:

<div class="my-class" id="my-id">Hello World!</div>

مثال على كود JSX:

<div className="my-class" id="my-id">Hello World!</div>

في هذا المثال، نرى عنصرًا div يحتوي على نص "Hello World!" ويتم تعريفه في HTML وJSX. ولكن هناك بعض الاختلافات في كيفية تعريف العنصر.

في HTML، يتم استخدام الخاصية class لتحديد الفئات الخاصة بالعنصر، في حين يتم استخدام id لتحديد معرف العنصر. ومن المهم التأكد من عدم استخدام نفس العنصر مع نفس المعرف في نفس الصفحة.

في JSX، تستخدم className بدلاً من class، وذلك لأن class هي كلمة محجوزة في JavaScript، ولا يمكن استخدامها كخاصية. ويمكن استخدام id كما هو في HTML.

هذا مثال بسيط، ولكن يعرض الفرق الأساسي في تعريف العناصر في HTML وJSX.

تعلم الأساسيات أولاً 

بما أن JSX يستخدم في React فقط، فمن المهم أيضًا تعلم JavaScript بشكل جيد حتى تتمكن من فهم كيفية كتابة الشفرة في React. يتضمن ذلك فهم المتغيرات والدوال والعبارات الشرطية والحلقات ومفاهيم أخرى.

علاوة على ذلك، يمكن أن يساعد تعلم CSS في تحسين تصميم واجهة المستخدم في React. فعلى الرغم من أن React يستخدم JSX لتصميم واجهات المستخدم، إلا أنه يمكن استخدام CSS لتحسين تنسيق العناصر والإضافات إليها.

والأفضل والأصح هو تعلم HTML و CSS و JavaScript بشكل جيد إذا كنت تريد تطوير تطبيقات الويب المتقدمة باستخدام React. ولكن إذا كنت تركز بشكل رئيسي على React، فيمكنك البدء مباشرة في تعلمه والتركيز على فهم كيفية استخدامه وبناء تطبيقات الويب المتقدمة باستخدامه.

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

وأيضًا ستكتسب القدرة على التنقل ما بين إطارات العمل مثل Angular و رVue لأنك قمت بتعلم الأساسيات.

أولاً يجب عليك معرفة أن ال React هي مكتبة JavaScript لبناء واجهات المستخدم التفاعلية وبالتالي فإن ال React لا تعتبر من أساسيات تطوير الواجهات الأماميه مثل ال HTML و CSS و ال JavaScript وهي اللغات الأساسية في مجال تطوير الواجهات الأمامية 

لذلك قبل تعلم التقنيات يجب علينا تحديد مجال العمل أولاً وبما أن تريد العمل بمجال تطوير الواجهات الأمامية  فلا يمكنك تخطي ال  HTML و CSS و ال JavaScript لذلك الحل هو 

• دراسة ال HTML و CSS من دورة تطوير واجهات المستخدم الموجودة في الأكاديمية 
• إذا لم يكن الحل السابق مناسب بالنسبة لك فالأفضل هو التفرغ لمدة أسبوع لدراسة أساسيات ال HTML و CSS من خلال المقالات الموجودة في الأكاديمية ولن تأخذ منك الكثير من الوقت وبعدها يمكنك متابعة الدروس في react رابط دروس ال HTML   ورابط دروس ال CSS

من خلال التوثيق الرسمي ل React يفترض أن 

اقتباس

المتطلبات

سنفترض أن لديك بعض الخبرة بلغتي HTML و JavaScript ، ولكن يجب أن تتمكن من متابعة الدروس حتى لو كنت تأتي من لغة برمجة مختلفة. سنفترض أيضًا أنك ملم بمفاهيم البرمجة مثل الدوال والكائنات والمصفوفات وإلى حد أقل الفئات.