هذه ترجمة لمقال المدون الأصلي تحت اسم مستعار Soujanya PS. هي محترفة في مجالها ولا تحب تطوير التطبيقات والخدمات فحسب ، بل أيضًا كتابة مقالات عنها. فيما يلي استعراضها لإطلاق تطبيق iOS باستخدام إطار React Native.
منذ وقت ليس ببعيد ، بدأت في استخدام React Native لتطبيقات iOS. هذه أول رحلة عميقة في بيئة تطوير التطبيقات الأصلية. ألاحظ أنني فوجئت بسهولة العملية برمتها ، وكذلك مستوى التجريد الذي توفره واجهة سطر الأوامر React Native. في الواقع ، كان هذا أحد العوامل التي دفعتني إلى الكتابة عن هذا الإطار. أود أن أشارك تجربتي الخاصة مع أولئك الذين بدأوا العمل معه للتو.
توصي Skillbox بما يلي: "Mobile Developer PRO" .
نذكرك: لجميع قراء "هبر" - خصم 10000 روبل عند التسجيل في أي دورة من دورات Skillbox باستخدام الكود الترويجي "هبر".
يوفر React Native أدوات سطر الأوامر لتشغيل تطبيقات iOS و Android على المحاكيات والأجهزة. دعونا نحاول أن نفهم ما وكيف نفعل لنشر تطبيق React Native لنظام iOS.
إطلاق في الواقع
يوفر React Native أداة مساعدة ممتازة تسمى init. يوفر قالب تطبيق ، أثناء إنشاء ملفات مشروع Xcode ذات الصلة في مجلد iOS لهذا التطبيق.
يمكن تشغيله بدوره في بيئة محاكي iOS وعلى الهاتف / الجهاز اللوحي عن طريق إدخال الأمر التالي في المجلد الجذر للتطبيق:
رد فعل تشغيل- iosويرافق تنفيذ الأمر بنجاح إطلاق التطبيق في المحاكي أو على الجهاز. نقول لك ما يجب القيام به لهذا الغرض.
أمر Run-ios
يوفر React Native للمطور العديد من الأدوات المساعدة لسطر الأوامر للتفاعل مع التطبيق. توجد في مجلد cli المحلي لعقد الوحدة النمطية React Native. Run-ios هو أحد الأدوات المساعدة التي تقوم بتشغيل وظيفة runIOS () المعرفة في ملف runIOS.js.
يسمح لك Run-ios باستخدام الخيارات التالية:
# إطلاق التطبيق على جهاز محاكاة محدد
تفاعل i-run-ios - simimulator "iPhone 5"
#Pass موقع غير قياسي لدليل iOS
run-ios run-original --project-path "./app/ios"
#Run على جهاز متصل ، مثل Max's iPhone
رد فعل i-run-ios - الجهاز "Max's iPhone"
# بناء التطبيق في وضع الإصدار
تشغيل ios - إصدار التكويناختيار الجهاز / المحاكي
إذا لم يتم تحديد الجهاز ، فسيقوم run-ios بتشغيل وضع تصحيح التطبيق في المحاكي الافتراضي. هذا ممكن بفضل سلسلة أوامر xcrun / simctl. أولاً ، تحقق من قائمة المحاكيات المتاحة ، حدد أحدها وقم بتحميل التطبيق في بيئته.
إذا كنت ترغب في تشغيل التطبيق على جهاز مادي ، فما عليك سوى توصيله بجهاز الكمبيوتر المحمول الخاص بك وتعيين التفاصيل عبر run-ios.
الخطوة التالية هي إنشاء مشروع تطبيق Xcode.
كود التطبيق
عادة ، يقع مشروع تطبيق React Native Xcode في مجلد iOS في الدليل الجذر. يتم إنشاء مشروع Xcode باستخدام الأمر xcodebuild. يتم تمرير أي معلمات تم تعيينها مسبقًا لـ run-ios إلى هذا الأمر.
بمجرد إنشاء المشروع ، يتم تثبيت التطبيق وتشغيله على المحاكي أو الجهاز المتصل.
إضافة رمز التطبيق في وضع التصحيح
طوال عملية التطوير ، يقوم React Native بتحميل التعليمات البرمجية بشكل ديناميكي. لكي يسير كل شيء بسلاسة ويكون الرمز متاحًا حسب الحاجة ، ستحتاج إلى خادم.
أثناء تصحيح مشروع Xcode ، يبدأ خادم مترو بالتوازي معه. يتم استخدامه من قبل التطبيقات التي تم إنشاؤها باستخدام واجهة سطر الأوامر React Native. كل هذا يسمح لك بتسريع وتبسيط العملية باستخدام إعادة التشغيل "الساخنة" وطرق أخرى.
بشكل افتراضي ، يستمع مترو على المنفذ 8081. بمجرد تشغيل التطبيق في المحاكي ، يتم إرسال طلب إلى الخادم.
#Code in AppDelegate.m sends the request for the bundle: #index.bundle to server jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil]; RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation moduleName:@"MobileApp initialProperties:nil launchOptions:launchOptions];
يقوم الخادم بتحميل جميع التبعيات اللازمة ، وجمع كود JavaScript وإرساله إلى التطبيق. بعد هذه الخطوة ، يمكنك رؤية التطبيق قيد التشغيل في المحاكي أو على الجهاز المتصل.
حزمة جافا سكريبت
في وضع التحرير ، يجب عليك أولاً حزم JavaScript ، ووضعه في التطبيق. للقيام بذلك ، بعض التغييرات مطلوبة لتوفير القدرة على تنزيل حزمة ثابتة. تحتاج إلى تغيير jsCodeLocation في ملف AppDelegate.m ، للإشارة إلى موقع الحزمة الثابتة خارج وضع التصحيح:
#ifdef DEBUG jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@ fallbackResource:nil]; #else jsCodeLocation = [[NSBundle mainBundle] URLForResource:@ withExtension:@]; #endif
الآن هذه إشارة إلى ملف المورد main.bundle الذي ظهر أثناء معالجة مشروع Xcode. في هذه المرحلة ، يتم تشغيل البرنامج النصي active-native-xcode.sh. يمكن العثور عليه في مجلد البرنامج النصي لوحدة React Native النمطية.
إنشاء تطبيق من Xcode
يمكنك أيضًا إنشاء مشروع Xcode مباشرة على Mac بدلاً من استخدام React Native CLI. بعد إنشاء التطبيق ، يمكنك أيضًا تشغيله على المحاكي المحدد في خيارات Xcode ، أو على الجهاز الفعلي.
آمل أن تكون هذه المادة قد ساعدتك على فهم العمليات التي تبدأ عندما يتم تنفيذ الأمر run-ios المتفاعل ، مما يخلق السحر ويسمح لك بتشغيل التطبيق في بيئة iOS.
توصي Skillbox بما يلي: