Die Umsetzung des Zustandmanagements in React Applikationen

Autor: Stefanovic, Antonije
Jazyk: angličtina
Rok vydání: 2022
Předmět:
Popis: Single Page Applications (SPAs) sind eines der wichtigsten Themen in der Webentwicklungsbranche, da sie eine sehr gute Lösung zum Erstellen leistungsstarker moderner Apps und zur Verbesserung des Nutzererlebnisses sind. In den letzten Jahren ist die Nachfrage nach React-Entwicklern kontinuierlich gestiegen, da es eines der beliebtesten Frameworks zum Erstellen von SPAs ist. Der Hauptvorteil von React besteht darin, dass es die native Desktoperfahrung in den Webbrowser bringt, was für das moderne Web von entscheidender Bedeutung ist. Zustand, die Darstellung eines Systems zu einem bestimmten Zeitpunkt, ist eines der Kernkonzepte von React, dessen Hauptzweck es ist, die App interaktiv zu machen. Zustandmanagement ist der wichtigste Prozess in der React-Entwicklung, da es eine Voraussetzung für skalierbaren und wartbaren Code ist. Diese Bachelorarbeit beschreibt Best Practices und verschiedene Optionen für die Implementierung des Zustandsmanagements, wobei der Schwerpunkt darauf liegt, Entwicklern beim Erstellen robuster, skalierbarer und wartbarer Applikationen zu helfen. Um dieses Ziel zu erreichen, werden Methoden der Literaturrecherche und der Designwissenschaft verwendet. Der erste Teil dieser Arbeit ist eine Literaturrecherche zu React-Themen, die im Zusammengang mit der Forschungsfrage sind. Obwohl das Zustandsmanagement das Kernkonzept in React und der Welt der Softwareentwicklung ist, gibt es fast keine Forschung dazu. Die Hauptressourcen dieser Arbeit sind Bücher und Webartikel. Der zweite Teil dieser Arbeit ist die Implementierung des „Crypto Stats“ React Projekts, mit dem Fokus auf der Präsentation der Best Practices für das Zustandsmanagement. React Hooks, useState und useReducer, sind die beste Option zum Management des lokalen Zustands. Im Fall der einfachen Zustandslogik sollte useState verwendet werden, ansonsten useReducer, da es für skalierbaren und besser wartbaren Code sorgt. Für das globale Zustandsmanagement bevorzugen einige Entwickler die React Context API gegenüber Redux, Redux ist jedoch eine bessere Lösung, da es viele zusätzliche Funktionen bietet, die die Context API nicht hat. In jedem Fall ist es wichtig, über die möglichen Applikationszustände nachzudenken, bevor die Entwicklung beginnt, da dies den gesamten Implementierungsprozess des Zustandmanagements vereinfacht. Letztendlich hängt die Auswahl der Optionen für das Zustandsmanagement stark von der Projektgröße, der Art der Zustände in dem Projekt und den Entwicklerpräferenzen ab. Single Page Applications (SPAs) are one of the most important topics in the web development industry since they are a great solution for building high-performance modern apps and improving user experience. Over the last couple of years, the demand for React developers has been continuously increasing, since it is one of the most popular frameworks for building SPAs. The main benefit of React is that it is bringing native desktop applications experience to the web browser, which is crucial for the modern web. State, the representation of a system at a given moment in time, is one of the core concepts in React, whose main purpose is to make the application interactive. State management is the most important process in React development, as it is a prerequisite for clean and maintainable code. This thesis describes best practices and different options for state management implementation, with a focus on helping developers in building robust, scalable, and maintainable applications. To achieve this goal, literature survey and design science methodologies are used. The first part of this thesis is a literature survey of React topics related to the research question. Although state management is the core concept in React and the software development world, there is almost no research on it. The main resources in this thesis are books and web articles. The second part of this thesis is the implementation of the “Crypto Stats” React application, with the focus on presenting the best practices for state management. React Hooks, useState and useReducer, are the best option for managing the local state. In the case of the simple state logic, useState should be used, otherwise useReducer as it ensures cleaner and more maintainable code. For global state management, some developers prefer React Context API to Redux, however, Redux is a better solution, as it provides many additional features that Context API does not have. Either way, it is important to think about the possible application states, before the development starts, as it will make the whole state management implementation process easier. In the end, which options to choose for state management is heavily dependent on the project size, type of states in the application, and the developer preferences.
Databáze: OpenAIRE