Managing State in React Applications with Redux

Abstract

Nykyaikaiset verkkosovellukset ovat entistä monimutkaisempia, ja niiden taustalla toimiva tiedon hallinnallinen logiikka vaikuttaa merkittävästi sovelluksen menestymiseen. Tämän opinnäytetyön tutkittiin, miten voidaan suunnitella ja kehittää tilanhallinnan arkkitehtuuri Redux-kirjastolla. Tarkoituksena oli tutustua tilanhallintaan React-sovelluksissa ja toteuttaa jo kehityksessä olevalle projektille uusi tilanhallinnan arkkitehtuuri.

Opinnäytetyön toimeksiantaja oli ohjelmistoyritys Visma Consulting Oy, joka on erikoistunut sähköisten palveluiden ja räätälöityjen ohjelmistoratkaisujen tuottamiseen. Opinnäytetyön tarkoitus oli tuottaa Visma Consulting Oy:lle tietoa kehitysprosessista ja suunnitella sekä toteuttaa React-sovellukselle tilanhallinnan arkkitehtuuri käyttämällä Redux-kirjastoa.

Opinnäytetyön tuloksena suunniteltiin ja toteutettiin uusi tilanhallinnan arkkitehtuuri. Toteutetun tilanhallinnan arkkitehtuurin lisäksi opinnäytetyössä kerättiin tietoa myös muista menetelmistä React-sovelluksien tilan- ja komponenttien elinkaarien hallintaan. Näistä menetelmistä merkittävimpänä esille nousi React-kirjaston uusi ominaisuus React Hooks, joka julkaistiin helmikuussa 2019.

The objective of this thesis was to gather information on the design and development of a state management architecture using Redux. The purpose was to get a better understanding of managing state inside a React application, and to implement a new state management architecture for an existing project.

As a result of the thesis, a new state management architecture was designed and implemented. In addition to implementing the new architecture, information was gathered on different methods for handling state and component life cycle in React applications. The most prominent of these methods was React Hooks, a new feature of React that was released in February 2019.

This Bachelor’s thesis was commissioned by Visma Consulting Oy, a software company specialized in digital services, service design and custom software solutions. The results of this thesis study consist of a state management architecture designed and implemented for Visma Consulting Oy, and this study report.