React Native

React Native
Basisdaten
Entwickler	Meta und die Open Source Community
Erscheinungsjahr	2015[1]
Aktuelle Version	0.85.0[2] (8. April 2026)
Betriebssystem	Android, Android TV, iOS, macOS, tvOS, Web, Windows, UWP, und VR
Programmier­sprache	JavaScript, Java, C++, Objective-C, Python
Kategorie	Application Framework
Lizenz	MIT-Lizenz
reactnative.dev

React Native ist ein quelloffenes UI-Framework zur Erstellung von Anwendungen für Android,^[3][4] Android TV,^[5] iOS,^[4] macOS,^[6] tvOS,^[7] Web,^[8] Windows^[6] und UWP^[9], welches von Meta Platforms, Inc.^[10] entwickelt wird. Es ermöglicht Entwicklern, native Systemfunktionen bei der Entwicklung mit der React-Bibliothek zu verwenden.^[11] Es wird unter anderem bei Facebook, Microsoft und Shopify zur Entwicklung der eigenen Android- und iOS-Apps verwendet.^[12]

In 2012 kommentierte Mark Zuckerberg: „Der größte Fehler, den wir als Unternehmen gemacht haben, war zu sehr auf HTML5 statt auf native Entwicklung zu setzen“. Die Nutzung von HTML5 in der mobilen Facebook-App sorgte laut eigener Aussage für Instabilität und eine insgesamt langsamere Anwendung.^[13][14] Er versprach zugleich, Facebook würde bald eine bessere mobile Nutzungserfahrung schaffen.

Jordan Walke, ein Softwareentwickler bei Facebook, fand einen Weg, UI-Elemente in iOS aus einem JavaScript-Thread, welcher im Hintergrund läuft, zu erzeugen. Dies wurde zur Basis für das React-Framework. Facebook entschied sich dazu, einen internen Hackathon abzuhalten, um aus dem Prototyp ein produktiv einsetzbares Framework zu machen und künftig native Mobile-Apps mit der Technologie entwickeln zu können.^[15]

Nach Monaten der Entwicklung veröffentlichte Facebook 2015 die erste Version auf der React JavaScript Configuration Konferenz. Während einer technischen Keynote^[16] erklärte Christopher Chedeau, dass Facebook React Native bereits produktiv in einigen der eigenen Apps, namentlich der Group App und der Ads Manager App, verwendete.^[1]

Die Funktionsweise von React Native ist quasi identisch zu React, mit der Ausnahme, dass React Native nicht den DOM über den „Virtual DOM“ manipuliert. Der vom Entwickler geschriebene JavaScript-Code wird in einem Hintergrundprozess direkt auf dem Endgerät interpretiert. Die Kommunikation zwischen dem JavaScript-Code und dem Betriebssystem erfolgt über serialisierte Daten, welche gestapelt über eine asynchrone Brücke ausgetauscht werden.^[17][18]

React-Komponenten abstrahieren den nativen Code und interagieren mit System-APIs mittels dem deklarativem UI-Programmierparadigma von React sowie JavaScript. TypeScript wird bei der Entwicklung moderner React Native Apps aufgrund der erhöhten Typsicherheit jedoch oft gegenüber JavaScript bevorzugt.^[19]

Obwohl das Styling in React Native eine ähnliche Syntax zu CSS nutzt, verwendet es kein HTML oder CSS. ^[20] Stattdessen werden den React-Komponenten die Styling-Regeln direkt im JavaScript-Code in Form eines Attributs zugewiesen.

React Native ist auch für Windows und macOS verfügbar. Die entsprechenden Entwicklungswerkzeuge werden jeweils von Microsoft entwickelt.^[6]

Ein „Hello World!“ Programm mit einem einfachen Zähler kann in React Native wie folgt implementiert werden:

import { AppRegistry, Text, View, Button } from 'react-native';
import * as React from 'react';

const HelloWorldApp = () => {
  const [count, setCount] = React.useState(0);

  const incrementCount = () => {
	setCount(count + 1);
  };

  return (
    <View>
        <Text>Hello World!</Text>
        <Text>{count}</Text>
		<Button onPress={incrementCount} title="Zähler erhöhen" />
    </View>
  );
}

export default HelloWorldApp;

AppRegistry.registerComponent('HelloWorld', () => HelloWorldApp);

• React
• NativeScript
• Xamarin
• Titanium SDK
• Apache Cordova
• Flutter
• Qt (Bibliothek)

• Bonnie Eisenman: Learning React Native. Hrsg.: O'Reilly. 2016, ISBN 978-1-4919-2900-1 (englisch). 

1. ↑ ^{a b} React Native: Bringing modern web techniques to mobile. 26. März 2015, abgerufen am 9. September 2023 (englisch). 
2. ↑ Release 0.85.0. 8. April 2026 (abgerufen am 8. April 2026).
3. ↑ Android Release for React Native. 14. September 2015, abgerufen am 9. September 2023 (englisch). 
4. ↑ ^{a b} Stephen Shankland: Mozilla's radical open-source move helped rewrite rules of tech. In: CNET. 29. März 2018, abgerufen am 9. September 2023 (englisch). 
5. ↑ Building For TV Devices · React Native. In: reactnative.dev. Abgerufen am 9. September 2023 (englisch). 
6. ↑ ^{a b c} React Native for Windows + macOS · Build native Windows & macOS apps with Javascript and React. In: microsoft.github.io. Abgerufen am 9. September 2023 (englisch). 
7. ↑ React Native for Apple TV. In: GitHub. Abgerufen am 23. Mai 2024 (englisch). 
8. ↑ React Native for Web. In: GitHub. Abgerufen am 9. September 2023 (englisch). 
9. ↑ Windows Apps Team: React Native on the Universal Windows Platform. In: blogs.windows.com. 13. April 2016, abgerufen am 9. September 2023 (englisch). 
10. ↑ Chapter 1. What Is React Native? In: oreilly.com. O’Reilly Media, Inc., abgerufen am 9. September 2023 (englisch). 
11. ↑ Out-of-Tree Platforms. In: reactnative.dev. Facebook, Inc., abgerufen am 9. September 2023 (englisch). 
12. ↑ React Native Showcase. In: reactnative.dev. Abgerufen am 9. September 2023 (englisch). 
13. ↑ Christina Warren: Zuckerberg's Biggest Mistake? 'Betting on HTML5'. Mashable, 11. September 2012, abgerufen am 9. September 2023 (englisch). 
14. ↑ Jürgen Vielmeier: Mark Zuckerberg kündigt Facebook-Suchmaschine an, nennt HTML 5 einen strategischen Fehler. BASIC thinking, 12. September 2012, abgerufen am 9. September 2023. 
15. ↑ Martin Konicek: React Native: A year in review. In: Engineering at Meta. Meta, 13. April 2016, abgerufen am 9. September 2023 (englisch). 
16. ↑ Christopher Chadeau: A Deep Dive into React Native. In: YouTube. Abgerufen am 9. September 2023 (englisch). 
17. ↑ Tadeu Zagallo: Bridging in React Native. 14. Oktober 2015, abgerufen am 9. September 2023 (englisch). 
18. ↑ How we build React Native app: 7 things which save your development time. Part 2. Abgerufen am 9. September 2023 (englisch). 
19. ↑ Using TypeScript. In: reactnative.dev. Meta Platforms, Inc., abgerufen am 9. September 2023 (englisch). 
20. ↑ React Native Style. In: reactnative.dev. Abgerufen am 9. September 2023 (englisch).