1.O aplicație web este un program care se bazează pe standardele și tehnologiile open-source World Wide Web (W3C) și care are la bază arhitectura client-server. Scopul general al unei aplicații web este de a oferi diverse resurse și servicii prin intermediul unui browser web. Deoarece Feedback in real-time este o aplicație web, aceasta este împărțită în două mari componente: clientul și serverul. Client poate fi reprezentat de orice browser web contemporan, iar serverul este o aplicație construită folosind Node.js și framework-ul Express. Partea client este scrisă utilizând JavaScript, HTML5 și CSS3.
Arhitectura MVC
Model-View-Controller sau MVC este un model arhitectural utilizat în mod obișnuit pentru dezvoltarea de aplicații web. Acest model împarte aplicația în trei straturi principale: model, view și controller (de unde vine și numele). Interacțiunea dintre cele trei componente este ilustrată în figura 1.
Stratul model, componenta centrală, este responsabil pentru stocarea datelor și pentru administrarea logicii și regulilor din aplicație. Acesta răspunde cererilor din stratul view și instrucțiunilor primite de la stratul controller pentru a se actualiza.
Componenta view se ocupă cu prezentarea datelor către utilizator. Orice reprezentare a informațiilor, cum ar fi  diagrame sau tabele, face parte din acest strat.
Stratul controller este legătura dintre view și model și are rolul de a răspunde la intrările date de utilizator. Acesta interpretează informațiile primite și le convertește în comenzi pentru model sau view.













Figura 1. Arhitectura MVC


Node.js
Node.js este un mediu de rulare JavaScript, open-source, folosit pentru a dezvolta aplicații server scalabile. Prin Node.js pot fi create aplicații server scrise în JavaScript în același mod în care pot fi create aplicații server scrise în alte limbaje de programare precum PHP, Ruby sau Python.
Acesta mediu de rulare JavaScript folosește un model de I/O (Input/Output)  neblocant, bazat pe evenimente. Lucrul acesta duce la îmbunătățirea performanței (crește capacitatea de procesare) și a scalabilității aplicațiilor. Utilizarea modelului I/O neblocant elimină nevoia de multi-threading deoarece serverul poate gestiona mai multe cereri în același timp. Prin urmare, aplicațiile Node.js rulează pe un singur fir de execuție. Câteva exemple de operații I/O sunt: efectuarea de cereri HTTP și comunicarea cu bazele de date.
Node.js dispune de npm (Node package manager), cel mai mare ecosistem de biblioteci open-source din lume. Aceste biblioteci, dezvoltate de către comunitate, ajută la rezolvarea celor mai des întâlnite probleme în crearea unei aplicații server.
Express, cel mai popular framework Node.js, este un framework minimal și flexibil, care oferă un set robust de funcții pentru aplicații web și mobile. Express stă la baza multor framework-uri populare cum ar fi Sails.js, Feathers.js sau Locomotive.js.
Fiind o aplicație real-time, Feedback in real time beneficiază de modelul bazat pe evenimente și de natura neblocantă, asincronă, cu un singur fir de execuție a Node.js-ului.

WebSocket-uri
WebSocket este un protocol de comunicare între client și server introdus în HTML5. Spre deosebire de HTTP (HyperText Transfer Protocol), unde cererile sunt tot timpul inițiate de către client, iar serverul doar procesează și trimite un răspuns, în protocolul WebSocket, comunicare este bidirecțională (atât clientul cât și serverul pot trimite informații). Transferul datelor se realizează în regim full-duplex (clientul și serverul pot trimite datele în același timp, independent unul de altul) pe parcursul unei singure conexiuni TCP, folosind un singur socket.
Prin intermediul WebSocket API (Application Programming Interface) se pot trimitere date către un server și primi răspunsuri bazate pe evenimente, eliminând astfel nevoia de a verifica starea serverului de fiecare dată când se dorește comunicarea cu acesta.
Deoarece orice conexiune WebSocket începe ca și o conexiune HTTP, compatibilitatea cu tehnologiile pre-WebSocket este foarte mare. Făcând parte din HTML5, WebSocket-urile funcționează cu cele mai noi browsere web.
WebSocket-urile pot fi utilizate ori de câte ori este nevoie de o conexiune cu o latență redusă (aproape inexistentă) între client și server. Câteva exemple de posibile utilizări sunt: aplicații de chat, actualizarea în timp real a fluxurilor de date din rețele de socializare, aplicații bazate pe locație și altele.
O bibliotecă foarte populară care folosește WebSocket-uri atât pe partea de server, cât și pe partea de client este Socket.IO. Partea client constă într-o bibliotecă JavaScript pentru browser, iar partea server constă într-un server Node.js.
Această bibliotecă poate fi privită ca un wrapper API peste WebSocket API ce permite comunicarea bidirecțională, în timp real și bazată pe evenimente. Biblioteca include funcții suplimentare dincolo de WebSocket-urile clasice cum ar fi reconectarea automată, difuzarea mai multor socket-uri sau crearea de namespace-uri. Cu toate acestea Socket.IO nu este o implementare WebSocket. Atunci când este posibil sunt folosite WebSocket-uri ca modalitate de transfer a datelor, dar atunci când nu este posibil se recurge la alte modalități de transfer cum ar fi AJAX long-polling sau JSONP polling.

