Before we start coding, we will have to setup the environment.

Step 1 – Install Xcode

What is Xcode?

Xcode is an integrated development environment built by Apple which contains a suite of software development tools that can be used to develop software for their operating systems such as iOS, WatchOS, macOS or tvOS.

Xcode can be found in the Apple App Store. The current version is 4.55GB and it might take a while to download depending on your internet connection.

xcode apple app store

Step 2 – Install Homebrew

What is Homebrew?

Homebrew is a free and open-source software package management system which will simplify the installation of software on Apple’s macOS operating system.

Visit http://brew.sh and copy the command from the Install Homebrew section.

homebrew home page

then paste it in your Terminal and press Enter. Once the installation is finished it should look like this:

homebrew terminal command

Step 3 – Install Node.js

What is Node.js ?

Node.js is an open-source, cross-platform JavaScript runtime environment for developing a diverse variety of tools and applications.

In your terminal type: brew install nodethen press Enter. Once Node.js is installed it should look like this:

node.js terminal

To check the version you have installed, in your Terminal type: node -v then press Enter.

Step 4 – Install Watchman

What is Watchman?

Watchman is a tool built by Facebook for watching changes in the filesystem. It is highly recommended you install it for better performance.

To install it, all you have to do is to type: brew install watchman in your Terminal then press Enter.
homebrew install watchman

Step 5 – Install React Native project generator

In your Terminal type: npm install -g react-native-cli and press Enter.

If installed successfully, It should look like this:

npm install react native project

That’s it!

Now let’s create our first React Native Project. In your terminal type: react-native init myFirstProject

first react native project

In the project which was just created, go to the iOS folder and double-click on myFirstProject.xcodeprojfile.

ios react native project

This will open the iOS project in Xcode. Once Xcode started, click on the Build button to open the project in the Simulator.

ios react native simulator