npx react-native@latest init MyApp
cd MyApp
npx react-native-windows-init --overwrite

npx react-native run-windows

import { Platform } from 'react-native';

const styles = StyleSheet.create({
  container: {
    ...Platform.select({
      windows: {
        backgroundColor: '#0078D4',
      },
      default: {
        backgroundColor: '#fff',
      },
    }),
  },
});

npx react-native@latest init MyApp
cd MyApp
npx react-native-macos-init

npx react-native run-macos

require_relative '../node_modules/react-native-macos/scripts/react_native_pods'

platform :osx, '10.15'

target 'YourApp-macOS' do
  use_native_modules!
  
  use_react_native!(
    :path => '../node_modules/react-native-macos'
  )
end

npm install react-native-web react-dom

module.exports = {
  resolve: {
    alias: {
      'react-native$': 'react-native-web',
    },
    extensions: ['.web.js', '.js', '.json'],
  },
};

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

const App = () => (
  <View>
    <Text accessibilityRole="header" accessibilityLevel={1}>
      Welcome to React Native Web
    </Text>
  </View>
);

import { Platform } from 'react-native';

if (Platform.isTV) {
  // TV-specific code
}

if (Platform.OS === 'android' && Platform.isTV) {
  // Android TV specific
}

if (Platform.OS === 'ios' && Platform.isTV) {
  // tvOS specific
}

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

const TVButton = () => (
  <TouchableOpacity
    hasTVPreferredFocus={true}
    tvParallaxProperties={{
      enabled: true,
      shiftDistanceX: 2,
      shiftDistanceY: 2,
      tiltAngle: 0.05,
      magnification: 1.1,
    }}
  >
    <Text>Focus on this button</Text>
  </TouchableOpacity>
);

import { TVEventHandler } from 'react-native';

class RemoteControlExample extends React.Component {
  componentDidMount() {
    this.tvEventHandler = new TVEventHandler();
    this.tvEventHandler.enable(this, (cmp, evt) => {
      if (evt && evt.eventType === 'select') {
        // Handle select button
      }
    });
  }
  
  componentWillUnmount() {
    if (this.tvEventHandler) {
      this.tvEventHandler.disable();
      delete this.tvEventHandler;
    }
  }
}

cd ios
pod install

platform :visionos, '1.0'

target 'YourApp-visionOS' do
  use_react_native!(
    :path => config[:reactNativePath],
    :hermes_enabled => true
  )
end

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

const SpatialView = () => (
  <View
    style={{
      transform: [{ translateZ: 100 }],
    }}
  >
    <Text>Content in 3D space</Text>
  </View>
);

import { Platform, StyleSheet } from 'react-native';

const styles = StyleSheet.create({
  container: {
    ...Platform.select({
      ios: { paddingTop: 20 },
      android: { paddingTop: 0 },
      windows: { paddingTop: 10 },
      macos: { paddingTop: 15 },
      web: { paddingTop: 0 },
      default: { paddingTop: 0 },
    }),
  },
});

Component.js          // All platforms
Component.ios.js      // iOS only
Component.android.js  // Android only
Component.windows.js  // Windows only
Component.macos.js    // macOS only
Component.web.js      // Web only
Component.native.js   // All native platforms

if (Platform.OS === 'android' && Platform.Version >= 31) {
  // Android 12+ specific code
}

if (Platform.OS === 'ios' && parseInt(Platform.Version, 10) >= 15) {
  // iOS 15+ specific code
}

{
  "dependencies": {
    "react-native": "^1000.0.0",
    "react-native-windows": "^0.75.0",
    "react-native-macos": "^0.75.0"
  }
}