الفرق بين المراجعتين ل"ReactNative/libraries"
(أنشأ الصفحة ب'== استخدام المكتبات == يوفّر React Native مجموعة من المكونات الأساسية وواجهات برمجة التطبيقات المضم...') |
|||
| سطر 1: | سطر 1: | ||
== استخدام المكتبات == | == استخدام المكتبات == | ||
| − | يوفّر React Native مجموعة من المكونات الأساسية وواجهات برمجة التطبيقات المضمَّنة والجاهزة للاستخدام في تطبيقك. | + | يوفّر إطار عمل React Native مجموعة من المكونات الأساسية وواجهات برمجة التطبيقات المضمَّنة والجاهزة للاستخدام في تطبيقك. لست مقيدًا بالمكونات وواجهات برمجة التطبيقات المجمَّعة مع إطار عمل React Native، إذ لديه مجتمع من آلاف المطورين. إن لم يكن لدى المكونات الأساسية وواجهات برمجة التطبيقات ما تبحث عنه، فقد تتمكن من العثور على مكتبة وتثبيتها من مجتمع React Native لإضافتها إلى تطبيقك. |
| + | |||
| + | ==== اختيار مدير الحزم Package Manager ==== | ||
| + | تُثبَّت مكتبات React Native من [https://www.npmjs.com/ سجل npm] باستخدام مدير حزم Node.js مثل الأداتين [https://docs.npmjs.com/cli/v7/commands/npm/ npm CLI] أو [https://classic.yarnpkg.com/en/ Yarn Classic]. | ||
| + | |||
| + | إذا ثبّتَ Node.js على حاسوبك، فهذا يعني أنك ثبّتَ الأداة npm CLI بالفعل. يفضّل بعض المطورين استخدام الأداة Yarn Classic بسبب أنها ذات وقت تثبيت أسرع قليلًا ووجود ميزات متقدمة إضافية مثل مساحات العمل Workspaces. تعمل كلتا الأداتين بصورة رائعة مع إطار العمل React Native.<blockquote>يُستخدَم المصطلحان "مكتبة library" و "حزمة package" بالتبادل في مجتمع JavaScript.</blockquote> | ||
| + | |||
| + | ==== تثبيت مكتبة ==== | ||
| + | يمكنك تثبيت مكتبة في مشروعك من خلال الذهاب إلى مجلد المشروع في الطرفية terminal وشغّل أمر التثبيت. لنجرب الأمر مع <code>react-native-webview</code>: | ||
| + | |||
| + | * '''في npm''': | ||
| + | <syntaxhighlight lang="bash"> | ||
| + | npm install react-native-webview | ||
| + | </syntaxhighlight> | ||
| + | |||
| + | * '''في Yarn''': | ||
| + | <syntaxhighlight lang="bash"> | ||
| + | yarn add react-native-webview | ||
| + | </syntaxhighlight>تتضمن المكتبة التي ثبّتناها شيفرة أصيلة، ونحتاج إلى ربطها بتطبيقنا قبل استخدامها. | ||
| + | |||
| + | ==== ربط الشيفرة الأصيلة على نظام iOS ==== | ||
| + | يستخدم React Native مدير الاعتماديات CocoaPods لإدارة اعتماديات مشروع iOS وتتبع معظم مكتبات React Native نفس الاتفاق. إن لم تعمل المكتبة التي تستخدمها، فيجب الرجوع إلى ملف README للحصول على تعليمات إضافية. ستُطبَّق الإرشادات التالية في معظم الحالات: | ||
| + | |||
| + | شغّل الأمر <code>pod install</code> في مجلد <code>ios</code> الخاص بك لربطه بمشروع iOS الأصيل. يوجد اختصار لتنفيذ ذلك دون التبديل إلى مجلد <code>ios</code> هو تشغيل الأمر <code>npx pod-install</code>.<syntaxhighlight lang="bash"> | ||
| + | npx pod-install | ||
| + | </syntaxhighlight>ثم أعِد إنشاء التطبيق الثنائي لبدء استخدام مكتبتك الجديدة:<syntaxhighlight lang="bash"> | ||
| + | npx react-native run-ios | ||
| + | </syntaxhighlight> | ||
| + | |||
| + | ==== ربط الشيفرة الأصيلة على نظام Android ==== | ||
| + | يستخدم إطار العمل React Native أداة Gradle لإدارة اعتماديات مشروع Android. يجب إعادة إنشاء التطبيق الثنائي لاستخدام مكتبتك الجديدة بعد تثبيتها مع الاعتكاديات الأصيلة:<syntaxhighlight lang="bash"> | ||
| + | npx react-native run-android | ||
| + | </syntaxhighlight> | ||
| + | |||
| + | ==== البحث عن مكتبات ==== | ||
| + | [https://reactnative.directory/ React Native Directory] هي قاعدة بيانات قابلة للبحث عن مكتبات مصمَّمة خصيصًا لإطار عمل React Native، وهو المكان الأول الذي تبحث فيه عن مكتبة لتطبيق React Native الخاص بك. العديد من المكتبات التي ستجدها في دليل React Native هي من مجتمع [https://github.com/react-native-community/ React Native Community] أو [https://docs.expo.io/versions/latest/ Expo]. | ||
| + | |||
| + | يقود المكتبات التي أنشأها مجتمع React Native متطوعون وأفراد من الشركات التي تعتمد على React Native. تدعم هذه المكتبا أنظمة iOS و tvOS و Android و Windows، لكن يختلف ذلك باختلاف المشاريع. كانت العديد من هذه المكتبات سابقًا مكونات 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 ، لكن المكتبات التي | ||
مراجعة 13:59، 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 ، لكن المكتبات التي