🚀 React Native দিয়ে প্রথম অ্যাপ বানানো

Environment সেটআপ করার পর এবার আমরা আমাদের প্রথম React Native অ্যাপ তৈরি করবো। এখানে দুটো জনপ্রিয় উপায় আছে:

• Expo → Beginners-এর জন্য Best (No Android Studio needed)
• React Native CLI → Professional app development-এর জন্য Best

এখন আমরা দুটোরই অ্যাপ তৈরি দেখবো।

---

✨ 1) Expo দিয়ে প্রথম অ্যাপ তৈরি

📌 Step 1: নতুন প্রজেক্ট তৈরি

npx create-expo-app MyFirstApp
    

📌 Step 2: প্রজেক্ট ফোল্ডারে ঢুকুন

cd MyFirstApp
    

📌 Step 3: অ্যাপ রান করুন

npx expo start
    

এটার পর আপনি মেবাইল দিয়ে Expo Go App ব্যবহার করে QR কোড স্ক্যান করলে অ্যাপ রান হয়ে যাবে। Chrome ব্রাউজারে Metro Bundler খুলবে।

📌 Default App.js কেমন থাকে?

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

export default function App() {
  return (
    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
      <Text>Hello React Native! 👋</Text>
    </View>
  );
}
    

এই কোডই আপনার প্রথম React Native UI!

---

⚙️ 2) React Native CLI দিয়ে প্রথম অ্যাপ তৈরি

📌 Step 1: নতুন প্রজেক্ট তৈরি

npx react-native init MyFirstCLIApp
    

📌 Step 2: Android-এ রান করা

npx react-native run-android
    

📌 Step 3: iOS-এ রান করা (Mac only)

npx react-native run-ios
    

📌 CLI-এর App.js কেমন থাকে?

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

const App = () => {
  return (
    <View style={{flex:1, justifyContent:'center', alignItems:'center'}}>
      <Text>Welcome to React Native CLI! 🚀</Text>
    </View>
  );
};

export default App;
    

---

📂 React Native Folder Structure (Quick Overview)

• App.js → Main component
• package.json → Dependencies
• android/ → Android files (CLI only)
• ios/ → iOS files (CLI only)
• assets/ → Images, fonts, icons

---