Application and comparative analysis of frameworks for one-page web application development

U ovome radu su izrađene dvije identične inačice jednostranične web aplikacije za naručivanje jela iz restorana. Prva jednostranična web aplikacija je izrađena koristeći Vue.js, a druga koristeći React. Izrađene jednostranične web aplikacije omogućuju korisniku naručivanje jela iz restorana, a administratoru uređivanje tih jela. Korisnik ima mogućnost filtriranja jela po rasponu kalorija, sastojcima koje jelo mora sadržavati, sastojcima koje jelo ne smije sadržavati i po dijetama kojima jelo mora odgovarati. Također, korisnik ima mogućnost dodavanja jela u košaricu te naručivanje odabranih jela. Za obje inačice izrađenih jednostraničnih web aplikacija je prikazan i objašnjen programski kod za izradu komponenti, izradu usmjerivača, korištenje globalnog stanja i implementaciju autentikacije korisnika. Mjerenje performansi izrađenih jednostraničnih web aplikacija izvodilo se koristeći Chrome alat. Dobiveni rezultati mjerenja, kao i mjerenja iz literature analizirana su s ciljem usporedbe i analize korištenih razvojnih okruženja.In this paper, two identical versions of single-page applications for ordering meals from a restaurant were made. The first single-page application was built using Vue.js, and the second using React. The created single-page applications allow a user to order meals from a restaurant and the administrator to edit those meals. The user has the option of filtering the meals by calorie range, ingredients that the meal must contain, ingredients that the meal must not contain, and diets that the meal must correspond to. Also, the user has the option of adding meals to the cart and ordering the selected meals. For the object version of the created single-page applications, the program code for creating components, creating a router, using global state and implementing authentication is shown and explained. The performance measurements of the created single-page applications were performed using the Chrome performance tool. The obtained results of the measurement, as well as the measurement from the literature, were analyzed in order to compare and analyze the used frameworks