چگونه برنامه های React Native رو روی موبایل تست و اجرا کنیم
یک دستگاه واقعی Android تفاوت بسیار زیادی با شبیه ساز اندروید(Android Simulator) داره چون ویژگی های خیلی زیادی داره که شبیه ساز اونو نداره.بنابراین من تو این مطلب قصد دارم به شما نحوه تست و اجرای اپلیکیشن های نوشته شده با React Native رو روی یک گوشی واقعی Android آموزش بدم.حالا که فهمیدید داستان چیه پس با هم شروع کنیم
تعدادی از ویژگی های موجود در دستگاه واقعی اندروید
- پشتیبانی از سنسورهای مختلفی مثل Gravity,Light,Compass وغیره .
- پشتیبانی از تماس صوتی،تصویری و ضبط صدا.
- امکان عکسبرداری و فیلم برداری
- ….
علاوه بر ویژگی هایی که در بالا گفتم استفاده از یک دستگاه واقعی اندروید سرعت توسعه رو بسیار زیاد میکنه و شما میتونید با استفاده از HotReloading با سرعت بالا تغییرات ایجاد شده رو ببینید و همچنین برخلاف شبیه ساز دیگه حجم زیادی از Ram سیستمتون مصرف نمیشه.همونطور که خود React Native هم توصیه کرده بهترین و سریعترین راه برای تست برنامه استفاده از یک دستگاه واقعی اندرویده.گوشیتون رو با کابل به سیستم وصل کنید و مراحل زیر رو دنبال کنید.
1.فعال کردن Usb Debugging در گوشی موبایل
1-1. Goto -> Settings -> About Device
1-2. Then Software Info
1-3. Then ->Build Number
1-4. تو این قسمت باید هفت بار روی Build number ضربه بزنید تا حالت Developer Option فعال بشه
1-5. به setting برگردید باید گزینه Developer Options براتون فعال شده باشه
1-6. حالا به قسمت Developer Options برید و USB Debugging رو فعال کنید.
2. به مسیر SDK برید و پوشه Platform Tools سپس با نگه داشتن Shift و کلیک راست بر روی صفحه Command promot رو باز کنید
3. دستور adb devices رو داخل Command promot تاپپ کنید.بعد از اجرای دستور، دستگاه های متصل به سیستم رو لیست میکنه
4.دستور adb reverse tcp:8081 tcp:8081 رو داخل Command Promot تایپ کنید(البته اگه نسخه اندروید شما کمتر از 5 هست ، دستور زیر برای شما کار نمیکنه و باید از wifi که در ادامه در موردش توضیح میدم استفاده کنید )
5.حالا میتونید برنامه React naitive خودتون رو روی گوشی اجراکنید.در محیط Command Promot به مسیر پروژتون برید و دستور react-native run-android رو تایپ کنید و منتظر بمونید تا برنامه روی گوشیتون اجرا بشه.
تست و اجرا با استفاده از wi-fi
خب تا الان به تست و اجرا اپلیکیشن های اندرویدی با استفاده از کابل آشنا شدید ، حال اگه نسخه اندروید گوشی شما کمتر از 5 هست میتونید با استفاده از wifi خیلی راحت اپلیکیشن های اندرویدی خودتون رو بر روی گوشی تست بگیرید .
برای اجرای اپلیکیشن باید دستگاه اندرویدی و سیستم شما به یک مودم متصل باشند .
طبق مراحل بالا شما میتونید برای یک بار اپلیکیشن رو نصب کنید اما امکان تست و آپدیت و مشاهده تغییرات رو به صورت مجدد ندارید .به منظور اینکه بتونید تغییرات رو به وسیله wifi بر روی دستگاه اندرویدی خودتون مشاهده کنید ، باید برنامه شما ابتدا از طریق کابل بر روی دستگاه اندرویدی شما نصب شود .پس با توجه به مراحل بالا یک بار اپلیکیشن خودتون رو بر روی دستگاه اندرویدیون نصب کنید.
خب حالا اگه برنامه بر روی گوشی شما نصب شده ، باید دستیابی به سرور و پکیج node js (npm) به صورت دستی شروع کنید ، برای اینکار باید ازطریق فرمان به داخل دایرکتوری پروژه reactnative خودتون میرید و برای شروع و اجرا پکیج ، دستور زیر رو در محیط cmd وارد میکنید.
1 |
npm start |
خب حالا دستور زیر رو برای دسترسی به IP وارد کنید
1 |
ipconfig |
. در اطلاعات نمایش داده شده ، به دنبال مورد زیر بگردید :
همونطور که میبینید در بخش wi-fi آداپتور LAN Wireless آدرس IPv4 وجود داره. شما باید مقدار اون رو داشته باشید ، من به دلایل امنیتی جزئیات دستگاه خودمو پنهان میکنم .
وارد اپلیکیشنی که نصب کردید بشید و کمی گوشیتون رو بلرزونید تا حالت دولوپر برای شما نمایش داده باشه ، حالا گزینه آخر یعنی Dev Settings انتخاب کنید .
در قسمت Debugging گزینه Debug server host & port for device option رو انتخاب کنید .
خب حالا در Debug server host and port number مقدار IPv4 رو به اضافه :8081 وارد کنید.
خب همونطور که میبینید این ip معتبر نیست و من به دلایل امنیتی IP خودمو وارد نکردم ، IP شما باید 9 رقم باشه . خب حالا دوباره به محیط برنامه خودتون برگردید و کمی گوشیتون رو بلرزونید تا به حالت دولوپر برید ، حالا گزینه Reload رو انتخاب کنید ، و در نهایت شما خروجی زیر رو در دستگاه اندروید خودتون خواهید دید .
اگه بعد از اجرا با صفحه زیر روبرو شدید،زیاد نگران نباشید .این یک مشکل کوچیکه که من قبلا یه تله فیلم آموزشی برای رفع مشکل unable to load script from assets index.android.bundle آماده کردم که با دیدنش میتونید مشکلتون رو بر طرف کنید.
error Failed to launch emulator. Reason: No emulators found as an output of `emulator -list-avd
دقیقا مثل روش شما رفتم ولی همش این ارور میده
اینجا داره میگه هیچ emulator رو نمیشناسه.گوشی وصل نیست
سلام
حتما باید andriod studio نصب باشد؟؟
سلام لازم نیست
ولی SDK رو باید حتما داشته باشید
سلام. هنگام اجرای دستور react-native run-android خطای
could not get resource ‘https://jcenter.bintray.com/com/android/tools/build/gradle/4.1.0/gradle-4.1.0.pom’
رو میده در صورتی که ف… شک . ن هم وصله. همین آدرس رو توی مرورگر هم میزنم خطای 403 forbidden میده. در حالی که قبلا راحت میتونستم ران پروژه هام رو ران کنم. الان نه قبلی ها نه پروژه های جدید ران نمیشه. ممنون میشم راهنمایی کنید.
سلام
از وب سایت shecan.ir استفاده کنید یا یک vpn بخرید و استفاده کنید
گفتم که vpn وصله و تمام پروتکل هاش رو هم امتحان کردم. سایت های فیلتر رو باز میکنه ولی این آدرس رو نه. الان شما این آدرس رو توی مرورگر باز میکنین 403 نمیده؟
https://jcenter.bintray.com/com/android/tools/build/gradle/4.1.0/gradle-4.1.0.pom
بلی خطای 403 میده
با عرض سلام و خسته نباشید:
بنده اندرویدم 8.1.0 هست . هنگامی که دستور adb devices را وارد میکنم دستگاه من را در لیست نشان نمیدهد!مشکل از چه میتواند باشد؟تا به اینجا تمام مراحل را با دقت رفته ام.
سلام.سلامت باشید
developer option و usb debuging رو فعال کردید
سلام وقتی وقتی ری اکت رو روی گوشی بالا آوردیم چجوری ریلودش کنیم؟؟
سلام.گوشی رو shake کنید developer menu باز میشه بعد میتونید گزینه reload رو انتخاب کنید
همچنین میتونید از دستور adb shell input keyevent 82 رو در پوشه sdk/platform-tools اجرا کنید تا developer menu باز بشه
سلام و خسته نباشید خدمت شما
سوال اول—-من که از اندرویدد 4.2.2 میخوام با wifi رو موبایلم اجرا کنم نیاز به انجام دادن مرحله 4 نیست ، درسته؟
یعنی بعد از مرحله 3 مرحله 5 رو اجرا کنم؟
سوال دوم—-
وقتی که react-native run-android رو در خط فرمان اجرا میکنم همچین error ی بهم میده:::
coud not find builder.jar
(com.android.tools.build:builder:3.3.1)
پایینشم error میده که::
coud not install the app on the device
ممنون اگه راهنمایی بفرمایید
سلام جواد عزیز.
شما اول باید یک بار با دستور react-native run-android با استفاده از کابل روی گوشی نصب کنید و در ادامه مانند مقاله عمل کنید(مرحله 4 لازم نیست).
jdk رو نصب کردید؟؟ و از فیل*رش*ن یا وی * ان استفاده کنید و بعد دستورreact-native run-android رو اجرا کنید
توجه کنید که کلیه مراحل نصب react native رو باید انجام بدید
تشکر مهدی جان
((نوشتید jdk رو که نصب کردید؟؟ و از فیل*رش*ن یا وی* ان استفاده کنید))
منظورتون رو متوجه نشدم یا اشتباه تایپ کردید؟؟
فرض کنید من هنوز هیچ برنامه ای ننوشتم و هیچ ادیتوری رو هم باز نکردم ، در این صورت آیا من دستورات رو تو command اجرا کنم باز یه نسخه از اپلیکیشن که هیچی توش نیست رو تو موبایل برا من نصب میکنه؟
کلا همون پیغام builder-3.3.1.jar رو میده ، میگه که نمیتونه پیداش کنه
من رفتم دانلودش کردم که 8 تا فایل با پسوند jar هست ولی الان نمیدوتم باید چیکارش کنم چطوری اضافش کنم
از این آدرس دانلودش کردم
https://jar-download.com/cache_jars/org.apache.maven/maven-settings-builder/3.3.1/jar_files.zip
منظور من jdk 8 بود که باید نصبش کنید.اگر به چارت آموزشی و ملزومات برنامه نویسی بری میتونی jdk رو دانلود و نصب کنی
ببینید شما باید کلیه مراحل نصب react native رو انجام بدید.پیشنهاد میکنم درس اول دوره مقدماتی رو ببینید.اون عباراتی که با * مشخص کردم.منظورم دور زدن تحریم ها با اون روش ها است
تشکر ببینم چیکارش میکنم
با سلام و خسته نباشید
بعد از اجرای برنامه در موبایل خطای زیر نمایش داد میشه:
The development server returned response error code: 500 in react native
بعد از سرچ دستور
npm i react-native-material-design –save را در مسیر پروژه اجرا کردم ولی خطای زیر نمایش داده شد میشه راهنمایی بفرمایید
G:\>npm i react-native-material-design -g –save
npm ERR! code ENOGIT
npm ERR! Error while executing:
npm ERR! undefined ls-remote -h -t https://github.com/react-native-material-design/react-native-material-design-styles.git
npm ERR!
npm ERR! undefined
npm ERR! No git binary found in $PATH
npm ERR!
npm ERR! Failed using git.
npm ERR! Please check if you have git installed and in your PATH.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Lenovo\AppData\Roaming\npm-cache\_logs\2019-03-31T12_35_31_810Z-debug.log
سلام
شما نباید این دستور رو اجرا میکردید چون یک کتابخونه نصب کردید
باید الان این کتابخونه رو حذف کنید که نحوه حذفش دریکی از تاپیک های تالار گفتمان بیان شده
بعدش از دستور react-native start استفاده کنید تا مشکلتون حل بشه
این دستور react-native start رو که اجرا کردم تو همین حالت مونده و هیچ پیامی نمیده
Looking for JS files in
G:\project\test
Loading dependency graph, done.
اقدام دیگه ای باید انجام بدم؟
آیا همین دستور برای خطای زیر کافی هست؟؟
The development server returned response error code: 500
سلام.
حالا دوبار R رو بزنید ببینید اپلیکیشن reload میشه یا نه
سلام
چیکار باید بکنیم ک برنامه روی اندروید 4.4 هم نصب بشه؟
سلام.
باید از wifi برای نصب استفاده کنید که در انتهای مقاله توضیخ داده شده