How to Install React Native Using Yarn?

Installing React Native using Yarn primarily involves setting up your development environment with Node.js and Yarn, then leveraging the recommended Expo CLI to create and manage your projects efficiently.

1. Essential Prerequisites

Before you begin creating React Native applications, you need to ensure your system has the fundamental tools installed.

1.1. Install Node.js

Node.js is a JavaScript runtime environment that React Native, Yarn, and Expo CLI rely on.

Download: Visit the official Node.js website and download the recommended LTS (Long Term Support) version for your operating system.
Installation: Follow the installer's prompts. This typically includes npm (Node Package Manager), which you'll use to install Yarn.

1.2. Install Yarn

Yarn is a fast, reliable, and secure package manager used for managing your project's dependencies. It's installed globally using Node.js's npm.

Open Terminal/Command Prompt:
- On macOS/Linux: Open your Terminal application.
- On Windows: Open Command Prompt or PowerShell.
Install Yarn Globally: Execute the following command:
```
npm install -g yarn
```
Verify Installation: Confirm Yarn is installed correctly by checking its version:
```
yarn --version
```

2. Install Expo CLI

For quickly getting started with React Native, Expo CLI is highly recommended. It provides a set of tools that simplify the development process, allowing you to build and test apps without configuring native build tools.

Install Expo CLI Globally: Use Yarn to install Expo CLI across your system:
```
yarn global add expo-cli
```
Verify Installation: Check the installed version of Expo CLI:
```
expo --version
```

3. Create a New React Native Project

With Expo CLI installed, you can now generate a new React Native project.

3.1. Initialize Your Project

Navigate to the directory where you want to create your project and run the expo init command, replacing MyAwesomeApp with your desired project name.

expo init MyAwesomeApp

3.2. Choose a Template

After running expo init, you'll be prompted to choose a template. These templates provide a starting point for your project:

blank: A minimal app as clean as an empty canvas.
blank (TypeScript): Same as blank, but pre-configured for TypeScript development.
tabs: An example app with two tabs and React Navigation pre-configured.

Select the template that best suits your project needs using the arrow keys and pressing Enter.

3.3. Navigate and Start Your App

Once the project is created and dependencies are installed (this might take a few minutes), navigate into your new project directory and start the development server:

cd MyAwesomeApp
yarn start

4. Running Your React Native Application

After running yarn start, the Expo development server will launch, and a QR code will appear in your terminal. You have several options to run your app:

On Your Phone (Recommended):
1. Download the Expo Go app from the App Store (iOS) or Google Play Store (Android).
2. Open the Expo Go app and scan the QR code displayed in your terminal. Your app will load on your device.
In a Web Browser:
- Press w in your terminal to open the app in a web browser. This is great for quick development iterations, though it doesn't represent the full mobile experience.
On a Simulator/Emulator:
- iOS Simulator: Press i in your terminal. Requires Xcode (macOS only) to be installed.
- Android Emulator: Press a in your terminal. Requires Android Studio to be installed and an Android Virtual Device (AVD) configured.

Quick Command Reference

Here's a summary of the key commands you'll use:

Command	Description
`npm install -g yarn`	Installs Yarn globally using npm.
`yarn global add expo-cli`	Installs Expo CLI globally using Yarn.
`expo init MyAwesomeApp`	Creates a new React Native project named "MyAwesomeApp" via Expo.
`cd MyAwesomeApp`	Navigates into your project directory.
`yarn start`	Starts the Expo development server.
`yarn add [package-name]`	Adds a new dependency to your project.
`yarn remove [package-name]`	Removes a dependency from your project.