How to run react native project in windows 10 and using iPhone (after latest expo update)

Hari Roshan
2 min readMay 21, 2018

--

Assuming that you have Node installed, you can use npm to install the create-react-native-app command line utility:

npm install -g create-react-native-app

Then run the following commands to create a new React Native project called “AwesomeProject”:

create-react-native-app AwesomeProject 
cd AwesomeProject
npm start # or yarn start if cli used yarn to install

Install expo.io app in iPhone.

When you run yarn start or npm start, you’ll see output similar to this.

In windows, we need to setup inbound rules in windows firewall to open port 19000.

To open a port in the Windows firewall for TCP access

  1. On the Start menu, click Run, type WF.msc, and then click OK.
  2. In the Windows Firewall with Advanced Security, in the left pane, right-click Inbound Rules, and then click New Rule in the action pane.
  3. In the Rule Type dialog box, select Port, and then click Next.
  4. In the Protocol and Ports dialog box, select TCP. Select Specific local ports, and then type the port number of the instance of the Database Engine, such as 1433 for the default instance. Click Next.
  5. In the Action dialog box, select Allow the connection, and then click Next.
  6. In the Profile dialog box, select any profiles that describe the computer connection environment when you want to connect to the Database Engine, and then click Next.
  7. In the Name dialog box, type a name and description for this rule, and then click Finish.

The issue I faced was my machine ip address should be 192.168.0.106 inorder to be accessed from wifi network.

Your app is now running at URL: exp://10.0.75.1:19000

If you type this address http://10.0.75.1:19000 in iPhone safari, it’ll show an error that host cannot be reached or something similar. But if you go to http://192.168.0.106:19000 you can see output similar to this

{“sdkVersion”:”27.0.0",”name”:”jokeedApp”,”slug”:”jokeedapp”,”version”:”0.1.0",”xde”:true,”developer”:{“tool”:”crna”,”projectRoot”:”E:\\jokeed\\jokeedApp”},”packagerOpts”:{“hostType”:”tunnel”,”lanType”:”ip”,”dev”:true,”minify”:false,”urlRandomness”:null},”env”:{},”bundleUrl”:”http://10.0.75.1:19001/./node_modules/react-native-scripts/build/bin/crna-entry.bundle?platform=ios&dev=true&minify=false&hot=false&assetPlugin=E%3A%5Cjokeed%5CjokeedApp%5Cnode_modules%5Cexpo%5Ctools%5ChashAssetFiles","debuggerHost":"10.0.75.1:19001","mainModuleName":"./node_modules/react-native-scripts/build/bin/crna-entry","logUrl":"http://10.0.75.1:19000/logs","id":"@anonymous/jokeedapp-e3814331-7599-49e1-8175-67af2c12c6a2"}

Expo.io removed the option to enter url into app in the lastest update.

Quick work around I found was, to send myself a email with exp://192.168.0.106:19000 as a link in gmail using ctrl + K.

If you Tap the mail link, iPhone will redirect you to expo.io app.

--

--