Setup React Native Environment For IOS

Image for post
Image for post
Source: https://www.youtube.com/watch?v=iLgJreGpfyM

Step 0 — Install npm and node.js

npm is a package manger for JavaScript programming language, and the default package manager for Node.js Javascript runtime environment.

Step 1 — Install Homebrew

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

If for some reason copying and pasting the above didn’t work, please go directly to the website and copy and paste the command/code from there.

Step 2 — Install Watchman

brew install watchman

Step 3 — Install React Native

sudo npm install -g react-native-cli

Step 4 Android — Install Android Studio

Step 4 IOS — Install XCode

Step 5 — Create First App

cd Desktop
react-native init reactTutorialApp

Step 6 — Run React Native Packager

cd reactTutorialApp

Now, we can run the packager.

react-native start

You should keep this terminal window running while developing your app.

You may get an error from the above command like below:
NOTE: when you run the app from the .xcodeproj, everything should work fine.

Found Xcode project TestProject.xcodeproj
xcrun: error: unable to find utility "instruments", not a developer
tool or in PATH
Command failed: xcrun instruments -s
xcrun: error: unable to find utility "instruments", not a developer
tool or in PATH

To resolve the ERROR

  1. Start Xcode on the Mac.
  2. Choose Preferences from the Xcode menu.
Image for post
Image for post

3. In the General window, click the Locations tab.

4. On the Location window, check that the Command Line Tools option shows the Xcode version (with which the Command Line Tools were installed). This means that the Xcode Command Line Tools are already installed and you do not need to install them.

Image for post
Image for post

If the Xcode Command Line Tools are not installed:

In this case the Command Line Tools option does not show the Xcode version. You can install the Xcode command-line tools in either of two ways:

To install the necessary Xcode tools using Xcode on the Mac:

  1. Start Xcode on the Mac.
  2. Choose Preferences from the Xcode menu.
  3. In the General panel, click Downloads.
  4. On the Downloads window, choose the Components tab.
  5. Click the Install button next to Command Line Tools.
Image for post
Image for post

6. You are asked for your Apple Developer login during the install process.

To install the necessary Xcode tools from the Web:

  1. On your Mac, to download the Xcode command line tools directly from the developer portal as a .dmg file, go to https://developer.apple.com/downloads/index.action.
  2. You are asked for your Apple Developer login during the install process.
  3. On the Downloads for Apple Developer list, select the Command Line Tools entry that you want.

Step 7 — Run the App on IOS simulator

react-native run-ios
Image for post
Image for post
Source: https://www.youtube.com/watch?v=iLgJreGpfyM

The book Learning React Native: Building Native Mobile Apps with JavaScript gives a practical introduction to React Native, the JavaScript framework for writing and deploying fully featured mobile apps that look and feel native. With this hands-on guide, you’ll learn how to build applications that target iOS, Android, and other mobile platforms instead of browsers. You’ll also discover how to access platform features such as the camera, user location, and local storage.

With code examples and step-by-step instructions, author Bonnie Eisenman shows web developers and frontend engineers how to build and style interfaces, use mobile components, and debug and deploy apps. Along the way, you’ll build several increasingly sophisticated sample apps with React Native before putting everything together at the end.

Image for post
Image for post
Learning React Native: Building Native Mobile Apps with JavaScript

Thanks for reading this article, if you found it helpful please leave a few claps. I am a YouTuber called randerson112358, and I have many helpful videos on programming, computer science, & discrete mathematics be sure to check them out !

RESOURCES:

SETUP REACT NATIVE:
https://www.tutorialspoint.com/react_native/react_native_environment_setup.htm

https://facebook.github.io/react-native/docs/getting-started.html

ERROR MESSAGE:
https://stackoverflow.com/questions/39778607/error-running-react-native-app-from-terminal-ios

https://www.embarcadero.com/starthere/berlin/mobdevsetup/ios/en/installing_the_xcode_command_line_tools_on_a_mac.html

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store