React Native मा platform-specific code कसरी लेख्नुहुन्छ?

Question

Accepted Answer

यद्यपि React Native ले iOS र Android मा अधिकांश code साझेदारी गर्छ, कहिलेकाहीँ तपाईंलाई **platform-specific** code वा styling चाहिन्छ — विभिन्न platform behaviors, designs, वा capabilities को लागि। React Native ले यसको लागि **Platform** module र platform-specific file extensions प्रदान गर्छ।

## The Platform module

```jsx
import { Platform } from 'react-native';

// check the current platform
if (Platform.OS === 'ios') { /* iOS-specific */ }
else if (Platform.OS === 'android') { /* Android-specific */ }

// Platform.select — pick a value per platform
const styles = {
  padding: Platform.OS === 'ios' ? 20 : 16,
  ...Platform.select({
    ios: { fontFamily: 'Helvetica' },
    android: { fontFamily: 'Roboto' },
  }),
};
```

`Platform.OS` ले platform जाँच गर्छ; `Platform.select` प्रत्येक platform को लागि मानहरू चयन गर्छ — conditional behavior र styling को लागि।

## Platform-specific files

```text
→ Create separate files per platform using extensions:
  Button.ios.js   → used on iOS
  Button.android.js → used on Android
  import Button from './Button'   → RN automatically picks the right file per platform
→ Good for substantially different platform implementations (cleaner than lots of if-checks)
```

## जब र कसरी यो प्रयोग गर्ने

```text
✓ Use platform-specific code SPARINGLY — share code by default; diverge only when needed
✓ Common reasons: platform design conventions (iOS vs Material), platform-specific
  features/APIs, behavior differences, platform-appropriate UX
✓ Platform module for small differences; .ios/.android files for large differences
✓ Test on BOTH platforms (a feature working on one may differ/break on the other)
```

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

Platform-specific code कसरी लेख्ने भनेर बुझ्नु मूल्यवान छ किनभने **cross-platform apps कहिलेकाहीँ platform-specific behavior वा styling चाहिन्छ**, त्यसकारण यसलाई सही तरिकाले सम्हालना वास्तविक React Native apps को लागि उपयोगी व्यावहारिक ज्ञान हो।

यद्यपि React Native को मूल्य iOS र Android मा अधिकांश code साझेदारी गर्नु हो, वास्तविक apps कहिलेकाहीँ **प्रत्येक platform मा अलग हुन आवश्यक छ** — platform design conventions (iOS बनाम Android/Material aesthetics) को लागि, platform-specific features वा APIs, behavior differences, वा platform-appropriate UX — र यसलाई कसरी सम्हालने भनेर बुझ्नु महत्त्वपूर्ण छ।

**Platform module** (`Platform.OS` लाई platform जाँच गर्न र `Platform.select` लाई प्रत्येक platform को लागि मानहरू चयन गर्न) सानो अन्तरहरू inline मा सम्हाल्छ — conditional behavior र styling। **Platform-specific files** (`.ios.js` र `.android.js` extensions प्रयोग गरेर, React Native स्वचालित रूपमा सही file चयन गर्छ) ठूला अन्तरहरू सफाइसँग सम्हाल्छ (धेरै conditionals भन्दा अलग implementations)।

**कहिले र कसरी यो प्रयोग गर्ने भनेर बुझ्नु** राम्रो निर्णय प्रतिबिम्बित गर्छ: platform-specific code **कम गरेर** प्रयोग गर्नु (default मा code साझेदारी गर्नु र सत्यमा आवश्यक हुँदा मात्र अलग हुनु — React Native को cross-platform लाभ सुरक्षित राख्नु), सानो अन्तरहरूको लागि Platform module र ठूला अन्तरहरूको लागि platform-specific files चयन गर्नु, र महत्त्वपूर्ण रूपमा **दुवै platforms मा परीक्षण गर्नु** (किनभने एक platform मा काम गर्ने feature अर्कोमा फरक वा टुट्न सक्छ — एक सामान्य वास्तविक समस्या)।

यो संतुलित दृष्टिकोण (default मा साझेदारी गर्नु, आवश्यक हुँदा विचारपूर्वक अलग हुनु, दुवै प्लेटफर्म परीक्षण गर्नु) परिपक्व cross-platform development प्रतिबिम्बित गर्छ।

क्योंकि cross-platform apps कहिलेकाहीँ न्यायसंगत रूपमा platform-specific code चाहिन्छ (conventions, features, वा UX को लागि) र यसलाई राम्रोसँग सम्हालना (सही tools स्पष्टसँग प्रयोग गरेर, दुवै-platform परीक्षण सहित) गुणस्तरीय apps को लागि महत्त्वपूर्ण छ, र क्योंकि Platform module र platform-specific files बुझ्नु यसलाई सक्षम गर्छ, React Native मा platform-specific code कसरी लेख्ने भनेर बुझ्नु मूल्यवान, व्यावहारिक-प्रासंगिक ज्ञान हो — वास्तविक apps मा देखिने platform अन्तरहरू सम्हालन गर्नको लागि उपयोगी छ जबकि cross-platform code-sharing सुरक्षित राख्छ जसले React Native लाई मूल्यवान बनाउँछ, विचारपूर्ण cross-platform development प्रतिबिम्बित गर्दै।