تثبيت React وإعداده

في هذا الفصل، سنقوم بإعداد بيئة تطوير React. سنستخدم Create React App، وهي الأداة الرسمية التي يوصي بها فريق React لبدء مشروع جديد.

المتطلبات الأساسية

قبل أن تبدأ، تأكد من تثبيت ما يلي:

1. Node.js (الإصدار 14.0.0 أو أحدث)
2. npm (يتم تثبيته عادةً مع Node.js)

للتحقق من التثبيت، افتح الطرفية ونفّذ:

node --version
npm --version

إنشاء مشروع React جديد

أسهل طريقة لإنشاء تطبيق React جديد هي استخدام Create React App. إليك الخطوات:

1. افتح الطرفية ونفّذ الأمر التالي:

npx create-react-app mon-app-react

2. بعد اكتمال التثبيت، انتقل إلى مجلد المشروع:

cd mon-app-react

3. شغّل التطبيق في وضع التطوير:

npm start

يجب أن يكون تطبيقك الآن متاحًا على العنوان http://localhost:3000.

بنية المشروع

بعد الإنشاء، ستكون بنية مشروعك كما يلي:

mon-app-react/
  ├── node_modules/
  ├── public/
  │   ├── favicon.ico
  │   ├── index.html
  │   └── manifest.json
  ├── src/
  │   ├── App.css
  │   ├── App.js
  │   ├── App.test.js
  │   ├── index.css
  │   ├── index.js
  │   ├── logo.svg
  │   └── reportWebVitals.js
  ├── package.json
  └── README.md