الفرق بين المراجعتين لصفحة: «ReactNative/libraries»
لا ملخص تعديل |
لا ملخص تعديل |
||
| سطر 41: | سطر 41: | ||
جميع المكتبات التي أنشأها Expo مكتوبة بلغة TypeScript وتدعم نظام iOS و Android و react-native-web، وتتطلب تثبيت [https://github.com/expo/expo/tree/master/packages/react-native-unimodules react-native-unimodules] أولًا لاستخدامها في تطبيق React Native الخاص بك. | جميع المكتبات التي أنشأها Expo مكتوبة بلغة TypeScript وتدعم نظام iOS و Android و react-native-web، وتتطلب تثبيت [https://github.com/expo/expo/tree/master/packages/react-native-unimodules react-native-unimodules] أولًا لاستخدامها في تطبيق React Native الخاص بك. | ||
يُعَد سجل npm ثاني أفضل مكان -بعد React Native Directory- إن لم تتمكن من العثور على مكتبة React Native في الدليل، فهو المصدر النهائي لمكتبات JavaScript ، لكن المكتبات التي | يُعَد سجل npm ثاني أفضل مكان -بعد React Native Directory- إن لم تتمكن من العثور على مكتبة React Native في الدليل، فهو المصدر النهائي لمكتبات JavaScript ، لكن المكتبات التي يحتويها قد لا تكون جميعها متوافقة مع React Native. إطار عمل React Native هو بيئة من بين بيئات برمجة JavaScript المتعددة، بما في ذلك Node.js ومتصفحات الويب و Electron وغيرها الكثير، وتتضمن npm مكتبات تعمل في جميع هذه البيئات. | ||
==== تحديد توافق المكتبة ==== | |||
===== هل تعمل هذه المكتبة مع React Native؟ ===== | |||
لا تعمل عادةً المكتبات المصمَّمة خصيصًا للمنصات الأخرى مع إطار عمل React Native، مثل مكتبة <code>react-select</code> التي صُمِّمت للويب ويستهدف على وجه التحديد <code>react-dom</code>، و <code>rimraf</code> المصمَّمة لبيئة Node.js وتتفاعل مع نظام ملفات حاسوبك. تستخدم مكتبات أخرى مثل <code>lodash</code> ميزات لغة جافا سكريبت فقط وتعمل في أي بيئة. ستكتسب فكرة عن هذه المكتبات بمرور الوقت، ولكن أسهل طريقة لمعرفة ذلك هي تجربتها بنفسك. يمكنك إزالة الحزم باستخدام الأمر <code>npm uninstall</code> إذا اتضح أنها لا تعمل في إطار عمل React Native. | |||
===== هل تعمل هذه المكتبة مع المنصات التي يدعمها تطبيقك؟ ===== | |||
يتيح لك React Native Directory ترشيح المكتبات حسب توافق المنصة مثل iOS و Android و Web و Windows. إذا كانت المكتبة التي ترغب في استخدامها غير مدرجة حاليًا هناك، فارجع إلى ملف README الخاص بالمكتبة لمعرفة المزيد. | |||
===== هل تعمل هذه المكتبة مع إصدار تطبيقك من إطار عمل React Native؟ ===== | |||
يتوافق أحدث إصدار من المكتبة مع أحدث إصدار من React Native. إن استخدمتَ إصدارًا أقدم، فيجب عليك الرجوع إلى README لمعرفة إصدار المكتبة الذي يجب تثبيته. يمكنك تثبيت إصدار معين من المكتبة عن طريق تشغيل الأمر <code><npm install <library-name>@<version-number</code>، مثل:<syntaxhighlight lang="bash"> | |||
npm install @react-native-community/netinfo@^2.0.0 | |||
</syntaxhighlight> | |||
== مصادر == | |||
[https://reactnative.dev/docs/libraries صفحة Using Libraries في توثيق React Native الرسمي] | |||
مراجعة 19:40، 1 يونيو 2021
استخدام المكتبات
يوفّر إطار عمل React Native مجموعة من المكونات الأساسية وواجهات برمجة التطبيقات المضمَّنة والجاهزة للاستخدام في تطبيقك. لست مقيدًا بالمكونات وواجهات برمجة التطبيقات المجمَّعة مع إطار عمل React Native، إذ لديه مجتمع من آلاف المطورين. إن لم يكن لدى المكونات الأساسية وواجهات برمجة التطبيقات ما تبحث عنه، فقد تتمكن من العثور على مكتبة وتثبيتها من مجتمع React Native لإضافتها إلى تطبيقك.
اختيار مدير الحزم Package Manager
تُثبَّت مكتبات React Native من سجل npm باستخدام مدير حزم Node.js مثل الأداتين npm CLI أو Yarn Classic.
إذا ثبّتَ Node.js على حاسوبك، فهذا يعني أنك ثبّتَ الأداة npm CLI بالفعل. يفضّل بعض المطورين استخدام الأداة Yarn Classic بسبب أنها ذات وقت تثبيت أسرع قليلًا ووجود ميزات متقدمة إضافية مثل مساحات العمل Workspaces. تعمل كلتا الأداتين بصورة رائعة مع إطار العمل React Native.
يُستخدَم المصطلحان "مكتبة library" و "حزمة package" بالتبادل في مجتمع JavaScript.
تثبيت مكتبة
يمكنك تثبيت مكتبة في مشروعك من خلال الذهاب إلى مجلد المشروع في الطرفية terminal وشغّل أمر التثبيت. لنجرب الأمر مع react-native-webview:
- في npm:
npm install react-native-webview
- في Yarn:
yarn add react-native-webview
تتضمن المكتبة التي ثبّتناها شيفرة أصيلة، ونحتاج إلى ربطها بتطبيقنا قبل استخدامها.
ربط الشيفرة الأصيلة على نظام iOS
يستخدم React Native مدير الاعتماديات CocoaPods لإدارة اعتماديات مشروع iOS وتتبع معظم مكتبات React Native نفس الاتفاق. إن لم تعمل المكتبة التي تستخدمها، فيجب الرجوع إلى ملف README للحصول على تعليمات إضافية. ستُطبَّق الإرشادات التالية في معظم الحالات:
شغّل الأمر pod install في مجلد ios الخاص بك لربطه بمشروع iOS الأصيل. يوجد اختصار لتنفيذ ذلك دون التبديل إلى مجلد ios هو تشغيل الأمر npx pod-install.
npx pod-install
ثم أعِد إنشاء التطبيق الثنائي لبدء استخدام مكتبتك الجديدة:
npx react-native run-ios
ربط الشيفرة الأصيلة على نظام Android
يستخدم إطار العمل React Native أداة Gradle لإدارة اعتماديات مشروع Android. يجب إعادة إنشاء التطبيق الثنائي لاستخدام مكتبتك الجديدة بعد تثبيتها مع الاعتكاديات الأصيلة:
npx react-native run-android
البحث عن مكتبات
React Native Directory هي قاعدة بيانات قابلة للبحث عن مكتبات مصمَّمة خصيصًا لإطار عمل React Native، وهو المكان الأول الذي تبحث فيه عن مكتبة لتطبيق React Native الخاص بك. العديد من المكتبات التي ستجدها في دليل React Native هي من مجتمع React Native Community أو Expo.
يقود المكتبات التي أنشأها مجتمع React Native متطوعون وأفراد من الشركات التي تعتمد على React Native. تدعم هذه المكتبا أنظمة iOS و tvOS و Android و Windows، لكن يختلف ذلك باختلاف المشاريع. كانت العديد من هذه المكتبات سابقًا مكونات React Native أساسية وواجهات برمجة التطبيقات.
جميع المكتبات التي أنشأها Expo مكتوبة بلغة TypeScript وتدعم نظام iOS و Android و react-native-web، وتتطلب تثبيت react-native-unimodules أولًا لاستخدامها في تطبيق React Native الخاص بك.
يُعَد سجل npm ثاني أفضل مكان -بعد React Native Directory- إن لم تتمكن من العثور على مكتبة React Native في الدليل، فهو المصدر النهائي لمكتبات JavaScript ، لكن المكتبات التي يحتويها قد لا تكون جميعها متوافقة مع React Native. إطار عمل React Native هو بيئة من بين بيئات برمجة JavaScript المتعددة، بما في ذلك Node.js ومتصفحات الويب و Electron وغيرها الكثير، وتتضمن npm مكتبات تعمل في جميع هذه البيئات.
تحديد توافق المكتبة
هل تعمل هذه المكتبة مع React Native؟
لا تعمل عادةً المكتبات المصمَّمة خصيصًا للمنصات الأخرى مع إطار عمل React Native، مثل مكتبة react-select التي صُمِّمت للويب ويستهدف على وجه التحديد react-dom، و rimraf المصمَّمة لبيئة Node.js وتتفاعل مع نظام ملفات حاسوبك. تستخدم مكتبات أخرى مثل lodash ميزات لغة جافا سكريبت فقط وتعمل في أي بيئة. ستكتسب فكرة عن هذه المكتبات بمرور الوقت، ولكن أسهل طريقة لمعرفة ذلك هي تجربتها بنفسك. يمكنك إزالة الحزم باستخدام الأمر npm uninstall إذا اتضح أنها لا تعمل في إطار عمل React Native.
هل تعمل هذه المكتبة مع المنصات التي يدعمها تطبيقك؟
يتيح لك React Native Directory ترشيح المكتبات حسب توافق المنصة مثل iOS و Android و Web و Windows. إذا كانت المكتبة التي ترغب في استخدامها غير مدرجة حاليًا هناك، فارجع إلى ملف README الخاص بالمكتبة لمعرفة المزيد.
هل تعمل هذه المكتبة مع إصدار تطبيقك من إطار عمل React Native؟
يتوافق أحدث إصدار من المكتبة مع أحدث إصدار من React Native. إن استخدمتَ إصدارًا أقدم، فيجب عليك الرجوع إلى README لمعرفة إصدار المكتبة الذي يجب تثبيته. يمكنك تثبيت إصدار معين من المكتبة عن طريق تشغيل الأمر <npm install <library-name>@<version-number، مثل:
npm install @react-native-community/netinfo@^2.0.0