رد الفعل التعليمي

التعلم بالأمثلة

تسهل أداة "Show React" شرح React. يظهر كلاً من الرمز والنتيجة.

import React from 'react';
import ReactDOM from 'react-dom';

function Hello(props) {
  return <h1>Hello World!</h1>;
}

ReactDOM.render(<Hello />, document.getElementById('root'));

التعلم عن طريق التمارين

ReactDOM.(myElement, document.getElementById('root'));

رد الفعل مسابقة

اختبر مهاراتك في التفاعل باختبار.

رد الفعل مسابقة

أنشئ تطبيق React

لتعلم React واختبارها ، يجب عليك إعداد بيئة React على جهاز الكمبيوتر الخاص بك.

يستخدم هذا البرنامج التعليمي ملف create-react-app.

الأداة create-react-appهي طريقة مدعومة رسميًا لإنشاء تطبيقات React.

مطلوب Node.jscreate-react-app للاستخدام .

افتح الجهاز الطرفي في الدليل الذي ترغب في إنشاء تطبيقك فيه.

قم بتشغيل هذا الأمر لإنشاء تطبيق React باسم my-react-app:

create-react-app سيُنشئ كل ما تحتاجه لتشغيل تطبيق React.

قم بتشغيل تطبيق React

قم بتشغيل هذا الأمر للانتقال إلى my-react-appالدليل:

قم بتشغيل هذا الأمر لتنفيذ تطبيق React my-react-app:

ستظهر نافذة متصفح جديدة مع تطبيق React الذي تم إنشاؤه حديثًا! إذا لم يكن كذلك ، افتح المتصفح واكتب localhost:3000في شريط العناوين.

النتائج:

ما يجب أن تعرفه بالفعل

قبل البدء بـ React.JS ، يجب أن تكون لديك خبرة متوسطة في:

• لغة البرمجة
• CSS
• جافا سكريبت

يجب أن يكون لديك أيضًا بعض الخبرة مع ميزات JavaScript الجديدة المقدمة في ECMAScript 6 (ES6) ، وسوف تتعلم عنها في فصل React ES6 .