Skillshub react-native-platform-specific

Handling iOS and Android differences with Platform API and native modules. Use when handling platform-specific behavior or integrating native modules in React Native. (triggers: **/*.tsx, **/*.ts, **/*.ios.*, **/*.android.*, Platform, Platform.select, native-module, ios, android)

install
source · Clone the upstream repo
git clone https://github.com/ComeOnOliver/skillshub
Claude Code · Install into ~/.claude/skills/
T=$(mktemp -d) && git clone --depth=1 https://github.com/ComeOnOliver/skillshub "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/HoangNguyen0403/agent-skills-standard/react-native-platform-specific" ~/.claude/skills/comeonoliver-skillshub-react-native-platform-specific && rm -rf "$T"
manifest: skills/HoangNguyen0403/agent-skills-standard/react-native-platform-specific/SKILL.md
source content

React Native Platform-Specific Code

Priority: P1 (OPERATIONAL)

File Extensions

Use

.ios.
and
.android.
for platform-specific files:

Button.tsx          # Shared
Button.ios.tsx      # iOS-specific
Button.android.tsx  # Android-specific

React Native automatically picks the right file:

  • iOS: Button.ios.tsx → Button.tsx (fallback)
  • Android: Button.android.tsx → Button.tsx (fallback)

Native Modules

  • Expo: Use Expo modules when available (
    expo-*
    packages).
  • Bare RN: Use community modules (
    @react-native-community/*
    ).
  • Custom: Write native modules in Swift/Kotlin when needed.

Anti-Patterns

  • No Excessive Branching: Extract to separate files if logic diverges.
  • No Hardcoded Version Checks: Use feature detection.
  • No Ignoring Android: Test on both platforms.

References

See references/native-modules.md for Platform detection examples, Native Bridge (iOS/Android), Expo JSI Modules, and SafeArea handling.