Getting Started with React Native

React Native is a popular framework for building cross-platform mobile applications using JavaScript and React. It allows developers to write code once and deploy it on both iOS and Android devices.

2.1 Prerequisites

• Node.js (version 12 or higher)
• npm or Yarn (package managers)
• Watchman (for macOS users)

2.2 Setting Up React Native CLI

To get started, you need to install the React Native CLI. Open your terminal and run:

npm install -g react-native-cli

2.3 Creating a New Project

Once the CLI is installed, you can create a new project:

npx react-native init MyNewProject

3.1 Components

React Native uses components to build the user interface. Components are reusable pieces of code that return a React element.

3.2 State and Props

State is an object that holds the dynamic data of a component, while props are inputs to components. Here's a simple example:

import React, { useState } from 'react';
import { View, Text, Button } from 'react-native';

const Counter = () => {
    const [count, setCount] = useState(0);
    return (
        
            You clicked {count} times
             setCount(count + 1)} />
        
    );
};
                

4.1 Running Your App

Change into your project directory and run the following commands to start your app:

cd MyNewProject
npx react-native run-android  // For Android
npx react-native run-ios      // For iOS

4.2 Structure of a React Native App

Your project will have a structure like this:

• android
• ios
• node_modules
• App.js
• package.json

• Keep components small and focused.
• Use functional components and hooks where possible.
• Utilize TypeScript for type safety.
• Optimize images and assets for performance.
• Test your app on both iOS and Android platforms regularly.