React Native is a popular mobile app development framework created by Facebook, which allows developers to build cross-platform mobile applications with JavaScript and React. If you’re planning to develop mobile apps with React Native on your Mac computer, you will need to set up the development environment.

Prerequisites

Before we begin, make sure you have the following prerequisites installed on your Mac computer:

• Mac OS X 10.10 or higher
  
• Xcode
  
• Homebrew
  
• Node.js and npm
  
• Watchman

React-native setup in mac

Install Xcode

Xcode is an Integrated Development Environment (IDE) developed by Apple, which is required for developing iOS and macOS applications. It includes a code editor, a graphical user interface builder, and many other features. To install Xcode, follow these steps:

1. Open the App Store on your Mac computer.
   
2. Search for Xcode in the search bar.
   
3. Click on the “Get” button to download and install Xcode.

Install Homebrew

Homebrew is a package manager for Mac OS X, which makes it easy to install and manage software packages. To install Homebrew, follow these steps:

1. Open the Terminal app on your Mac computer.
   
2. Type the following command and press Enter https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh
   
3. Follow the instructions on the screen to complete the installation.

Install Node.js and npm

Node.js is a JavaScript runtime built on Chrome’s V8 JavaScript engine, which allows you to run JavaScript on the server-side. npm is a package manager for Node.js, which makes it easy to install and manage software packages. To install Node.js and npm, follow these steps:

1. Open the Terminal app on your Mac computer.
   
2. Type the following command and press Enter
   brew install node
   
3. Wait for the installation to complete.

Install Watchman

Watchman is a tool developed by Facebook, which watches files and triggers actions when they change. It is used by it to detect changes to your code and rebuild your app automatically. To install Watchman, follow these steps:

1. Open the Terminal app on your Mac computer.
   
2. Type the following command and press Enter:
   brew install watchman
   
3. Wait for the installation to complete.

Install React Native CLI

react-native CLI is a command-line interface tool, which allows you to create, run, and build React Native apps. To install React Native CLI, follow these steps:

1. Open the Terminal app on your Mac computer.
   
2. Type the following command and press
   npm install -g react-native-cli
   
3. Wait for the installation to complete.

Create a New React Native Project

Once you have installed all the required tools, you can create a new React Native project. To create a new project, follow these steps:

1. Open the Terminal app on your Mac computer.
   
2. Navigate to the directory where you want to create your project.
   
3. Type the following command and press Enter
   react-native init MyFirstApp Replace “MyFirstApp” with the name of your app.
   
4. Wait for the project to be created.

Running Your First React Native App

Now that you have created a new React Native project, you can run it on an iOS simulator or an Android emulator. To run your app on an iOS simulator, follow these steps:

1. Open Xcode on your Mac computer.
   
2. Click on “Open another project” and navigate to the directory where you created your project.
   
3. Open the “.xcworkspace” file in Xcode.
   
4. Click on the “Run” button to run your app on the iOS simulator.

To run your app on an Android emulator, follow these steps:

1. Open Android Studio on your Mac computer.
   
2. Click on “Open an existing Android Studio project” and navigate to the directory where you created your project.
   
3. Open the “android” folder in Android Studio.
4. Click on the “Run” button to run your app on the Android emulator.

Congratulations! You have successfully done react native setup in Mac and created your first React Native app.

Follow Us on
https://www.linkedin.com/company/scribblers-den/
https://www.facebook.com/scribblersden.blogs

Read More
https://scribblersden.com/how-to-create-a-pagination-in-mongoose/

Thank You