CINXE.COM
React Native for Windows + macOS 路 Build native Windows & macOS apps with Javascript and React
<!DOCTYPE html><html lang=""><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>React Native for Windows + macOS 路 Build native Windows & macOS apps with Javascript and React</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="Build native Windows & macOS apps with Javascript and React"/><meta property="og:title" content="React Native for Windows + macOS 路 Build native Windows & macOS apps with Javascript and React"/><meta property="og:type" content="website"/><meta property="og:url" content="https://microsoft.github.io/react-native-windows/"/><meta property="og:description" content="Build native Windows & macOS apps with Javascript and React"/><meta property="og:image" content="https://microsoft.github.io/react-native-windows/img/undraw_online.svg"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://microsoft.github.io/react-native-windows/img/undraw_tweetstorm.svg"/><link rel="shortcut icon" href="/react-native-windows/img/favicon.ico"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/solarized-dark.min.css"/><link rel="stylesheet" href="/react-native-windows/css/code-block-buttons.css"/><script type="text/javascript" src="https://cdn.jsdelivr.net/npm/focus-visible@5.0.2/dist/focus-visible.min.js"></script><script type="text/javascript" src="https://platform.twitter.com/widgets.js"></script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/react-native-windows/js/code-block-buttons.js"></script><script type="text/javascript" src="/react-native-windows/js/nav-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script> document.addEventListener('DOMContentLoaded', function() { addBackToTop( {"zIndex":100} ) }); </script><script src="/react-native-windows/js/scrollSpy.js"></script><link rel="stylesheet" href="/react-native-windows/css/prism.css"/><link rel="stylesheet" href="/react-native-windows/css/main.css"/><script src="/react-native-windows/js/codetabs.js"></script></head><body><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/react-native-windows/"><img class="logo" src="/react-native-windows/img/header_logo.svg" alt="React Native for Windows + macOS"/><h2 class="headerTitleWithLogo">React Native for Windows + macOS</h2></a><a href="/react-native-windows/versions"><h3>0.76</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/react-native-windows/docs/getting-started" target="_self">Docs</a></li><li class=""><a href="/react-native-windows/docs/flyout-component" target="_self">APIs</a></li><li class=""><a href="https://devblogs.microsoft.com/react-native/" target="_self">Blog</a></li><li class=""><a href="/react-native-windows/resources" target="_self">Resources</a></li><li class=""><a href="https://github.com/microsoft/react-native-windows-samples/tree/main/samples" target="_self">Samples</a></li><li class=""><a href="/react-native-windows/support" target="_self">Support</a></li></ul></nav></div></header></div></div><div class="navPusher"><div class="homepage"><section class="Section HeaderHero light"><div class="TwoColumns reverse"><div class="column first right"><div class="socialLinks"><a href="https://twitter.com/ReactNativeMSFT?ref_src=twsrc%5Etfw" class="twitter-follow-button" data-size="large" data-show-count="false">Follow @ReactNativeMSFT</a></div><div width="400"><img alt="" src="/react-native-windows/img/homepage/cross-platform.png"/></div></div><div class="column last left"><h1 class="title">React Native for</h1><p class="tagline">Windows + macOS</p></div></div></section><div background="light" class="SmallSection"><div class="CenterContent" style="padding-top:-150px"><div><span><h2><a class="anchor" aria-hidden="true" id="bring-your-ureact-nativeu-apps-to-some-of-the-most-powerful-devices-out-there"></a><a href="#bring-your-ureact-nativeu-apps-to-some-of-the-most-powerful-devices-out-there" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Bring your <u><a href="https://reactnative.dev/">React Native</a></u> apps to some of the most powerful devices out there</h2> </span></div></div></div><section class="Section undefined tint"><div class="content"><div class="row"><div class="column"><img class="HomePageImage" style="max-width:200%;margin-left:-300px;margin-top:-70px;margin-bottom:-70px" src="./img/homepage/native_and_js_windows_cropped.png" alt="rnw_cropped"/></div><div class="column"><h2 class="Heading">Build for Windows</h2><a class="github-button" href="https://github.com/microsoft/react-native-windows" data-icon="octicon-face" data-size="large" aria-label="Star microsoft/react-native-windows on GitHub">GitHub</a><div style="margin-bottom:35px"><div><span><p>Take your apps across PC, Xbox, Surface Tablets, and dual-screens with our robust Windows extension to React Native.</p> </span></div></div><a class="ActionButton primary" href="/react-native-windows/docs/getting-started" target="_self"><b style="font-size:24px">Get started with Windows</b></a></div></div></div></section><section class="Section undefined light"><div class="content"><div class="row"><div class="column"><h2 class="Heading">Build for macOS</h2><a class="github-button" href="https://github.com/microsoft/react-native-macos" data-icon="octicon-face" data-size="large" aria-label="Star microsoft/react-native-macos on GitHub">GitHub</a><div style="margin-bottom:35px"><div><span><p>Extend your desktop experience to more than just Windows!<br> Try out our fully supported macOS extension to React Native.</p> </span></div></div><a class="ActionButton primary" href="/react-native-windows/docs/rnm-getting-started" target="_self"><b style="font-size:24px">Get started with macOS</b></a></div><div class="column"><img class="HomePageImage" style="max-width:200%;margin-top:-70px;margin-bottom:-70px" src="./img/homepage/native_and_js_mac_cropped.png" alt="rnw_cropped"/></div></div></div></section><section class="Section undefined light"><div class="content"><h2 class="Heading">About React Native for Windows + macOS</h2><div><span><p><strong>React Native for Windows + macOS brings React Native support for the <a href="https://developer.microsoft.com/windows/downloads/windows-sdk/">Windows SDK</a> as well as the <a href="https://developer.apple.com/documentation/macos-release-notes/macos-mojave-10_14-release-notes">macOS 10.14 SDK</a></strong>. With this, you can use JavaScript to build native Windows apps for <a href="https://docs.microsoft.com/windows/apps/get-started/?tabs=rnw">all devices supported by Windows 10 and higher</a> including PCs, tablets, 2-in-1s, Xbox, Mixed reality devices, etc., as well as the macOS desktop and laptop ecosystems.</p> <p>Some build-time tools will send telemetry to Microsoft by default. No telemetry is collected or transmitted in the final app. You can prevent the telemetry from being sent by using the --no-telemetry command line option. See the --help command or README file for more details.</p> </span></div></div></section></div><footer class="nav-footer" id="footer"><section class="sitemap"><div><h5>React Native Docs</h5><a href="https://reactnative.dev/docs/getting-started">Getting Started</a><a href="https://reactnative.dev/docs/tutorial">Tutorial</a><a href="https://reactnative.dev/docs/components-and-apis">Components and APIs</a><a href="https://reactnative.dev/docs/more-resources">More Resources</a></div><div><h5>React Native for Windows + macOS Docs</h5><div style="color:white;font-weight:500;font-size:16px"><a href="/react-native-windows/docs/getting-started">Get Started with Windows</a></div><div style="color:white;font-weight:500;font-size:16px"><a href="/react-native-windows/docs/rnm-getting-started"> Get Started with macOS</a></div><a href="/react-native-windows/docs/parity-status">React Native Windows Components and APIs</a><a href="/react-native-windows/docs/native-modules">Native Modules</a><a href="/react-native-windows/docs/view-managers">Native UI Components</a></div><div><h5>Connect With Us On</h5><a href="https://devblogs.microsoft.com/react-native/">Blog</a><a href="https://twitter.com/ReactNativeMSFT" target="_blank">Twitter</a><a href="https://github.com/microsoft/react-native-windows" target="_blank">GitHub</a><a href="https://github.com/microsoft/react-native-windows-samples/tree/main/samples" target="_blank">Samples</a></div></section></footer></div></body></html>