iOS device test

2023-03-18 hit count image

let's test RN(react native) project on iOS devices

outline

it is slow and annoyed to test on the simulator, isn’t it? let’s start to test RN(react native) on devices not the simulator.

this blog post is a series. it’s better to see below together.

if you want to know how to test RN(react native) on Android device, see our another blog post - Android device test.

iOS / Mac

we absolutely need Mac to test RN(react native) project on iPhone. we need to prepare iPhone, Mac and RN(react native) project you want to test.

prepare iphone mac

if you want to knwo how to make RN(react native) development enviroment, see another blog post - RN installation.

create developer account

we need Apple developer account to test on devices. this is not enrolling developer program so it is free to create Apple developer account. if you have Apple developer account, it is better to skip this section.

click below link to go to the Apple developer account site.

apple developer site

click account menu on the right top.

apple developer site login

if you have Apple account, you can login. if you don’t have Apple account, click Create Apple ID for creating. this account is Apple account that you use on iPhone for downloading App, not Apple developer account.

agreement

after login, you can see agreement. click By checking this box I confirm that I have read and agree to be bound by the Agreement above.for agreeing and Submit.

completed to create developer account

completed to create Apple developer account.

test on deveices

your English is definitely better than us so you can see everything on official site(react native). we do just following it.

  1. connect the device to Mac using USB.
  2. got to RN(react native) project folder and execute ios/[project name].xcodeproj file.
  3. after xcode is executed, click project name on left top and click General tab on right side. scroll down a little bit, you can see Signing section. click Add an Account... button beside Team.

signing in xcode </picture>

insert Apple developer account ID / PW created upside and click ```Next``` button.

<picture>

login signing in xcode </picture>

after login, click ```Download Manual Profiles``` on the bottom of the window. and close the window.
now you can see dropdown menu beside ```Team```. select your Apple developer account.

<picture>

signing error in xcode </picture>

if you have same error above, scroll up and change ```Bundle Identifier``` on ```Identity``` section.

<picture>

signing error solve in xcode </picture>

select ```(project name)Tests``` on ```Targets``` section. select your Apple developer account again on the dropdown menu beside ```Team``` for ```signing```.

<picture>

signing test target in xcode </picture>

  1. change build target to the device on left top and click the arrow for starting the project.

device test in xcode </picture>

warning: this process is for testing on the device. so test server is executed on PC like doing the simulator process. and the device accesses to the server to test RN(react native) project. so the device and PC must be on same Wifi/network for testing.
  1. you can see below message when build is succeeded.

security error </picture>

there are details what to do. just follow it.

reference

Was my blog helpful? Please leave a comment at the bottom. it will be a great help to me!

App promotion

You can use the applications that are created by this blog writer Deku.
Deku created the applications with Flutter.

If you have interested, please try to download them for free.

Posts