React ist eine Open-Source-JavaScript-Bibliothek zum Entwickeln von Benutzeroberflächen. React wird von Facebook, Instagram und der Community einzelner Entwickler und Unternehmen entwickelt und gepflegt.
Mit React können einzelne Seiten und mobile Apps entwickelt werden. Ziel ist es, hohe Geschwindigkeit, Einfachheit und Skalierbarkeit zu gewährleisten. Als Bibliothek zur Entwicklung von Benutzeroberflächen wird React häufig mit anderen Bibliotheken wie MobX, Redux und GraphQL verwendet.
React wurde von Jordan Valke erstellt, einem Softwareentwickler bei Facebook. Das Projekt wurde von XHP beeinflusst, einem HTML-Komponentenframework für PHP. React wurde erstmals 2011 im Facebook-Newsfeed und 2012 im Instagram-Feed verwendet. React Native wurde im Februar 2015 auf Facebooks „React.js Conf“ angekündigt und im März 2015 als Open-Source-Version veröffentlicht. Mit React können Sie native Android-, iOS- und UWP-Apps entwickeln.
Am 18. April 2017 kündigte Facebook React Fibre an, eine überarbeitete und optimierte Version von React. React Fibre wird die Grundlage für alle zukünftigen Funktionen und Verbesserungen bilden.
Merkmale
Unidirektionale Datenübertragung - Eigenschaften werden von übergeordneten an untergeordnete Komponenten übergeben. Komponenten erhalten Eigenschaften als Satz unveränderlicher Werte, sodass eine Komponente die Eigenschaften direkt nicht ändern, sondern Änderungen über Rückruffunktionen aufrufen kann. Dieser Mechanismus wird als „Eigenschaften nach unten, Ereignisse nach oben“ bezeichnet.
Virtuelles DOM - React verwendet das virtuelle DOM. React erstellt eine speicherinterne Cache-Struktur, mit der Anwender die Differenz zwischen dem vorherigen und dem aktuellen Status der Schnittstelle berechnen können, um das DOM des Browsers optimal zu aktualisieren. Somit kann der Programmierer mit der Seite arbeiten, vorausgesetzt, sie wird als Ganzes aktualisiert, aber die Bibliothek selbst entscheidet, welche Seitenkomponenten aktualisiert werden müssen.
JSX - Javascript XML (JSX) ist eine Javascript-Syntaxerweiterung, mit der Anwender die Struktur einer Schnittstelle mithilfe einer HTML-ähnlichen Syntax beschreiben können. Komponenten werden mit JSX geschrieben, es ist jedoch auch möglich, reguläres Javascript zu verwenden. JSX ähnelt einer anderen Sprache, die Facebook für die PHP-Erweiterung XHP erstellt hat.
Lebenszyklusmethoden - Mithilfe von Lebenszyklusmethoden kann ein Entwickler den Code in verschiedenen Phasen des Lebenszyklus einer Komponente ausführen.
Nicht nur HTML-Rendering im Browser - React wird nicht nur zum Rendern von HTML im Browser verwendet. Facebook verfügt beispielsweise über dynamische Grafiken, die in canvas-Tags gerendert werden. Netflix und PayPal verwenden isomorphe Downloads, um identischen HTML-Code auf Server und Client zu rendern.
React Hooks - Mit Hooks können Anwender den Status- und andere React-Funktionen verwenden, ohne Klassen schreiben zu müssen. Durch das Erstellen benutzerdefinierter Hooks können Anwender Komponentenlogik in wiederverwendbare Funktionen einfügen.
MERN-Stack
Die MongoDB-Datenbank, Express.js und ReactJS-Frameworks sowie die Node.js-Technologie bilden zusammen den MERN-Stack - eine leistungsstarke Plattform, die auf allen Ebenen nur eine Sprache verwendet: Javascript.