React Nativeでプラットフォーム固有のコードをどのように書きますか？

Question

Accepted Answer

React NativeはほとんどのコードをiOSとAndroid間で共有しますが、時にはプラットフォーム固有のコードまたはスタイリング（異なるプラットフォームの動作、デザイン、または機能用）が必要になります。React Nativeは、このために**Platform**モジュールとプラットフォーム固有のファイル拡張子を提供します。

## Platformモジュール

```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.select`はプラットフォームごとに値を選択します — 条件付き動作とスタイリングの場合です。

## プラットフォーム固有のファイル

```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)
```

## なぜ重要なのか

プラットフォーム固有のコードを書く方法を理解することは価値があります。**クロスプラットフォームアプリでも時にはプラットフォーム固有の動作またはスタイリングが必要**なため、正しく処理することは実際のReact Nativeアプリの有用な実践的知識です。

React Nativeの価値はiOSとAndroid間でほとんどのコードを共有することにありますが、実際のアプリは時に**プラットフォームごとに分岐する**必要があります — プラットフォームのデザイン規約（iOSとAndroid/Material美学）、プラットフォーム固有の機能またはAPI、動作の違い、またはプラットフォーム適切なUXのためです。このように対応する方法を理解することは重要です。

**Platformモジュール**（プラットフォームをチェックするための`Platform.OS`と、プラットフォームごとに値を選択する`Platform.select`）は小さな違いをインラインで処理します — 条件付き動作とスタイリング。**プラットフォーム固有のファイル**（`.ios.js`と`.android.js`拡張子を使用し、React Nativeが自動的に正しいファイルを選択）は大きな違いをきれいに処理します（多くの条件分岐ではなく、別々の実装）。

**これらをいつ、どのように使用するか**を理解することは優れた判断を反映しています。プラットフォーム固有のコードを**慎重に**使用すること（デフォルトでコードを共有し、実際に必要な場合にのみ分岐 — React Nativeのクロスプラットフォームの利点を保持）、小さな違いにはPlatformモジュール、大きな違いにはプラットフォーム固有のファイルを選択する、そして重要なことに**両プラットフォームでテストする**（1つで機能する機能が他方で異なるか壊れるかもしれない — 一般的な実際の問題）。

このバランスの取れたアプローチ（デフォルトで共有し、必要に応じて思慮深く分岐し、両方でテスト）は成熟したクロスプラットフォーム開発を反映しています。

クロスプラットフォームアプリは時に正当にプラットフォーム固有のコードが必要（規約、機能、またはUXのため）であり、それを適切に処理すること（慎重に使用された正しいツール、両プラットフォームテスト）は品質アプリにとって重要です。また、Platformモジュールとプラットフォーム固有のファイルを理解することはこれを可能にするため、React Nativeでプラットフォーム固有のコードを書く方法を理解することは価値があり、実践的に関連性がある知識です — React Nativeを価値あるものにしているクロスプラットフォームコード共有を保持しながら、実際のアプリで発生するプラットフォーム差異を処理するのに有用であり、思慮深いクロスプラットフォーム開発を反映しています。