Saturday, August 30, 2025

How can I start building a React Native app?

To See All React Native Articles: Index of Lessons in Technology

Great question 👍
Let’s go step by step so you can start building a React Native app from scratch.

🚀 Getting Started with React Native

1. Install Prerequisites

Before creating a project, make sure you have:

Node.js (LTS recommended – check with node -v)
npm (comes with Node) or yarn (npm install -g yarn)
Java JDK (for Android builds)
Android Studio (with SDK + emulator or real device)
(Optional) Watchman (for macOS/Linux, improves file watching)

2. Create a New Project

Run this in your terminal:

bash
npx react-native@latest init MyFirstApp

👉 This creates a folder MyFirstApp with everything set up.
Move into it:

bash
cd MyFirstApp

3. Run the App

▶️ On Android (emulator or real device)

bash
npx react-native run-android

(Phone must have USB debugging enabled OR emulator running)

▶️ On iOS (Mac only)

bash
npx react-native run-ios

4. Start the Development Server

React Native uses Metro bundler. Start it with:

bash
npx react-native start

This watches your code and reloads app changes automatically.

5. Edit Your App

Open App.js in your project folder.
Change the text inside the default screen, e.g.:

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

const App = () => {
  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Text>Hello Ashish 👋, this is my first React Native app!</Text>
    </View>
  );
};

export default App;

Save → App reloads → You see your changes instantly.

6. Learn Core Components

Some essential components:

View → like a <div> (containers)
Text → display text
Image → display images
Button → basic buttons
TextInput → input fields
ScrollView / FlatList → lists and scrolling

7. Next Steps

Learn React Navigation (@react-navigation/native) for multiple screens
Use AsyncStorage or SQLite/Realm for local data
Try fetching APIs with fetch or axios

✅ With just this, you’ll have a working mobile app you can run on your Redmi A2 (or emulator) and keep improving step by step.

Do you want me to:
👉 (A) give you a minimal working "Hello World" project code you can paste directly, OR
👉 (B) outline a step-by-step practice roadmap (small milestones to learn React Native gradually)?

== == == == == == == == == == == == == == == == == == == == == == == == == == == == == ==

Tests

(base) jain@jain-ThinkPad-T440s:~/Desktop/ws/react_native_apps$ node -v
v18.19.1

survival8

Pages