React Native Getting Started

1: Start (React Native)

Node

Node Version Manager

Before you can even work with Node, you’ll want Node Version Manager. NVM is run as nvm and is a tool to let you switch between versions of node. Using NVM, you can install different versions of Node and switch between them as you switch projects.

To see if you already have NVM installed, try which nvm or nvm -v

If you don’t, go to the NVM installation instructions.

Expo supports only certain versions of Node, so you’ll need need to be using one of these node versions:

Node 12>= 12.13
Node 13not supported
Node 14Active LTS (“Long-term support”)
Node 15 & Node 16Current release
Node 17not support
Expo Support by Node version as of Dec 2021

If you aren’t using one of these Node versions, or you try with Node 17, you’ll see an error like:

Warning: expo-cli has not yet been tested against Node.js v 17.x.x

For learning, use one of the supported Node versions instead. As of Dec 2021, you should use the latest version of Node 16 to get started.

To see what you have installed use:

nvm list

To install a new version of node (in this case 16.13.1),

nvm install 16.13.1

Choose a new node version with

nvm use 16.13.1

(NVM will auto-choose it for you after you install it.)

Finally, check your node version with

% node -v

v16.13.1

XCode

• Download from developer.apple.com

• Install it.

• More steps may be necessary but we will get to those later

• Launch Xcode for the first time and it will prompt you to install additional packages.

• After installing XCode (app) install command-line tools using xcode-select --install

Create-React-Native-App

Here we will create our first demo app

Remember YourAppName is the name of your new app.

Next you will see an interactive prompt (this can be confusing to some new linux users) with the selected text showing in blue:

Here you will use the UP ARROW and DOWN ARROW to make a selection between the two choices (“Default new app” and “Template from expo”), however, for this app you don’t need to make any change to the selected one (“Default new app”) so just hit RETURN.

It will tell you it is locating project files, then downloading javascript dependencies, then CocoPods. It may say an error like:

Then you may try to do as it instructs

cd YourAppName/ios && npx pod-install

Pod Install

If this works for your, great, skip to the next section.

If you see this error below, proceed with the fix below.

Something went wrong with running pod install. in the ios directory. Continuing with initializing the project

Something went wrong with running pod install. in the ios directory. Continuing with initializing the project

If you cd into the project without doing the pod-install, you’ll get an ugly crash like the one I got here:

I’ve marked the interesting parts of the crash in red:

checking whether make sets $(MAKE)… yes
checking whether make supports nested variables… yes
checking for arm-apple-darwin-gcc… /Library/Developer/CommandLineTools/usr/bin/cc -arch armv7 -isysroot
checking whether the C compiler works… no
xcrun: error: SDK "iphoneos" cannot be located
xcrun: error: SDK "iphoneos" cannot be located
xcrun: error: SDK "iphoneos" cannot be located
xcrun: error: unable to lookup item 'Path' in SDK 'iphoneos'
/Users/jason/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-73c24/missing: Unknown --is-lightweight' option Try/Users/jason/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-73c24/missing --help' for more information
configure: WARNING: 'missing' script is too old or missing
configure: error: in /Users/jason/Library/Caches/CocoaPods/Pods/External/glog/2263bd123499e5b93b5efe24871be317-73c24': configure: error: C compiler cannot create executables Seeconfig.log' for more details
Aborting run
An unexpected error was encountered. Please report it as a bug:
CocoaPodsError: Command pod install failed.
└─ Cause: pod exited with non-zero code: 1
at CocoaPodsPackageManager._installAsync (/Users/jason/.npm/_npx/7cf525d1e16b4e35/node_modules/pod-install/build/index.js:2:92213)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async CocoaPodsPackageManager.installAsync (/Users/jason/.npm/_npx/7cf525d1e16b4e35/node_modules/pod-install/build/index.js:2:90176)
at async runAsync (/Users/jason/.npm/_npx/7cf525d1e16b4e35/node_modules/pod-install/build/index.js:2:106198)
at async /Users/jason/.npm/_npx/7cf525d1e16b4e35/node_modules/pod-install/build/index.js:2:106284 {
code: 'COMMAND_FAILED',
cause: Error: pod exited with non-zero code: 1
at ChildProcess.h (/Users/jason/.npm/_npx/7cf525d1e16b4e35/node_modules/pod-install/build/index.js:2:1073)
at Object.onceWrapper (node:events:510:26)
at ChildProcess.emit (node:events:390:28)

You should not report this as a bug but instead, follow this fix:

Although you may have command-line tools installed, This is happening because your XCode does not have Command-line Tools selected.

To fix this:

  1. Launch xcode
  2. Preferences
  3. Locations
  4. Make sure there’s a dropdown option selected for the command line tools

Select a command-line tools:

Go back to run npx pod-install again and confirm it is successful.

Several things will happen. First, your terminal will spin. Let’s see if it opens. The first time, you usually will encounter problems, like the ones here.

 No simulator available with name “iPhone 11”. 

This happens also when you upgrade XCode versions (which I have done today) because the new XCode does not have the simulators installed. While in XCode, go to the XCode menu > Preferences > Components

Choose at least one simulator to install. My recommendation is to install the latest dot release (that’s the number after the first dot in the version number) of but the current version and last version. Here, I’ve highlighted simulators 14.5 and 13.7 but by the time you read this there will probably be newer ones.

Once you click the little ‘download’ buttons (marked with arrows above) the downloads will begin. (They are very large so you may need to make some ☕ and come back.)

Once finished, now lets go back and try yarn ios again.

Meet Expo

cd into the directory of your app and run: