Progressiivisen Web-applikaation kehittäminen kuntosaliharjoittelun seurantaan

Abstract

Tämän opinnäytetyön tavoitteena oli kehittää uusi ominaisuus progressiiviseen web-applikaatioon, jonka avulla käyttäjät voivat seurata kehitystään saliharjoituksissa. Työn tilaajana on HUR Oy, joka valmistaa voimaharjoittelulaitteita erityisesti senioriliikuntaan ja kuntoutukseen. Sovellus perustuu jo olemassa olevaan versioon. Uusi ominaisuus sisälsi neljä pääkomponenttia: historianäkymä, aikajanan valinta, treeniohjelman valinta ja datan visualisointi. Käyttäjät voivat tarkastella treenihistoriaa, valita aikarajauksia ja ohjelmia, sekä analysoida kehitystään yksityiskohtaisesti eri lihasryhmissä. Visualisointia tuetaan kuvaajilla, jotka auttavat tunnistamaan kehityskohteita.

Sovelluksen kehityksessä käytettiin TypeScript-ohjelmointikieltä ja React-kirjastoa. Palvelinpuolen ratkaisuina toimivat AWS-pilvipalvelu ja selaimen ja palvelimen välisestä tiedonsiirrosta vastasi Python Django-Framework rajapinta. Teoriaosuudessa perehdyttiin progressiivisiin applikaatioihin, käytettyihin teknologioihin, yleisesti palvelinpuolen teoriaa, ja lopuksi tarkasteltiin työn toteutusta.

Lopputulokseksi saatiin toimiva kokonaisuus. Uuteen versioon saatiin toteutettua kaikki toivotut ominaisuudet, ja testiversio on ollut asiakaskäytössä ja tähän asti palaute on ollut positiivista. Sovellusta tullaan jatkokehittämään, ja tulevaisuudessa sille suunnitellaan tämän työn jatkona uudisteltu käyttöliittymä.

The aim of this thesis was to add a new feature to a progressive web application that allows users to track their progress in strength training. The client for this project is HUR Oy, a company that manufactures strength training equipment specifically for senior fitness and rehabilitation. The application is based on an existing version. The new feature consists of four main components: the training history view, timeline selection, workout program selection, and data visualization. Users can view their training history, select time frames and programs, and analyze their progress in detail across different muscle groups. The visualization is supported by charts that help identify areas for improvement.

The application development used TypeScript programming language and the React library. For the server-side solution, AWS cloud services were used, and data transfer between the browser and the server was handled by a Python Django Framework API. The theoretical section explored progressive web applications, the technologies used, general server-side theory and the implementation of the project.

The result is a functional application. All the desired features were successfully implemented in the new version, and the test version has been in use by the client with positive feedback so far. The application will continue to be developed, and in the future, it will feature a completely redesigned user interface