React
Was ist React?
Bei React handelt es sich um eine Bibliothek für die Implementierung von Web-Frontends.
Single Page Applikationen
React wird in der Regel bei der Implementierung von Single-Page-Applikationen eingesetzt. Beim initialen Laden der Seite kommen oft solche Konzepte wie Lazy Loading und Server Side Rendering zum tragen, um das Laden von notwendigen Ressourcen zu verbessern.
Thinking in React
- die Oberfläche in eine Komponentenhierarchie zerlegen
- eine statische Version in React implementieren
- den minimalen UI State bestimmen
- den Speicherort des States bestimmen
- den inversen Datenfluss modellieren
Funktionskomponenten
Komponenten verfügen über einen Lebenszyklus und über einen Zustand, der in React als State bezeichnet wird. Dieser Zustand ist eine Datenstruktur, die komplette Informationen zur Darstellung der Komponente enthält. Bei jeder Änderung an dieser Datenstruktur wird die Komponente neu gerendert.
Lebenszyklus
- Mount
- Update
- Unmount
Datenfluss
Ein Kernelement bei der Erstellung einer React-Applikation ist die Modellierung von Datenströmen. In der Komponenten-Struktur der Applikation fließen die Informationen immer von den Elternelementen in Richtung ihrer Kinder. In die andere Richtung können die Informationen über eine Callback-Funktion, in React Event Handler bezeichnet, zurückfließen. Diese Funktion kann von Kindelement aufgeführt werden, arbeitet aber im Elternscope und kann somit den State des Elternelements ändern.
State Management
- Flux-Architektur
- useState
ecommerce storefront
- StorefrontUI