HTML5 și CSS3
HTML (HyperText Markup Language) este un limbaj pentru crearea, formatarea și aranjarea unui document (o pagină web) pentru a putea fi vizualizat într-un browser web. Documentele HTML conțin un arbore de elemente și text. Fiecare element are o etichetă de start, cum ar fi <html>, și o etichetă de sfârșit, cum ar fi </html>.
HTML5 este a cincea revizuire a standardului HTML ce a fost dezvoltat pentru a aborda diversele probleme ale versiunilor anterioare și pentru a oferi o experiență cât mai plăcută și mai consistentă atât pentru utilizatori, cât și pentru dezvoltatori. Printre îmbunătățirile aduse cu această revizuie se numără suportul pentru fișierele video și audio, adăugarea de etichete noi cum ar fi nav, section sau canvas și tratarea persistentă a erorilor.
CSS (Cascading Style Sheets) este un standard ce definește modul în care o pagină web este afișată în browser sau modul în care este prezentat un document în XML (Extensible Markup Language). Folosind CSS se realizează separarea conținutului de prezentare (aspectul, culorile, fonturile documentului). Această separare oferă flexibilitate și control asupra prezentării și îmbunătățește accesibilitatea  conținutului.
Prin intermediul CSS este redusă complexitatea și repetiția conținutului structural deoarece mai multe pagini web pot sa împartă aceeași formatare prin specificarea CSS relevantă într-un fișier .css separat.
CSS3 este cea mai nouă versiune CSS ce aduce o multitudine de îmbunătățiri printre care se numără tranziții, animații și layout-uri noi (flex, grid). Spre deosebire de CSS, cu CSS3 pot fi create pagini web responsive.
Bootstrap este un framework CSS open-source ce se concentrează pe dezvoltarea de pagini web responsive. Acesta conține șabloane HTML și CSS pentru diverse componente de interfață cum ar fi formulare sau butoane, precum și extensii JavaScript opționale.

Baze de date NoSQL
	Odată cu creșterea popularității internetului au fost făcute vizibile și slăbiciunile bazelor de date SQL. Acestea nu au putut ține pasul cu varietatea tipurilor de date care au apărut și nici cu fluxul de informații solicitat de utilizatori. Bazele de date NoSQL au apărut ca un răspuns pentru aceste probleme și diferă de bazele de date SQL prin faptul că sunt non-relaționale, distribuite, open-source, cu un API simplu, fără o schemă de stocare și orizontal scalabile. Entitățile stocate în aceste baze de date sunt cunoscute sub termenul de documente și sunt grupate în colecții.
	MongoDB este una dintre cele mai utilizate baze de date NoSQL și este, de asemenea, principalul mediu de stocare al datelor pentru aplicația Feedback in real-time. Aceasta este o bază de date orientată pe documente, datele fiind stocate în documente flexibile, asemănătoare cu JSON. Câmpurile pot varia de la un document la altul, iar structura de date poate fi modificată ori de câte ori este nevoie. Datorită popularității sale, MongoDB dispune de un număr mare de ODM-uri (Object Data Modeling) pentru a ușura modelarea informațiilor. În cadrul acestei aplicații a fost folosit ODM-ul Mongoose.
	Redis este o bază de date NoSQL, open-source, ce poate fi folosită pentru a stoca structuri de date (sub formă de perechi cheie valoare) în memorie. Aceasta suportă diverse structuri de date, cum ar fi șiruri de caractere, liste sau seturi. Deoarece toate datele sunt stocate în memorie, interogările unei baze de date Redis vor întoarce un răspuns foarte repede.
Aplicația Feedback in real-time folosește baze de date NoSQL deoarece sunt ușor de utilizat, iar modelarea datelor nu presupune crearea de relații între entități. Totodată, datele pot fi salvate sub formă de JSON, format suportat de principalul limbaj de programare folosit (JavaScript), ceea ce elimină nevoia de a transforma datele într-un format înțeles atât de client, cât și de server.














