ReactJS Sovellustuotannossa: case task list
Rintala, Krista (2023)
Julkaisun pysyvä osoite on
https://urn.fi/URN:NBN:fi:amk-202305037549
https://urn.fi/URN:NBN:fi:amk-202305037549
Tiivistelmä
ReactJS on nykyään yksi suosituimmista JavaScript-kirjastoista, jota käytetään laajalti verkkosovellusten kehittämisessä. Tämän opinnäytetyön tavoitteena on tutkia ReactJS-kirjaston keskeisiä ominaisuuksia ja sen käyttöä. Teoksessa selvitetään Reactin peruskonsepteja, kuten komponenttipohjaista lähestymistapaa ja niiden toimintaa, virtuaalista DOM-mallia, JSX-syntaksia ja tilan hallintaa. Opinnäytetyössä esitellään myös Reactin käyttöönottoa ja käytännönosan kautta komponenttien toimintaa ja niiden välisiä suhteita.
Käytännön osassa luodaan yksinkertainen tehtävälista-sovellus, jossa käytetään funktiokomponentteja ja tilan hallintaan React Hookseja. Tehtävälista-sovelluksessa voidaan lisätä, muokata, poistaa ja merkitä tehtäviä suoritetuksi.
Opinnäytetyön lopputuloksena syntyi tietopaketti Reactin keskeisistä ominaisuuksista ja sen käytöstä sovelluksen toteutuksessa. Lisäksi tuloksena oli tehtävälistasovelluksen demo-versio, jossa hyödynnettiin ReactJS-kirjastoa käytännön sovelluksessa. ReactJS is one of the most popular JavaScript-libraries, which is used broadly in app development. The goal of this thesis was to explore the main features of ReactJS and how to use it. The thesis investigated the main concepts of ReactJS like component-based approach, virtual DOM model, JSX-syntax, and state management. The thesis also presents the introduction of ReactJS, and how components work and as well their relations through the practical section of the thesis.
In the practical section of the bachelor’s thesis a simple task list-application was created, in which functional components were used and for the state management React Hooks were used. In the task list application, it is possible to add, edit or delete tasks and as well mark them as completed.
The end result of this thesis delivered an information package of the main features of ReactJS and its usage in application development. Another result was also the task list application demo-version which utilized ReactJS library in a practical application.
Käytännön osassa luodaan yksinkertainen tehtävälista-sovellus, jossa käytetään funktiokomponentteja ja tilan hallintaan React Hookseja. Tehtävälista-sovelluksessa voidaan lisätä, muokata, poistaa ja merkitä tehtäviä suoritetuksi.
Opinnäytetyön lopputuloksena syntyi tietopaketti Reactin keskeisistä ominaisuuksista ja sen käytöstä sovelluksen toteutuksessa. Lisäksi tuloksena oli tehtävälistasovelluksen demo-versio, jossa hyödynnettiin ReactJS-kirjastoa käytännön sovelluksessa.
In the practical section of the bachelor’s thesis a simple task list-application was created, in which functional components were used and for the state management React Hooks were used. In the task list application, it is possible to add, edit or delete tasks and as well mark them as completed.
The end result of this thesis delivered an information package of the main features of ReactJS and its usage in application development. Another result was also the task list application demo-version which utilized ReactJS library in a practical application.