إضافة React إلى تطبيق جديد
أسهل طريقة للبدء بمشروع React جديد هي استخدام عدّة البدء.
ملاحظة: تشرح هذه الصّفحة إعداد تطبيق صفحة واحدة (single-page application) مع كل شيء تحتاجه من أجل سير عمل التطوير بسلاسة، بما في ذلك اكتشاف الأخطاء (linting)، والاختبار، وتحسينات الإنتاج، والمزيد من ذلك. تتطلّب هذه الأدوات كاملة المواصفات بعض الوقت ومساحة من القرص لتثبيتها.
إن كنت تبحث عن بيئة خفيفة لتجربة React، فاذهب إلى صفحة تجربة React بدلًا من ذلك. فقد يكون ملف HTML الوحيد المذكور في تلك الصّفحة كافيًا لكي تبدأ.
أخيرًا، إن لم تكن تبني تطبيق صفحة واحدة، فبإمكانك إضافة React إلى تطبيقك الحالي أو استخدامها عبر شبكة توزيع المحتوى (اختصارًا CDN) وبدون إنجاز خطوة البناء.
إنشاء تطبيق React
إنّ أفضل طريقة للبدء ببناء تطبيق صفحة واحدة في React هي استخدام الأمر create-react-app، فهو يُعدُّ لك بيئة التطوير بحيث تتمكّن من استخدام آخر ميّزات JavaScript، ويُزوِّدك بتجربة تطوير جميلة، ويُحسِّن تطبيقك من أجل الإنتاج. يجب أن تمتلك إصدار NodeJs 6 فما فوق لديك:
npm install -g create-react-app
create-react-app my-app
cd my-app
npm start
إن كنت تمتلك إصدار npm 5.2.0 فما فوق فبإمكانك استخدام الأمر npx بدلًا من ذلك:
npx create-react-app my-app
cd my-app
npm start
لا يتعامل الأمر create-react-app مع منطق الخلفيّة (backend logic) أو قواعد البيانات، فهو يُنشِئ خط بناء للواجهة الأماميّة (frontend) بحيث يُمكنِك استخدامها مع أي خلفيّة تريد، ويستخدم أدوات بناء مثل Babel و webpack خفيةً، ولكنّها تعمل بدون الحاجة لأي إعدادات.
عندما تكون جاهزًا لتوزيع إنتاجك، فسيُنشِئ لك الأمر npm run build نسخة مُحسَّنة من تطبيقك في المجلّد build. بإمكانك أن تتعلّم المزيد حول الأمر create-react-app من خلال الملف التمهيدي له في github ودليل المستخدم.
معدات أخرى للبدء
لقد أنشأنا قائمة بمعدّات البدء المُقدَّمة من قبل طرف ثالث (third-party) والتي نوصي بها رسميًّا.
تختلف هذه المعدّات قليلًا في توجهها ولكنّها جاهزة للإنتاج، ومُصانة بشكل جيّد، ولا تتطلّب إعدادًا للبدء.
يُمكنك التحقّق أيضًا من قائمة معدّات البدء الأخرى التي يُساهِم بها مجتمع React.
المستوى المتقدم
إن كنت ترغب بإعداد مشروعك يدويًّا فانظر إلى فقرة تثبيت React من صفحة إضافة React إلى تطبيق موجود..
انظر أيضًا
- تجربة React
- إضافة React إلى تطبيق جديد (الصفحة الحالية)
- إضافة React إلى تطبيق موجود
- روابط شبكة توزيع المحتوى CDN