Interacțiunea cu profesorul
Odată conectat la aplicație, profesorul este redirecționat către pagina principală a profesorului din aplicației. În cadrul acestei pagini, utilizatorul profesor poate să efectueze următoarele acțiuni:
poate să vadă feedback-ul primit de la studenți sub formă de procentaj (cât la sută din studenții prezenți au înțeles și cât la la sută nu au înțeles o anumită explicație sau o demonstrație). Odată ce profesorul efectuează acțiunile ce le consideră necesare (repetă explicația sau trece mai departe), acesta poate reseta feedback-ul primit prin apăsarea unui buton.





Figura x. Bara cu feedback-ul primit de la studenți

poate să vadă întrebările adresate de către studenți în forma unui tabel. Profesorul poate să aleagă un număr minim de voturi pe care o întrebare trebuie să îl aibă pentru a apărea în tabel, acest lucru ducând la o mai bună gestionare a informațiilor primite. Întrebările sunt afișate câte cinci pe pagină și pot fi sortate/căutate după: data (ora) la care au fost adresate, întrebarea în sine, autor sau număr de voturi. Odată ce profesorul consideră că o întrebare nu mai este necesară, acesta poate să o șteargă din aplicație.
Imagine cu tabelul cu întrebări
poate să vizualizeze, să șteargă și să adauge întrebări FAQ (frequently asked questions) cu răspunsurile aferente. Aceste întrebări apar atât pe pagina profesorului, cât și pe pagina studentului.
Imagine cu tabelul cu FAQs
	O altă pagină la care utilizatorul profesor poate naviga, prin intermediul meniului, este pagina “Teste”. Prin intermediul acestei pagini, utilizatorul are acces la următoarele funcționalități:
poate să vizualizeze toate testele create de acesta sub forma unui tabel, poate să șteargă orice test și are dreptul să trimită teste studenților conectați la sesiunea respectivă.
poate să creeze teste în două modalități: prin încărcarea directă a unui test (în format CSV) de pe dispozitivul folosit sau prin crearea directă în cadrul aplicației (utilizatorul apasă pe un buton și este redirecționat către o pagină de unde poate adăuga un test noi completând câmpurile necesare).
				poza pagina quizzes
Ultima pagină disponibilă profesorului este pagina “Statistici” prin intermediul căreia sunt expuse statistici sub forma de grafice referitoare la răspunsurile studenților la teste. Tot în cadrul acestei pagini, profesorul poate să facă comparații între răspunsurile studenților din grupe/cursuri diferite pentru a vedea care grup s-a descurcat mai bine.
				poza pagina statistici

Interacțiunea cu studentul
	După ce un student s-a autentificat cu succes, acesta este redirecționat pe pagina principală a studenților. Prin intermediul acestei pagini, studentul poate să efectueze următoarele acțiuni:
poate să ofere feedback profesorului într-un mod foarte simplu apăsând unul dintre cele două butoane ce se află în partea de sus a paginii (Am înțeles/Nu am înțeles). Un student poate oferi feedback doar o singură dată, fiind nevoit să aștepte ca profesorul să reseteze datele primite pentru a mai vota din nou.


Figura x. Butoane pentru feedback

asemănător cu pagina principală a profesorului, întrebările adresate de către studenți sunt afișate întru-un tabel. Acestea sunt afișate câte cinci pe pagină și pot fi sortate/căutate după: data (ora) la care au fost adresate, întrebarea în sine, autor și număr de voturi. De asemenea, studentul poate să voteze o întrebare pusă de alți studenți dacă este de acord cu întrebarea, sau poate să ofere un vot negativ dacă consideră că întrebarea nu este în conformitate cu materia predată de către profesor.
poate să adreseze întrebări profesorului prin apăsarea unui buton ce îl va redirecționa pe o pagină separată de unde poate să scrie întrebarea și să o posteze. Toate întrebările sunt afișate prima dată pe pagina studenților pentru a putea fi votate.
poate să vadă întrebările de tip FAQ și răspunsul acestora.

	În momentul în care profesorul dă un test studenților, aceștia vor fi redirecționați pe o pagină separată ce conține întrebarea, timpul de răspuns și răspunsurile din care trebuie să aleagă.











Figura x. Exemplu de întrebare adresată studenților

După ce timpul a expirat, toți studenți sunt redirecționați către o pagină nouă unde pot vedea diverse statistici cu privire la întrebarea la care tocmai au răspuns cum ar fi: numărul de studenți activi la momentul testului, numărul de studenți care au răspuns, răspunsul corect la întrebare și procentajul răspunsurilor în funcție de variante.
  pagină statistici quizz