Menü

Externe Bibliotheken für React: Material-UI und React Router einbinden

Für React gibt es viele Erweiterungen: React Router und Material-UI helfen bei der Navigation innerhalb von Single-Page Applications und bei deren Design.

Lesezeit: 11 Min.
In Pocket speichern
vorlesen Druckansicht Kommentare lesen
Von

Inhaltsverzeichnis

Viele Änderungen wie die Hook-API, Suspense und Verbesserungen in der Context-API haben in der letzten Zeit ihren Weg in React gefunden. Weitere Verbesserungen wie Concurrent Rendering sind geplant. Doch nicht nur der Kern von React wird stetig weiterentwickelt, auch das Ökosystem drumherum wächst.

Dieser Artikel stellt zwei etablierte Bibliotheken vor und zeigt ihre Integration in eine Applikation: React Router und Material-UI. React Router erlaubt die Navigation innerhalb einer Single-Page Application. Und Material-UI ist eine Komponentensammlung, die das Material Design von Google in Form von React-Komponenten umsetzt. Sie kommen nicht nur in zahlreichen Applikationen zum Einsatz, sondern stehen auch exemplarisch für eine Vielzahl ähnlicher Bibliotheken, die eine Applikation entweder technisch oder in Form von Layoutverbesserungen aufwerten.

Alle Artikel der React-Reihe:

mehr anzeigen

Die zugrunde liegende Applikation ist ein Quiz, bei dem ein Benutzer Fragen erhält und aus einer Reihe von Antwortmöglichkeiten die passende auswählen muss. Nachdem er die Frage beantwortet hat, wird angezeigt, ob die Antwort richtig oder falsch war. Kurz darauf bekommt er die nächste Frage präsentiert. Sobald die letzte Frage beantwortet ist, erscheint eine Zusammenfassung. Auf dieser Basis kommt zunächst React Router zum Einsatz, um die einzelnen Quizfragen als unabhängige Ressourcen über URLs adressierbar zu machen.

Immer mehr Wissen. Das digitale Abo für IT und Technik.

  • Zugriff auf alle Inhalte von heise+
  • exklusive Tests, Ratgeber & Hintergründe: unabhängig, kritisch fundiert
  • c't, iX, Technology Review, Mac & i, Make, c't Fotografie direkt im Browser lesen
  • einmal anmelden – auf allen Geräten lesen - jederzeit kündbar
  • erster Monat gratis, danach monatlich 9,95 €
  • Wöchentlicher Newsletter mit persönlichen Leseempfehlungen des Chefredakteurs
GRATIS-Monat beginnen Jetzt GRATIS-Monat beginnen Mehr Informationen zu heise+