React Native

Diese Baustelle befindet sich fälschlicherweise im Artikelnamensraum. Bitte verschiebe die Seite oder entferne den Baustein {{Baustelle}}.

Dieser Artikel ist im Entstehen und noch nicht Bestandteil der freien Enzyklopädie Wikipedia.

Solltest du über eine Suchmaschine darauf gestoßen sein, bedenke, dass der Text noch unvollständig sein und Fehler oder ungeprüfte Aussagen enthalten kann. Wenn du Fragen zum Thema hast, nimm Kontakt mit den Autoren auf.

React Native
Basisdaten
Entwickler	Meta und die Open Source Community
Erscheinungsjahr	26. März 2015
Aktuelle Version	0.79.1
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, Android TV, iOS, macOS, tvOS, Web, Windows und UWP, welches von Meta Platforms, Inc. entwickelt wird. Es ermöglicht Entwicklern, native Systemfunktionen bei der Entwicklung mit dem React-Framework zu verwenden. Es wird unter anderem bei Facebook, Microsoft und Shopify zur Entwicklung der eigenen Android- und iOS-Apps verwendet.

Geschichte

In 2012 kommentierte Mark Zuckerberg: „Der größte Fehler, den wir als Unternehmen gemacht haben, war zu sehr auf HTML im Gegensatz zu nativer 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. Er versprach zugleich, Facebook würde bald eine bessere mobile Nutzungserfahrung schaffen.

Jordan Walke, der zu dieser Zeit bei Facebook arbeitet, 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 diesen Prototypen zu perfektionieren und künftig native Mobile-Apps mit dieser Technologie entwickeln zu können.

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

Implementierung

Die Funktionsprinzipien von React Native sind quasi identisch zu React, mit der Ausnahme, dass React Native nicht den DOM über den Virtual DOM manipuliert. Es läuft in einem Hintergrundprozess (welcher das vom Entwickler geschriebene JavaScript interpretiert) direkt auf dem Endgerät und kommuniziert mit dem Betriebssystem über serialisierte Daten, welche gestapelt über eine asynchrone Brücke ausgetauscht werden.

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

Obwohl das Styling in React Native eine ähnliche Syntax zu CSS nutzt, verwendet es kein HTML oder CSS.  Statt dessen werden Nachrichten des JavaScript-Threads verwendet, um native Views zu manipulieren.

React Native ist auch für Windows and macOS verfügbar, welches derzeit jeweils von Microsoft weiterentwickelt wird.

„Hello World!“ Beispiel

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

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

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

  return (
    <div>
        <Text>Hello World!</Text>
        <h5>{count}</h5>
		<button type={'button'} onClick={incrementCount}>
			Increase Count
		</button>
    </div>
  );
}

export default HelloWorldApp;

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

Siehe auch

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

Literatur

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