React Native

React
Basisdaten

Entwickler Meta und die Open Source Community
Erscheinungsjahr 2015[1]
Aktuelle Version 0.86.0[2]
(11. Juni 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]

Geschichte

Bearbeiten

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]

Implementierung

Bearbeiten

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]

„Hello World!“ Beispiel

Bearbeiten

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

Siehe auch

Bearbeiten

Literatur

Bearbeiten

Einzelnachweise

Bearbeiten
  1. a b React Native: Bringing modern web techniques to mobile. 26. März 2015, abgerufen am 9. September 2023 (englisch).
  2. Release 0.86.0. 11. Juni 2026 (abgerufen am 12. Juni 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).

📚 Artikel Terkait di Wikipedia

React

React zukünftig als Open-Source-Projekt weiterführen zu wollen. Im Februar 2015 wurde React Native, mit welchem unter anderem die Entwicklung nativer

Btrfs

Bezeichnung WinBtrfs, plattformübergreifend für Windows (ab Windows 7) sowie ReactOS entwickelt wird. Btrfs wird seit einiger Zeit als Nachfolger des bislang

Mobile App

Videokonferenz-Tool Zoom. Native Apps zeichnen sich dadurch aus, dass sie speziell an die Zielplattform angepasst sind. Da eine native App die Programmierschnittstellen

Mobile-App-Entwicklung

Airbnb basierte ursprünglich auf dem Framework React Native. Inzwischen hat AirBnB diese aber durch eine native App ersetzt. Web Apps entsprechen, technisch

ReactOS

ReactOS (kurz ROS, englisch react „reagieren“ und operating system „Betriebssystem“) ist ein freies Betriebssystem, das zu Windows binärkompatibel werden

Liste von integrierten Entwicklungsumgebungen

WebStorm (JavaScript, TypeScript, HTML5, Node.js, Angular/AngularJS, React/React Native) RubyMine (Ruby) CLion (C/C++) AppCode (Objective-C, Swift) LiveCode

Cmd.exe

genannt) ist die Betriebssystem-Shell von OS/2, der Windows-NT-Linie und ReactOS. In der Shell können DOS-Kommandozeilenbefehle verarbeitet und

Zulip

Source verfügbar sind: Mobile Apps für iOS und Android basierend auf React Native. Ein Desktop-Client für Windows, macOS und Linux basierend auf Electron