Web-aplikacija za izradu ilustracija temeljenih na SVG-u

master's thesis

• Title (english): Web application for the creation of SVG illustrations
• Author: Ivan Maretić
• Mentor: Ivica Botički (mentor)
• Committee member: Ivica Botički (predsjednik povjerenstva)
• Committee member: Mirjana Domazet-Lošo (član povjerenstva)
• Committee member: Tomislav Jagušt (član povjerenstva)
• Granter: University of Zagreb; Faculty of Electrical Engineering and Computing; Zagreb
• Defense date and country: 2022-02-23, Croatia
• Scientific / art field, discipline and subdiscipline: TECHNICAL SCIENCES; Computing

Abstract

Tema ovog diplomskog rada je izrada web-aplikacije za izradu ilustracija temeljenih na SVG-u. Uvodni dio rada opisuje problem i način na koji se problem može riješiti. Zatim se u prvom poglavlju nabrajaju i opisuju najznačajnije korištene tehnologije: TypeScript, React, Yarn, Mobx, Webpack i Firebase. U drugom poglavlju dana je kratka povijest SVG tehnologije te su objašnjeni glavni SVG elementi. Treće poglavlje sadrži pregled arhitekture klijentskog i poslužiteljskog dijela aplikacije, dok je u četvrtom poglavlju dan detaljan pregled klijentskog paketa svg-screen-drawer koji obavlja iscrtavanje na zaslonu i omogućuje interakciju s iscrtanim elementima. Posljednje poglavlje opisuje rad aplikacije iz perspektive korisnika.

Abstract (english)

The topic of this thesis is the creation of a web application for the creation of SVG illustrations. The introductory chapter describes the problem and the way it can be solved. The first chapter contains the most important technologies used: TypeScript, React, Yarn, Mobx, Webpack, and Firebase. The second chapter contains a brief history of SVG technology and an explanation of the most common SVG elements. The third chapter explains the overall architecture of both frontend and backend parts of the application. The fourth chapter explains svg-screen-drawer, the package responsible for drawing all the elements on the screen and providing interactive controls. The last chapter explains how the application works from the user's perspective.

• Keywords: web-aplikacija; react; svg
• Keywords (english): web application; react; svg
• Language: croatian
• URN:NBN: urn:nbn:hr:168:825232
• Study programme: Title: Computing; Study programme type: university; Study level: graduate; Academic / professional title: magistar/magistra inženjer/inženjerka računarstva (magistar/magistra inženjer/inženjerka računarstva)
• Type of resource: Text
• File origin: Born digital
• Access conditions: Closed access
• Created on: 2023-01-13 15:29:39