React Native प्रोजेक्ट कसरी संरचित हुन्छ?

Question

Accepted Answer

React Native प्रोजेक्टको संरचना **JavaScript/TypeScript कोड**, **native iOS/Android प्रोजेक्ट** र कन्फिगरेसन गरेर बनेको हुन्छ। संरचना र मुख्य फाइलहरू बुझ्नुले React Native अनुप्रयोग नेभिगेट गर्न र बनाउन मद्दत गर्छ।

## संरचनाका मुख्य भागहरू

```text
my-app/
  App.js / App.tsx       → the root component (app entry point)
  src/ (or app/)         → your JS/TS code (components, screens, etc.) — organize here
  package.json           → dependencies and scripts (npm/yarn) — like any JS project
  node_modules/          → installed npm dependencies
  ios/                   → the native iOS project (Xcode) — for bare RN
  android/               → the native Android project (Gradle) — for bare RN
  index.js               → registers the root component
  app.json / app.config  → app config (name, icon) — especially in Expo
  (Expo projects hide ios/android; managed by Expo)
```

## JavaScript इकोसिस्टम

```text
→ package.json → dependencies (React Native, navigation, libraries) + scripts
→ npm / yarn → install packages (npm install); the huge npm ecosystem is available
→ Metro → React Native's JavaScript bundler (bundles your JS for the app)
→ Babel → transpiles modern JS/JSX/TypeScript
```

## आपनो कोड संगठित गर्नुहोस्

```text
→ Organize src/ into folders (common):
  src/components/ (reusable UI), src/screens/ (screen components),
  src/navigation/, src/services/ (API), src/hooks/, src/utils/, src/store/ (state)
→ Keep code organized as the app grows (separation by feature or type).
```

## यो किन महत्त्वपूर्ण छ

React Native प्रोजेक्ट कसरी संरचित हुन्छ भनी बुझ्नु React Native अनुप्रयोग नेभिगेट गर्न, बनाउन र संगठित गर्नको लागि आवश्यक व्यावहारिक ज्ञान हो, त्यसैले यो उपयोगी आधारभूत ज्ञान हो।

**मुख्य भागहरू** जान्नु आवश्यक छ — कि **App.js/App.tsx रुट कम्पोनेन्ट** हो (प्रवेश बिन्दु), तपाईंको **JS/TS कोड `src/` मा रहन्छ** (जहाँ तपाई अधिकांश समय बिताउनु हुन्छ), **package.json** निर्भरताहरू र स्क्रिप्टहरू व्यवस्थापन गर्छ (कुनै पनि JavaScript प्रोजेक्ट जस्तै), र **native `ios/` र `android/` प्रोजेक्ट** अस्तित्वमा छ (bare React Native को लागि, जबकि Expo तिनलाई व्यवस्थापन गर्छ) — React Native प्रोजेक्ट वरिपरि आफ्नो बाटो खोज्न आवश्यक छ, जो JavaScript कोड र native प्रोजेक्ट गरेर संयुक्त हुन्छ।

**JavaScript इकोसिस्टम** पहलु बुझ्नु महत्त्वपूर्ण छ: React Native प्रोजेक्टले **package.json र npm/yarn** निर्भरताको लागि (विशाल npm इकोसिस्टम उपलब्ध — एक प्रमुख लाभ), **Metro** (React Native को bundler), र Babel प्रयोग गर्दछ — यो प्रतिबिम्बित गर्दछ कि React Native विकास JavaScript विकास हो परिचित उपकरणको साथ, वेब विकासकर्ताहरूको लागि मूल्यवान।

**कोड संगठित गर्न** कसरी बुझ्नु (`src/` लाई विशेषताधारित वा प्रकार अनुसार फोल्डरमा संरचित गर्न — कम्पोनेन्ट, स्क्रीन, नेभिगेसन, सेवाहरू, hooks, utils, store) राख्नु अच्छा अभ्यास प्रतिबिम्बित गर्छ जस्तै प्रोजेक्ट बढ्दा।

React Native सँग काम गरेको कारण प्रोजेक्ट संरचना नेभिगेट गर्न आवश्यक छ (JS कोड र native प्रोजेक्ट), package.json मार्फत निर्भरताहरू व्यवस्थापन गर्न, bundler बुझ्न, र कोड संगठित गर्न, र यो ज्ञान कुनै पनि React Native विकासको लागि आवश्यक व्यावहारिक आधार हो, React Native प्रोजेक्ट कसरी संरचित हुन्छ भनी बुझ्नु — मुख्य फाइलहरू, JavaScript इकोसिस्टम, र कोड संगठन — React Native प्रोजेक्ट सँग काम गर्नको लागि मूल्यवान, आधारभूत व्यावहारिक ज्ञान हो, अनुप्रयोग बनाउन र राख्न आवश्यक र एक आधारभूत योग्यता जो विशेष गरी JavaScript/npm इकोसिस्टमसँग परिचित विकासकर्ताहरूको लागि पहुँचयोग्य हो।