Creating Your First App

Prerequisites

Before you start, make sure you have:

• Installed all the Prerequisites
• Completed the Installation steps

Steps to Create Your First App

Step 1: Initialize a New Project

You can create a new React Native project using the React Native CLI:

react-native init MyFirstApp

Or, if you're using Expo:

expo init MyFirstApp

Step 2: Navigate to the Project Directory

Open your terminal and navigate to the project directory:

cd MyFirstApp

Step 3: Run the App

To run the app on iOS:

react-native run-ios

Or, for Android:

react-native run-android

If you're using Expo, you can start the app with:

expo start

Step 4: Edit the App

Open the App.js file in your preferred text editor. You'll see some default code generated by React Native or Expo. Feel free to modify the code and save the file. Your changes will automatically reflect in the running app.

Step 5: Add Components

React Native provides a range of built-in components like View, Text, Button, etc. Try adding some of these to your App.js file to create a simple user interface.

Here's a sample code snippet to add a button:

import React from 'react';
import { View, Text, Button } from 'react-native';
 
const App = () => {
  const handlePress = () => {
    alert('Button Pressed!');
  };
 
  return (
    <View>
      <Text>Hello, World!</Text>
      <Button title="Press Me" onPress={handlePress} />
    </View>
  );
};
 
export default App;

Step 6: Test on Physical Device

You can also test your app on a physical device by connecting it to your computer and following the same steps to run the app.

Next Steps

Congratulations on creating your first React Native app! From here, you can start exploring more advanced features and libraries to enhance your app. For more in-depth tutorials and best practices, check out the Advanced Topics section.