Bachelor's Thesis

Web application for scheduling consultation appointments

Final Thesis 4.59 MB

Author of thesis: Petra Šimonová

Acad. year: 2025/2026

Supervisor: prof. Ing. Adam Herout, Ph.D.

Reviewer: Ing. Pavol Dubovec

Abstract:

This bachelor thesis deals with the design and implementation of a web frontend for a consultation hours booking system intended for use at the Faculty of Information Technology, Brno University of Technology. The goal of the work was to create an intuitive, responsive user interface that allows students to browse available consultation slots and make reservations, while providing teachers with a comprehensive administration interface for managing their office hours. The resulting application supports role-based access control, dark mode, mobile-responsive layout, JWT-based authentication, email notifications, Google Calendar integration, and a visibility feature allowing students to hide their identity when booking a slot. The application is deployed and available for use at the Faculty of Information Technology.

Keywords:

TypeScript, frontend, web application, booking system, consultation hours, REST API, JWT, responsive design

Date of defence

19.06.2026

Result of the defence

Defended (thesis was successfully defended)

znamkaDznamka

Grading

D

Process of defence

Studentka nejprve prezentovala výsledky, kterých dosáhla v rámci své práce. Komise se poté seznámila s hodnocením vedoucího a posudkem oponenta práce. Studentka následně odpověděla na otázky oponenta a na další otázky přítomných. Komise se na základě posudku oponenta, hodnocení vedoucího, přednesené prezentace a odpovědí studentky na položené otázky rozhodla práci hodnotit stupněm D.

Topics for thesis defence

  1. Používateľské testovanie bolo realizované na obmedzenom počte respondentov. Akým spôsobom by ste navrhli rozsiahlejšie overenie použiteľnosti aplikácie a aké metriky by ste pri tom sledovali?
  2. Vzhľadom na to, že aplikácia zobrazuje dynamické kalendárové dáta a moduly (napr. DayCard.vue), akým spôsobom optimalizujete renderovanie komponentov vo Vue.js, aby nedochádzalo k zbytočnému prekresľovaniu (re-renderingu) celého stromu komponentov pri zmene stavu iba jedného dňa?
  3. V kapitole 4.5.3 popisujete spracovanie odpovedí z API pomocou bloku try-catch. Akým spôsobom zabezpečujete reaktivitu používateľského rozhrania (UI) vo Vue.js v prípade, že API požiadavka zlyhá alebo prebieha príliš dlho? Ako zabraňujete nekonzistentnému stavu aplikácie na strane klienta?

Language of thesis

English

Faculty

Fakulta informačních technologií

Department

Department of Computer Graphics and Multimedia

Study programme

Information Technology (BIT)

Composition of Committee

prof. Dr. Ing. Jan Černocký (předseda)
doc. Ing. Vojtěch Mrázek, Ph.D. (místopředseda)
Ing. Aleš Smrčka, Ph.D. (člen)
Ing. Matěj Grégr, Ph.D. (člen)
Ing. Tomáš Milet, Ph.D. (člen)

Supervisor’s report
prof. Ing. Adam Herout, Ph.D.

Řešitelka pracovala s nižší intenzitou. Vytvořená textová zpráva nebyla téměř konzultována. Navržené a implementované uživatelské rozhraní bylo pouze omezeně testováno a má daleko k dokonalosti.

Evaluation criteria Verbal classification
Informace k zadání

Cílem práce bylo vytvořit webové UI pro zapisování termínů konzultací, které bude využívat API (backend) vytvořený jiným studentem. Řešitelka vytvořila funkční UI, ale množství iterací testování a vylepšování bylo omezené a vytvořené řešení tak má daleko k dokonalosti.
Práce s literaturou

Řešitelka využila spíše pomůcky při řešení konkrétních implementačních záležitostí, než že by aktivně hledala hlubší literaturu.
Aktivita během řešení, konzultace, komunikace

Řešitelka pracovala po oba semestry, ale intenzita práce byla poměrně nízká. I na konzultace docházela až po urgencích. Vyšší intenzita práce a zeména včasnější vytvoření testovatelného prototypu by umožnily dosažení dokonalejšího řešení.
Aktivita při dokončování

Řešitelka začala s psaním technické zprávy spíše později a její znění téměř nekonzultovala.
Publikační činnost, ocenění

Systém je připravený pro produkční nasazení, ale nebylo mnoho příležitostí ho iterativně testovat a vylepšovat.
Points proposed by supervisor: 68

Grade proposed by supervisor: D

Reviewer’s report
Ing. Pavol Dubovec

