React Native Part 1 - CRUD with Static Data

Step 1: Install Node.js and npm

React Native requires Node.js, so you need to have it installed on your machine. npm (Node Package Manager) is bundled with Node.js, which will help you install the React Native CLI.

Instructions

Download and install Node.js from https://nodejs.org.
Verify the installation by running the following commands in your terminal:
```
node -v
npm -v
```

You should see the installed versions of Node.js and npm.

Step 2: Install React Native CLI

React Native CLI is a command-line tool that allows you to create, build, and run React Native apps.

Instructions

Run the following command to install the React Native CLI globally:

npm install -g react-native-cli

Verify the installation with:

react-native -v

Step 3: Set Up Android Studio (for Android Development)

To build Android apps with React Native, you need to install Android Studio and set up the Android SDK.

Instructions

Download Android Studio from https://developer.android.com/studio.
Install Android Studio, and during the setup, select the option to install the Android SDK.
Open Android Studio and go to Preferences > Appearance & Behavior > System Settings > Android SDK. Install the following:
- SDK Platforms: Install the latest Android SDK (e.g., Android 13.0).
- SDK Tools: Install Android SDK Build-Tools, Android Emulator, and Android Virtual Device (AVD) Manager.
Set up environment variables:
- Windows: Open the Environment Variables dialog and add a new variable:
  - Variable name: ANDROID_HOME
  - Variable value: Path to the Android SDK (e.g., C:\Users\<YourUsername>\AppData\Local\Android\Sdk).
- macOS/Linux: Add the following lines to your ~/.bash_profile or ~/.zshrc file:
```
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/tools
export PATH=$PATH:$ANDROID_HOME/tools/bin
export PATH=$PATH:$ANDROID_HOME/platform-tools
```
Then, reload your terminal:
```
source ~/.bash_profile
```
To verify your setup, run:
```
adb --version
```

Step 4: Set Up Xcode (for iOS Development)

If you want to develop iOS apps, you’ll need Xcode, which is available only on macOS.

Instructions

Download Xcode from the Mac App Store.
Open Xcode and install any additional tools if prompted.
Open Xcode > Preferences > Locations and set the Command Line Tools to the latest version.

Step 5: Create Your First React Native Project

Now that your environment is set up, it’s time to create a new React Native project.

Instructions

In the terminal, navigate to the directory where you want to create your project.
Run the following command:
```
npx react-native init MyFirstApp
```
Navigate into the project directory:
```
cd MyFirstApp
```

Step 6: Run Your React Native Project

You can now run your new React Native project on an Android emulator, iOS simulator, or a physical device.

Instructions

To run on Android:
```
npx react-native run-android
```
Make sure you have an Android emulator running or an Android device connected via USB with USB debugging enabled.
To run on iOS (macOS only):
```
npx react-native run-ios
```
This command will launch your app on the iOS Simulator.

Step 7: Troubleshooting Common Issues

Here are some common issues and their solutions:

Metro bundler not running: If you encounter errors about the Metro bundler not running, open a new terminal window and run:
```
npx react-native start
```
Build failed: Ensure that you have the necessary build tools installed (e.g., Xcode for iOS, Android Studio for Android) and check your environment variables.