Bakalárska práca rieši reálny problém a oceňujem jej praktické zameranie. Jej kvalitu však znižujú formálne nedostatky, obmedzený rozsah používateľského testovania a najmä neúplnosť odovzdaného zdrojového kódu. Súčasťou odovzdania chýbajú viaceré komponenty a pohľady popisované v technickej správe, v dôsledku čoho nie je možné overiť deklarovanú implementáciu ani projekt úspešne zostaviť podľa priloženého návodu README. Napriek uvedeným výhradám predstavuje práca použiteľné riešenie reálneho problému, pričom identifikované nedostatky bránia jej vyššiemu hodnoteniu.

Evaluation criteria Verbal classification Points
Náročnost zadání

Evaluation level: průměrně obtížné zadání

Zadanie považujem za priemerne náročné. Autorka musela zvládnuť kompletný cyklus vývoja frontendu od analýzy vo Figme až po integráciu s externým REST API. Náročnosť zvyšovala potreba koordinácie s autorom backendu, hoci po algoritmickej stránke nejde o komplexný problém.
Prezentační úroveň technické zprávy

Práca má logickú štruktúru a vhodne využíva obrazové prílohy z Figmy. Negatívne však hodnotím kapitolu o technológiách, ktorá je zbytočne podrobná a obsahuje informácie len s nepriamou súvislosťou k riešeniu. Naopak, časť o vyhodnotení spätnej väzby je krátka. 

 80
Formální úprava technické zprávy

Práca trpí slabou finálnou kontrolou. Typografické chyby ako pretečené riadky, chýbajúce medzery a neodstránené chyby sadzby (overfull hbox) výrazne znižujú estetickú úroveň. Štýl písania je miestami príliš neformálny, pripomínajúci skôr vývojársky denník než akademický text. 

 65
Realizační výstup

Mám vážnu výhradu k odovzdanému výstupu. Priložený zdrojový kód obsahuje iba základnú kostru projektu a neobsahuje prevažnú časť implementácie opísanej v správe. Nie je preto možné overiť kvalitu architektúry ani reálnu úroveň implementácie jednotlivých funkcií.

Hodnotenie v tejto kategórii sa preto opiera predovšetkým o funkčnosť nasadenej verzie aplikácie na fakultnom serveri. Bez prístupu ku kompletnému zdrojovému kódu však nie je možné spoľahlivo posúdiť kvalitu architektúry a implementácie jednotlivých častí systému.

 60
Využitelnost výsledků

Práca má implementačný charakter. Za významný prínos považujem skutočnosť, že aplikácia je navrhnutá ako náhrada za nevyhovujúce riešenie na báze wiki a bola nasadená na fakultnom serveri.
Rozsah splnění požadavků zadání

Evaluation level: zadání splněno s drobnými výhradami

Ciele zadania boli v zásade naplnené a výsledkom práce je funkčná aplikácia s praktickým využitím. Slabším miestom je metodika používateľského testovania, kde chýba hlbšia analýza respondentov a systematické vyhodnotenie spätnej väzby.
Rozsah technické zprávy

Evaluation level: splňuje pouze minimální požadavky

Rozsah správy (50,67 normostrán) spĺňa minimálne požiadavky. Niektoré kľúčové kapitoly (Design, Implementation) mohli byť spracované viac do hĺbky na úkor všeobecných dát. 
Práce s literaturou

Študentka pracuje s relevantnými zdrojmi, no väčšinu tvoria technické manuály a webové stránky. V kapitolách o UX sa argumentácia opiera skôr o subjektívne pozorovania existujúcich aplikácií než o systematické využitie odbornej literatúry uvedenej v zadaní. 

 80
Topics for thesis defence:
  1. V kapitole 4.5.3 popisujete spracovanie odpovedí z API pomocou bloku try-catch. Akým spôsobom zabezpečujete reaktivitu používateľského rozhrania (UI) vo Vue.js v prípade, že API požiadavka zlyhá alebo prebieha príliš dlho? Ako zabraňujete nekonzistentnému stavu aplikácie na strane klienta?
  2. Používateľské testovanie bolo realizované na obmedzenom počte respondentov. Akým spôsobom by ste navrhli rozsiahlejšie overenie použiteľnosti aplikácie a aké metriky by ste pri tom sledovali?
  3. Vzhľadom na to, že aplikácia zobrazuje dynamické kalendárové dáta a moduly (napr. DayCard.vue), akým spôsobom optimalizujete renderovanie komponentov vo Vue.js, aby nedochádzalo k zbytočnému prekresľovaniu (re-renderingu) celého stromu komponentov pri zmene stavu iba jedného dňa?
Points proposed by reviewer: 65

Grade proposed by reviewer: D

Responsibility: Mgr. et Mgr. Hana Odstrčilová