MyACS – Portal web dedicat Facultatii de Automatica si Calculatoare Coordonator Absolvent Sl.dr.ing Adriana Olteanu Vlad – Alexandru Nicolae 1… [624084]

Universitatea POLITEHNICA Bucure ști
Facultatea Automatică și Calculatoare
Departamentul Automatică și Informatică Industrială

LUCRARE DE LICENȚĂ

MyACS – Portal web dedicat Facultatii de
Automatica si Calculatoare

Coordonator Absolvent: [anonimizat].dr.ing Adriana Olteanu Vlad – Alexandru Nicolae

1
Cuprins
1. Introducere ………………………….. ………………………….. ………………………….. ………………… 2
Prezentrea Capitolelor ………………………….. ………………………….. ………………………….. ……. 2
Prezentarea domeniului din care face parte lucrarea ………………………….. ……………………. 3
Motivarea alegerii temei ………………………….. ………………………….. ………………………….. …. 6
Functionalitatile aplicatiei ………………………….. ………………………….. ………………………….. . 6
Aplicatii existente in domeniu ………………………….. ………………………….. ……………………… 5
2. Tehnologii software ………………………….. ………………………….. ………………………….. …… 7
…cateva cuvinte despre web in general …. ………………………….. ………………………….. ……… 7
World Wide Web ………………………….. ………………………….. ………………………….. …………. 7
Servere Web ………………………….. ………………………….. ………………………….. ………………… 7
HTML ………………………….. ………………………….. ………………………….. …………………………. 7
CSS ………………………….. ………………………….. ………………………….. ………………………….. …. 8
JavaScript ………………………….. ………………………….. ………………………….. ……………………. 8
Bootstrap ………………………….. ………………………….. ………………………….. …………………….. 9
Ajax ………………………….. ………………………….. ………………………….. ………………………….. … 9
NodeJS ………………………….. ………………………….. ………………………….. ………………………… 9
Express ………………………….. ………………………….. ………………………….. ………………………. 10
Baze de date ………………………….. ………………………….. ………………………….. ……………….. 11
MongoDB ………………………….. ………………………….. ………………………….. …………………… 12
3. Aplicatie..Utilizat or ………………………….. ………………………….. ………………………….. …. 14
4. Implementarea aplicatiei ………………………….. ………………………….. ……………………… 15
6. Bibliografie ………………………….. ………………………….. ………………………….. ……………… 26
https://en.wikipedia.org/wiki/Integ rated_development_environment ……………………. 26
https://www.jetbrains.com/webstorm/ ………………………….. ………………………….. …………. 26

2 1. Introducere

Ceva despre nevoia de informare a oamenilor…
Prezentrea Capitolelor

Prezena lucrare contine aspecte teoretice si aspecte tehnice, prezentate detaliat,
despre modali tatea de cocepere si implementare a portalului web.
Lucrarea este structurata in 6 capitole, fiecare capitol fiind alcatuit la randul lui din
mai multe subcapitole .
Capitlolul 1 – Introducere: reprezinta partea introductiva a lucrarii, prezentand
domeniul din care face parte lucrarea, a temei propriu -zise, motivul alegerii acesteia , o
prezentare succinta a functionalitatilor implementate si o comparatie cu functionalitatile
oferite de aplicatii asemanatoare.
Capitolul 2 – Tehnologii software: reprezinta o scurta descriere a tehnologiilor
utilizate pentru realizarea acestei aplicatii. Cum functioneaza Internetul, servere web,
aplicatii web, pagini stati ce, dinamice, HTML , CSS , JS, Node.Js, Express, notiuni de baza
ale baz elor de date si informatii despre MongoDb , reprezinta principalele puncte de interes
al acestui capitol.
Capitolul 3 – Utilizarea aplicatiei: va contine prezentarea generala a aplicatiei,
metoda de utilizare a interfetei cu utilizatorul, modalitatile de stocare a informa tiilor si a
datelor si ce metode de securitate au fost utilizate.
Capi tlolul 4 – Implemetarea aplicatiei: se vor gasi informatii legtae de felul in care
aplicatia a fost realizata, cum a fost impartita in sectiuni, cum comunica intre ele, bucati de
cod mai sp eciale.
Capitolul 5 – Concluzii si dezvoltari ulterioare: alaturi de o opinie personala
privitoare la aplicatia realizata, se vor gasi informatii suplimentare despre aplicatii
similare, performantele acestora si posibile imbunatatiri ce se vor putea adauga in viitor.
Capitolul 6 – Bibliografie: va contine o lista amanu ntita a documentelor utiliza te in
realizarea acestei lucri .

3 Prezentarea domeniului din care face parte lucrarea

In prezent 70% din populatia europei locuieste in mediul urban si consuma 70% din
energia produsa. In Romania desi acest procent este mai mic, doar 56.4%[1] din populatie
este urbana, conform Institutul National de Statistica. Migratia rural – urbana a fost
datorata dorintei populatiei de a gasi un loc de munca , de a avea acces la educatie, ingrijire
medicala, cultura, cu alte cuvinte de a gasi un trai mai bun. De cele mai multe ori aceasta
dorinta a fost indeplinita, insa prin cresterea semnificativa a populatiei din interiorul
oraselor au fost generate noi pro bleme. Printre acestea se pot mentiona:
– Infrastructura neadecvata: Orasele nu au fost proiectate pentru a acomoda o
populatie atat de numerosa;
– Aspectele de mediu: Consum mare de energie – 70% si generare ridicata a emisiilor
de CO2 – 75%
– Stresul urban: Co sturi din ce in ce mai mari, rata ridicata a somajului si a
criminalitatii, poluare, aglomeratie;
– Competitia economica: Preturile crescute ale produselor si a serviciilor;
Desigur, urbanizarea a avut si efecte pozitive, dintre acestea, probabil cel mai
important este: dezvoltarea incredibila a tehnologiei. Aparitia tehnologiei informationale a
adus numeroase schimbari in viata noastra de zi cu zi si a mediului inconjurator, aceste
fiind cel mai vizibile in domenii precum comunicatia, securtatea publica, ser vicii de
utilitati. In toate aceste domenii vom gasi echipamente electronice avansate, conectate la o
retea prin care vor fi transmise diferite
informatii preluate de la multiplii senzori.
Existenta acestor elemente conduce la
evolutia oraselor spre orase inteligente(
smart city in literatura de limba engleza );

Sub umbrela conceptului de oras
inteligent se vor gasi toate solutiile
tehnologice necesare pentru a diminua
problemele ce sunt intalnite in orasele
contemporane. O alta componenta a acestui conce pt este reprezentata de metodele de
implementare a acestor solutii, atat la nivel fizic: infrastrutura cat si la nivel mental:

4 instruirea populatiei si formarea unei noi mentalitata pentru atingerea scopului final de
crestere a calitatii vietii si de efici entizare a consumului de resurse.
Conceptul de oras inteligen este in realitate un concept extrem de dinamic, un
proces ce se afla intr -o stare de transformare continua prin aparitia noilor inovatii
tehnologice, urbanistice sau menegeriale. Departamentul d e inovatii de munca si aptitudini
al Marii Britanii a punctat acest spunand: „conceptul nu este static: nu exista o definie
absoluta a unui oras inteliget, nici un punct final, ci mai degraba un proces, sau o serie de
pasi prin care orasele devin mai ‚locu ibile’ si reziliene si, astfel, mai apte sa raspunda
noilor provocari.” .
O varianta des intalnita de definire a orasului inteligent este realizata prin referirea
specifica a principalelor arii de aplicarea al tehnologiilor inteligente. Astfel, el poate fi
descris ca un doras dotat cu: energie inteligenta, mobilitate inteligenta, cladiri inteligente,
tehnologie inteligenta, sistem de siguranta inteligent, infrastructura inteligenta, sistem de
sanatate inteligent, cetateni inteligenti si sistem de educatie inteligent.
Probabil dintre toate acestea, cea mai importanta componenta o reprezinta educatia.
Prin educatie vor fi formate noile mentalitati pe care populatia trebuie sa le detina, precum
si dezvoltarea fortei de munca necesara pentru implementarea tutu ror proiectelor
inteligent e. Din acest motiv, put em spune ca universitatile joaca un rol foarte important in
dezvoltarea oraselor inteligente . Se naste astfel un nou concept, cel de campus inteligent.
El va reprezenta o comunitate in interiorul altei comun itati, toate ideologiile de
eficientizare a consumului de resurse fiind imprumutate si implementate din cele ale
orasului inteligent . Marile universitati din lume promoveaza in acest moment metode de
eficientizare a procesului de gestionre al cladirilor, n oi politici de transport, utilizarea unei
varietati de senzori si echipamente de comunicare, inovarea infrastructurii urbane si
eficientizarea experientei de invatare.
In anul 2016, Universitatea Politehnica Bucuresti a semnat un acord de finantarea
pentru implementarea unui proiect de micro – retea inteligenta in tot campusul. Scopul
acestui proiect este de a reduce costurile anuale ale consumului de energie electrica si a
emisiilor de gaze cu efect de sera. Acest lucru se va datora utilizarii unor tehnolo gii noi,
cum ar fi: sisteme fotovoltaice pentru acoperisuri, sisteme de stocare a energiei,
eficientizarea ilumi natului energetic, motoare pe g az.

5 Centrul de cercetare PRECIS reprezinta un alt exemplu de evolutie la nivel de
infrastructura a Universitatii Politehnica Bucuresti, adaugand 28 de noi sali de laborator,
dotate cu echipamente moderne, Facultatii de Automatica si Calculatoare. Acestea sunt
doar cateva din realzarile UPB, ce o vor aduce cu un pas mai aproape de obtinerea
primului campus inteligent din Romania.
Pe langa dezvoltarea infrastructrii si oferirea de componente hardware moderne, un
campus inteligent contine si aplicatiile sofware ce au fost concepute cu scopul de a inova
metodele de invatare si de a facilita accesul rapid la informatiile de care studentii au
nevoie. Scopul acestora este de a imbunatati experienta facultatii pentru fiecare student.
Una dintre aplicatiile cel mai des intalnite in marile universitati din lume este
reprezentata de un portal web, de unde studen tii pot accesa informati diverse de la finante
si situatie scolara pana la cele mai bune locatii de relaxare din vecinatatea campusului. Ex:
AXESS – Universitatea Stanford, Passport – Univeristatea York, Abert – Universitatea din
New York .
Aplicatii existente in domeniu

Asa cum am mentionat si in paginile prece dente, o forma a acestui tip de portal a
fost deja implementata in majoritatea marilor universitati din lume. Desigur, acestea au fost
dezvoltate separat, astfel capacitatile acestora precum si platforma utilizata diferea. Mai jos
voi descrie functionalitatile unor astfel de portale.
AXESS ( Universitatea Stanford ) – Acest portal poate sa fie accesat de angajatii
universitatii , studenti si chiar si de parintii acesora. In interiorul por talului, un student va
gasi informatii personale, date legate de metoda de finantar e utilizata si alte modalitati de a
obtine ajutor financiar , va putea vizualiza programul cursurilor si a examenelor, se va
putea mentine informat despre cele mai n oi evenimente din campus si multe altele. Pentru
angajatii Stanford, portalul le ofera informatii despre programul acest ora, salariu, fluturasul
de plata, si alte informatii con fidentia le.
CAL State LA( Universitate de Stat din California ) – Portalul ofera acces atat
studentilor cat si profesorilor la informatii despre cursurile ce se desfasoara in interiorul
facultatii, precu m si date despre cele mai recente activitati sportive ce se desfasoara atat in
cadrul facultatiii cat si in apropierea acesteia .

6 NC State App – Universitatea de stat din Carolina de Nord se bazeaza in intregime
pe o aplicatie mo bile ce le ofera posibilitatea studentilor de a accesa ema ilul facultatii, sa
isi vizualizeze orarul si sa isi formeze un program zilnic presonalizat. Pentru a se asigura
ca informatii referitoare la evenimentele ce se desfasoar a in universitate sunt accesibile
tuturor, cei de la NC State au implementat o retea de socializare proprie. Aceasta le va
permite studentilor sa incarce fotografii .
Platforma Moodle ( Facultatea de Automatica si Calculatoare ) – (?)

Tema proiectu lui
MyACS reprezinta o platforma web ce a fost conceputa pentru a imbunatatii gama
de servicii oferite de alte platforme dezvoltate pentru facultatea de Automatica si
Calculatoare

Functionalitatile aplicatiei

A

Motiva rea alegerii temei

Primcipalul motiv c

7 2. Tehnologii software

…cateva cuvinte despre web in general ….

World Wide Web
Servere Web
HTML
HTML ( HyperText Markup Language ) este un limbaj de calculator conce put
pentru a permite formarea de site -uri web. Acesta este un limbaj foarte acc esibil, usor de
inteles si foarte puternic pentru ceea ce este capabil sa realizeze. Sub influenta organizatiei
W3C, organizatie ce are scopul de a proiecta si intretine limbajul, HTML evolueaza pentru
a putea respecta cerintele ce se gasesc intr -o permane nta stare de crestere a audientei
internetului.
Analizand fiecare termen ce intra in componenta denumirii, putem extrage
urmatoarele informatii:
 HyperText: metoda pe care o utilizam pentru a accesa diferite portiuni ale
internetului – apasand pe un text special numit hyperlink putem accesa orice locatie
de pe internet, fara a fi nevoiti sa respectam o anumita ordine de a realiza un lucru;
 Markup: reprezinta ceea ce se va intampla cu textul ce se gaseste in interiorul unor
taguri html;
 Language: contine cu vinte cod si sintaxe ca orice alt limbaj;
HTML este format dintr -o serie de bucati mici de cod ce sunt scrise in inteiorul
unui document text, acestea mai sunt cunoscute si sub numele de taguri HTML . Ulterior,
salvand textul sub formatul unui fisier HTML , vom putea vizualiza continutul sau utilizand
un browser web. Browser -ul va citi fisierul si va traduce textul intr -un forma vizibila, asa
cum a intentionat autorul.
Tagurile reprezinta ceea ce separa un text normal de cod HTML. Acestea sunt
indentificat e foarte usor, fiind formate din litere sau cuvinte ce se vor gasi in interiorul
unor paranteze unghiulare ‚<…>’.

8 CSS
CSS ( Cascading Style Sheet ) reprezinta un limbaj al carui scop este de a simplifca
procesul de a face un site web prezentabil.
Utiliz and CSS, un programator poate sa controleze felul in care o pagina web va
arata, acesta avand posibilitatea sa aleaga ce culoare va avea un anumit text, ce font va fi
utilizat, ce spatiere se va folosi intre diferite elemente, ce modificari vor aparea in f unctie
de dispozitivul pe care il utilizam pentru a accesa o anumita pagina web si multe altele.
CSS ofera control asupra felului in care un document HTML va fi prezentat
autorului sau publicului.
Utilizarea acestui limbaj ofera o serie de avantaje, pri ntre acestea putand fi
enuntate:
 Paginile se vor incarca mai rapid: Daca vom utiliza CSS atunci nu va mai trebui sa
scriem atribute separate pentru fiecare tag html;
 Salvam timp: Un fisier CSS poate fi scris o singura data si reutilizat in diferite
pagini html;
 Un numar mai mare de stiluri decat HTML: CSS utilizeza o gama mai larga de
atribute decat cele ce sunt gasite in limbajul HTML , oferind astfel posibilitatea de a
oferi o prezentare mai buna unei pagini web;
 Compatibilitatea unui site web cu diferite dispozitive: Prin utilizaea limbajului
CSS, continutul unui fisier html va putea fi optimizat in asa fel incat acesta sa arate
la fel de bine indiferent de platforma pe care o utilizam pentru a accesa acea
informatie;

JavaScript
JavaScript este un limbaj dinamic de programare ce impreuna cu HTML si CSS
reprzinta cele trei tehnologii ce se gasesc in nucleul World Wide Web. Implementarea de
scripturi in partea clientului permit ca acestea sa interactioneze cu utilizatorul si sa formeze
pagini dinamice. Este un limbaj de programarie interpretat, cu capabilitatea de a fi orientat
spre obiecte.
Cea mai utilizata forma de JavaScript este cea din partea clientului. Un script poate
fi inclus sau mentionat intr -un document HTML, ca mai apoi acesta sa fie interpre tat de
catre browser -ul web. Acest lucru inseamna ca o pagina web nu trebuie sa fie statica, ci ca
aceasta poate contine programe ce vor interactiona cu utilizatorul, vor controla browser -ul
sau vor crea continut HTML in mod dinamic.

9 Cele mai importante a vantaje ce sunt oferite de utilizarea limbajui JavaS cript sunt:
 Mai putine interactii cu serverul: Putem valida actiunea utilizatorului inainte de
a trimite o cerere catre server. Realizand acest lucru, reducem traficul ce se
realizeaza pe server , astfel m icsorand incarcarea serverului;
 Oferirea imediata a unui raspuns pentru vizitatori: Un utilizator nu va trebui sa
astepte ca pagina web sa se reincarce pentru a vedea daca au uitat sa completeze
un anumit lucru intr -un formular;
 Cresterea interactivitati: Se pot realiza interfete ce vor interaciona in momentul
in care un utilizator realizeaza o anumita actiune;
 Interete mai bogate: In urma utilizarii limbajului javascript, apare posibilitatea
de a include elemnte noi intr -o pagina web, de exemplu putem real iza
operatiuni de drag&drop, oferind astfel o noua experienta utilizatorilor;
Bootstrap
Ajax
NodeJS
Node.js este o platforma dedicata pentru partea de server, ce a fost construita
utilizand motorul javascript dezvoltat de Google Chrome, V8. Din anul 2009, anul in care
limbajul a fost dezvoltat de Ryan Dahl, si pana in prezent, definitia oferita de documentatia
oficiala este:
„Node.js este o platforma construita pe baza motorului de rulare javascript a celor
de la Google, dezvoltata pentru realizarea rapida si scalabila a aplicatilor web. Node.js
utilizeaza un model orientat spre evenimente nonblocante de intrare si iesire ce face ca
aplicatiile sa nu consume un numar ridicat de resurse si sa fie foarte eficient in realizarea
de aplicatii ce opereaza in ti mp real si ruleaza pe diferite dispozitive.”
Node.js este un limbaj ‚open source’, mediul de dezvoltare utilizat ruland pe
diferite platforme. Aplicatiile Node.js sunt scrise in JavaScript si acestea pot rula pe
sistemul de operare X a celor de la Apple, Windows sau Linux.
Principalele caracteristici specifice limbajului Node.js sunt:
 Orientat spre evenimente si asincr on: Toate interfetele de programare ale aplicatiei,
din biblioteca node.js, sunt asincrone, deci nonblocante. In esenta acest lucru
inseama n ca un server ce utilizeaza aplicatii dezvoltate utilizand node.js nu va
astepta niciodata ca interfata de programare sa returneze date. Serverul se va ocupa
de urmatoarea interfata de programare imediat ce aceasta este apelata. Mecanismul

10 de notificari p entru evenimentele din node.js se va ajuta serverul sa primeasca un
raspuns de la apelurile anterioare ale interfetei de programare;
 Foarte rapid: Deoarece limbajul a fost contruit bazanduse pe motorul javascript V8,
dezvoltat de Google Chrome, biblioteca node.js este foarte rapida in executa
codului;
 Un singur fir de executie dar foarte scalabil: Node.js utilizeaza un model bazat pe
un singur fir de executie cu evenimente ce rulaza intr -o bucla de executie.
Mecanismul de evenimente ajuta serverul sa raspun a intr -o maniera nonblocanta si
face a serverul sa fie foarte scalabil, acest lucru fiind in opozitie cu serverele
traditionale ce formau fire de executie limitate pentru realizarea apelurilor. Node.js
utilizeaza un program cu un singur fir de executie, pr ogram ce poate sa ofere
servicii unui numar mult mai ridica de cereri decat serverele traditionale, cum ar fi
un server apache http;
 Nu exista buffering: Aplicatiile node.js nu utilizeaza un buffer pentru date, acestea
fiind afisate in blocuri;
 Licenta: No de.js a fost lansat sub o licenta MIT;
 Biblioteca bogata: Node.js dispune de un numar mare de module javascript ce
simplifica procesul de dezvoltare al aplicatilor web ce utilizeaza node.js

Express
Express.js este un framework de aplicatii web pentru Nod e.js, ce a fost lansat ca un
software gratuit, open -source, sub o licenta MIT. A fost dezvoltat pentru crearea de aplicati
web si interfete de programare ale aplicatiilor. De asemenea, express.js a fost numit
frameworkul standard al serverelor pentru Node. js.
Acesta este utilizat deoarece node.js nu a fost proiectat pentru a putea construii site –
uri web. Frameworkul express este capabil sa o ofere o serie de functii ce sunt necesare
pentru a realiza acest lucru.
Scris in javascript, express actioneaza d oar ca un start subtire ce intra in
componenta nucleului unei aplicatii web. Express nu a fost creat doar pentru anumite
tehnologii, acesta ne avand o opinie cu privire la ce tehnologii dorim sa ii atasam . Aceasta
libertate, precum si faptul ca este utili zat alaturi de viteza de dezvoltare si mediul pur
javascript a lui node, a transformat expres intr -un candidat puternic pentru dezvoltarea
rapida de aplicatii si prototipare;

11 Utilizand express, putem construii aplicatii web si mobile cu o singura pagina, cu
mai multe pagini sau hibride, functii back -end pentru aplicatiile web dar si interfete
programabile ale aplicatiilor;
Express utilizeaza doua motoare de sablonare: Jade si EJS ce faciliteaza
transmiterea de date intr -o structura web;
Express suporta o arhitectura de tip Model -Vizualizare -Control( eng: „Model –
View -Controller” sau cum este mai cunoscut, model MVC) ce rprezinta o metoda
ajutatoare de a dezvolta site -uri web intr -o maniera orientata spre obiect.

Baze de date
O baza de date este o colecti e de date structurata ce poate fi stocata in format
electronic pe un sistem de calcul, oferind facilitati de acces si stocare in timp util.
Un sistem de gestiune al unei baze de date (SGBD) repreziunta un program
software ce permite definirea strcturii ba zei de date, implementarea limbajelor de
implementare, definirea si manipularea altor obiecte, specificara facilitatilor privind
stocarea datelor, asigurarea de dreturi si roluri de acces. Un SGBD izoleaza utilizatorul de
mecanismele interne de stocare si acces.
O baza de date trebuie sa asigure urmaoarele proprietati:
– Abstractizarea datelor : datele trebuie prezentate intro forma abstracta si structurata.
Pentru a mari eficinta bazei de date, se formeaza structuri complexe de date inainte
de memorarea ac estora. Structura bazei de date este deterinata de o combinatie de
scheme, relatii, restricti ce trebuie sa fie satisfacute si legaturi ce se efectueaza intre
date;
– Integritatea datelor : se refera la corectitudinea datelor continute de baza de date si
la modalitata de manipularea a acestora astfel incat acestea sa satisfaca restrictiile
impuse initial;
– Independenta datelor: modalitatea de organizare a datelor trebuie sa fie transparenta
pentru utilizatori, iar modificarile din baza de date nu trebuie sa nec esite rescrierea
acestora pentru a functiona in mod optim;
– Securitatea datelor: se realizeaza prin protejarea bazei de date de accese
neautorizate. Acestu lucru se realizeaza prin gestionarea accesului la informatii si
tipurile de operatii pe care fiecare utilizator le poate efectua;
– Partajarea datelor: determina utilizarea bazei de date simultat de mai multe aplicati;
se asigura gestiunea tranzactiilor si a prelucrarilor concurente;

12
MongoDB

MongoDB este o baza de date gratuita, open -source, ce poate f i utilizata de pe o
varietate de platforme si este orientata spre documente. Aceasta este clasificata drept o
baza de date NoSQL.
O baza de date NoSQL nu mai utilizeaza structura clasica, tabelara, a bazelor de
date relationale, in schimb aceasta permita structurarea datelor mult mai logic. Acestea au
aparut datorita vastitatii datelor moderne care de cele mai multe ori sunt nestructurate.
MongoDB a adaptat o structura asemanatoarea cu documente asemanatoare
fisierelor de tip JSON, ce au scheme dinamice, ce a numt -o BSON. Acesta schema face ca
integrarea datelor in anumite tipuri de aplicatii sa fie mai rapida. Mongo a fost construita
pentru a fi scalabila, accesibila si sa ofere performata pornind de la utilizarea unui singur
server pana la infrastructuri mult mai complexe.
Principalele operatiuni ce sunt posibile intr -o baza d date Mongo sunt:
– Realizarea de interogai ad hoc – se pot realiza interogari dupa camp, expresii
regulate sau interogari de interval;
– Indexarea: orice camp dintr -un document BSON po ate fi indexat;
– Replicarea: valabilitatea imediata a datelor este datorata unor seturi ce sunt formate
de doua sau mai multe copii ale datelor originale;
– Balansarea incarcaturii(Load Balancing) – „Sharding” reprezinta metoda utilizatade
MongoDB pentru ai p ermite sa fie scalabila orizontal. Acest lucru insemna ca
datele vor fi distribuite si impartie in blocuri ce vor fi stocate in difeite „shard” -uri,
sharduri ce se vor gasi pe diferite servere. Pentru a determina cum au fost
distribuite datele, se vor util iza chei pentru sharduri;
– Agregarea – Pentru procesarea in srie a datelor si realizarea operatiolor de agregare
se va utiliza MapReduce;
– Stocarea fisierelor – Mongo poate fi utilizata ca un siste de fisiere ce utilizeaza
toate functile de mai sus prin func tionarea intr -o maniera distribuita prin
intermediul procesului de shardening;

13

14 3. Aplicatie..Utilizator

15 4. Implementarea aplicatiei
…a fost alegerea unui mediu integrad de dezvoltare( Integrated development
environment, cel mai adesea cunoscut sub prescurtearea de IDE ). Un IDE reprezinta o
aplicatie software, a carui scop este de a ajuta programatorii in scrierea programelor. Un
mediu de dezvoltare va combina toti pasii necesari crearii unui program , editare cod sursa,
compilare, depanare, tes tare, intr -un singur soft, ce ofera in acelasi timp si o interfata
prietenoasa.
Pentru realizarea aplicatiei MyACS am ales sa utilizez mediul de dezvoltare produs
de compania ceha JetBrains, WebStorm. WebStorm este mediu foarte puternic, perfect
echipat p entru dezvoltarea de aplicatii complexe pentru partea clientului utilizand
JavaScript, dar si pentru aplicatiile din partea serverelor, utilizand Node.Js. WebStorm
ofera supor pentru HTML, CSS, JavaScript si alternativele lor mai moderne si utilizeaza
unelte de dezvoltare cum ar fi: editor inteligent pentru oferirea de asistenta pentru
JavaScript, Node.js si ECMAScript6 dar si un debugger integrat pentru aplicatile realizate
cu NodeJs.
MVC
Aplicatia utilizeaza modelul………MVC reprezinta un model arhit ectural ce consta
in separarea aplicatiei in trei componente logice principale: modelul, vizualizarea si
controlorul. Fiecare dintre aceste componente au fost formate pentru a se ocupa de aspecte
specifice alea dezvoltarii aplicatiei. Am ales sa utilizez un astfel de model deoarece, MVC
reprezinta standardul cel mai utilizat in dezvoltarea alicatilor web, oferind scalabilitate
aplicatilor si…….o modificare nu aduce schimbari si intr -o alta zona, astfel daca cineva nu
are acces decat undeva sa nu poate sa strice..ceva de genul asta.
Componentele modelului MVC sunt:
– Model: Aceasta componenta contine toate informatiile ce contin logica datelor cu
care utilizatorul va lucra. Acestea pot fi date ce sunt transferate intre Controlor si
Vizualizator sau orice a lte date, cum ar fi un obiect Utilizator va prelua informatiile
despre utilizatori din baza de date, le va manipula, updata si salva in baza de date
sau le va afisa in aplicatie;
– Vizualizare: Aici vor fi stocate toate datele ce vor fi utilizate pentru logi ca interfetei
cu utilizatorul. De exemplu, vizualizarea informatilor despre Utilizatori vor contine
zone text, imagini, checkbox -uri, etc. – toate aceste reprezentand elemente cu care
utilizatorii vor interactiona;
– Controlor: Aceasta componenta actioneaza ca o iterfata de legatura intre
componentele mentionate mai sus. Rolul acesteia este a procesa cererile efectuate ,
de a manipula datele utilizand componenta model si de a interactiona cu
componenta vizualizare pentru a oferi un raspuns final. De exemplu, controlorul
Utilizator va primi o serie de date de intrare de pe pagina de adaugare utilizatori,

16 acesta va utiliza acele date pentru a crea un nou utilizator ce va fi salvat in baza de
date, respectand modelul Utilizator din componenta model, urmand ca in final sa
incarce o noua pagina din Vizualizator.
In ima ginea alatura se poate obseva structura intregului proiect. Analizand fiecare
document in parte, vom putea distinge:
– Middleware: Contine functii ce sunt rulate in….vezi tutorial iar pt middeleware;
– Models: Componenta Model;
– Node_modules: Contine elementele npm ….
– Public: Aici am salvat foile de stiluri, scripturile javascript precum si alte informatii
vizuale utilizate in aplicatie;
– Routes: Componenta Controlor;
– Views: Componenta Vizualizator;
– App. js: Componenta principala a aplicatiei, aceasta facand legatura dintre toate
celelate elemente…
– Package.jason: Contine depenetele npm…bla bla

Implementarea Bazei de Date
Pentru a realiza legatura dintre aplicatie si baza de date MongoDB am utilizat
pachetul Mongoose. Acesta ofera o solutie simpla, bazate pe o schema pentru a ne permie
sa modelam datele din aplicatie. Pachetul include casting incorporate, validare, formulare
de interogari si multe alte unelte ce ne permit sa constuim logica aplicatiei;
De fiecare data cand vom utiliza mongoose, vom porni de la formularea unei
scheme. Fiecare schema va reprezenta modelul unei colectii din MongoDB si va defini
forma documentului din interiorul acelei colectii;

17
Mai sus este reprezentat codul unei a stfel de scheme …
…

Sistemul de login
Pentru realizarea sistemului de login am utilizat pachetul passport. Acest pachet a
fost proiectat pentru a se ocupa de cererile de autentificare si poate oferi diferite strategii
de autentificare, incluzand cele bazate pe retele sociale.
Strategie pe care am decis sa o utilizez este una clasica, bazata pe email oferit de
facultate urmat de o parola initiala alcatuita din cuvantul ‚ autcalc’ urmat de ultimele 6 cifre
din codul numeric personal . Pentru a realiza ac est lucru am inceput prin instalarea
pachetului si cererea tuturor dependetelor in intriorul fisierului app.js

De asemene am utilizat pachetul express -session pentru a putea stoca sesiunile.
Urmatorul pas a fost utilizarea modului passport -local pen tru a integra sistemul de
autentificare bazat pe numeutilizator si parola.

Var passport = require("passport"),
LocalStrategy = require("passport -local").Strategy,
passportLocalMongoose = require("passport -local-
mongoose");
app.use(require("express -session")({
secret: "Sic Parvis Magna",
resave: false,
saveUninitialized: false
}));
app.use(passport.initialize());
app.use(passport.se ssion());
app.use(function (req, res, next) {
res.locals.currentUser = req.user;
res.locals.error = req.flash("error");
res.locals.success = req.flash("success");
next();
});

passport.use(new LocalStrategy(User.authenticate()));
passport.s erializeUser(User.serializeUser());
passport.deserializeUser(User.deserializeUser());

18 Dupa ce am realizat acest setari, sistemul de login poate fi utilizat. Acesta va prelua
numele utilizatorului introdus si fa efectua o cautare in baza de date pentru a vede a daca
acesta exista. In cazul pozitv, asupra parolei introduse se va aplica aceeasi metoda de hash
ce a fost aplicata asupra parolei ce se gaseste stocata in baza de date si se va realiza o
comaratie pentru a vedea daca acestea se potrivesc. Daca se va tr ece si de aceasta etapa,
atunci se va trece automat la redirectarea catre pagina principala a aplicatiei. In caz contrar,
utilizator va fi atentionat de faptul ca a aparut o eraore in timpul procesului de
autentificare.
Asa cum am mentionat mai sus, parol a initiala este o parola generata automat si nu
se poate considera foarte sigura. Din acest motiv este recomandat ca aceasta sa fie
schimbata imediat ce contul unui utilizator a fost creat. De asemenea, exista posibilitatea
ca utilizatorul sa uite parola s etata. Asfel, am conceput un sistem de recuperare/schimbare
ce se bazeaza pe mailul utilizatorului. In cazul in care se inregistreaza o cerere de
schimbare a parolei, aplicatia va trimite un mail utilizatorului cu un link activ pentru o
perioada limitata d e timp. Accesand linkul, utilizatorul va putea sa reintroduca noua parola.
Pentru a realiza acest lucru am utilizat pachetul async -waterfall ce imi permite sa
rulez un vector de functii, rezultatul functiei precedente fiind utlizat drept intrare pentru
functia actuala. De asemenea daca este inregistrata o eroare in timpul rularii unei functii, se
va opri intreaga ecutiei a secventei de functii.

Prima secventa utilizeaza pachetul crypto pentru a realiza criptarea unui sir aleator
de 20 de biti. Va riabila token va stoca aceasta valoare dupa ce va realiza o conversie
hexazecimala.

crypto.randomBytes(20, function (err,buf) {
var token = buf.toString('hex');
done(err, token);
});
User.findOne({username: r eq.body.email }, function (err, user) {
if(err){
console.log(err);
} else {
if(!user) {
req.flash("error", "No account with that
email address exists.");
return res.redirect("/forgot");
}
user.resetPasswordToken = token;
user.resetPasswordExpires = Date.now() +
3600000; //o ora

user.save(function (err) {
done(err, token, user);
});
}
});

19 Urmatoarea secventa veri fica daca exista adresa de email introdusa este una valida,
salveaza token -ul format in secventa anterioara si seteaza o limita egala cu o or a, in care
operatiunea de resetare a parolei este valida.

Ultima secventa este responsabila pentru trimiterea unui mesaj pe adresa de email
oferita. Aici sunt introduse informatiile adresei de email tilizata de aplicatie, precum si
subiectul si mesajul emailului ce urmeaza a fi trimis. Pentru a realiza acest lucru am utilizat
pachetul nodemailer, pachet ce a fost conceput special pentru realizarea unor astfel de
operatiuni.
Urmatorul pas trebuie efectuat de catre utilizator, mai exact sa se aute ntifice in
aplicatia de email utilizata si sa acceseze linkul oferit de catre aplicatia MyACS. Dupa ce
va face acest lucru, va fi redirectionat catre adresa aplicatiei MyACS si i se va permite sa
reintroduca noua parola. In momentul in care acest lucru est e realizat, primul pas pe care
aplicatia il va urma va fi sa verifice daca data de expirare a tokenului nu a fost atinsa. Daca
perioda depaseste o ora, atunci tokenul va fi sters din baza de date, iar parola va ramane
neschimbata. Daca perioada este mai mi ca de o ora, se va compara daca valorile din
campurile parola noua si confirma parola noua coincid, si se va salva noua parola in cazul
pozitiv.

Securitatea aplicatiei var smtpTransport = nodemailer.createTransport({
service: 'Gmail',
auth: {
user: 'vlad.licenta@gmail.c om',
pass: 'ACS#licenta'
}
});
var mailOption = {
to: user.username,
from: "vald.licenta@gmail.com",
subject: "Password Reset",
html:
"<p>You are receiving this because you (or
someone else) have requested the reset of the password for your
account.</p>" +
"<p>Please click on the following link, or paste
this into your browser to complete the process: " +
"http://" + req.headers.host + "/reset/" + token
+
"</p><p>If you did not request this, please
ignore this email and your password will remain unchanged.</p>"
};
smtpTransport.sendMail(mailOption, function (er r)
{done(err, "done");});

20 Despre middleware
Despre curatarea textuui introdus in comentarii sau alte inputuri

Rute
Transferul de stat reprezentativ ( Representational State Transfer – prescurtare
utilizata: REST ) reprezinta un stil arhitectura pentru a defini un set de contrangeri si
proprietati bazate pe serviciul HTTP. Serviciile web ce respecta acest tip de ar hitectura
ofera interoperabilitatea dintre sistemele de tip calculator si internet. Servicile web REST
permit accesarea si manipularea reprezentarii textuale a resurselor web prin utilizarea unor
operatii fara stare (stateless) uniforme si predefinite.
Acest tip de tehnologie este preferata peste mult mai robustul Protocol de acces al
obiectelor simple ( SOAP ) deoarece utilizeaza o latima de banda mai mica, fiind astfel
mult mai potrivita pentru utilizare folosind internetul. REST utilizeaza in mod explici t
metodologia HTTP definita de protocolul RFC 2616, utilizand: GET pentru a prelua
resurse, PUT penru a schimba o stare sau pentru a realiza updateul unei resurse, POST
pentru a crea aceea resursa si DELETE pentru a o sterge.
CRUD??
Aplicatia MyACS a fost contruita utlizand aceste notiuni, aproape fiecare colectie
din baza de date aceste posibilitati.
Nume Ruta Verbul
HTTP
Utilizat Scop Metodologia mongoose
utilizata
Index /event GET Listarea tuturor
evenimentelor Event.find()
New /event/new GET Vizualiz area formularului
pentru introducereau unui
nou evenimnet in baza de
date N/A
Create /event POST Crearea unui nou evenimnet Event.create()
Show /event/:id GET Vizualizarea informatilor
specifice ale unui
evenimnet Event.findById()

21 Edit /event/:id/edit GET Afisarea formularului pentr
editarea unui eveniment
deja existent Event.findById()
Update /event/:id PUT Realizarea operatiuni de
actualizare a infrmatilor
unui eveniment Event.findByIdAndUpdate()
Destroy /event/:id DELETE Stergerea unui evenimnet
din baza de date Event.findByIdAndRemove()

Punand aceste informatii in practica, un fisier din folderul routes, ce reprezinta
componenta de control pentru actiunile ce privesc o anumita coletie din baza de date va
avea urmatoarea structura.

Zona de apl eare a modulelor ce sunt necesare pentru ca script -ul sa ruleze in mod
corespunzator dar si a colectilor ce vor fi utilizate.

Codul de mai sus corespunde zonei index, zona ce va fi responsabila de afisarea
tuturor evenimentelor existente in baza de da te. Structura codului este urmatoarea: se va
introduce ruta ce va introduce metoda utilizata de cererea http, ruta, lansarea in executie a
functiei is LoggedIn utilizata pentru a verifica daca adresa respectiva este accesata de un
utilizator ce s -a conecta t la platforma web si o functie.
In interiorul functiei, se va realiza o cautare generala a tuturor evenimentelor, se
vor trata erorile in situatia in care acestea exista si se se va lansa in executie vizualizarea
paginii de index a evenimentelor.
var express = require("express"),
router = express.Router(),
middleware = require("../middleware");

var User = require("../models/user"),
Event = require("../models/event");
//INDEX
router.get("/", middlewar e.isLoggedIn, function (req,res) {
Event.find({}, function (err, allEvents) {
if(err) throw err;
res.render("event/index", {event: allEvents});
});
});
router.get("/new", middleware.isLoggedIn, function (req,res) {
res.render(" event/new");
});

22 Pentru secventa new, nu este necesar decat sa se lanseze in executie vizualizarea
paginii new, pagina ce va contine formularul necesar pentru introducerea unui nou element
in interiorul colectiei.

Pentru a crea un nou eveniment, pentru inceput va tr ebui sa cautam userul actual.
Daca acesta va fi gasit si nu intampinam nicio eroare atunci vom crea noul eveniment
utilizand informatile trimise prin formularul de pe pagina new. Deoarece intre utilizator si
evenimente exista o legatura unu la mai multi, i n interiorul colectiei events vom salva id -ul
autorului precum si numele de utilizator, iar in interiorul colectiei user vom adauga in
vectorul events id -ul noului eveniment.

router.post("/", middleware.isLoggedIn, function (req,res) {
User.findById(req.user._id, function (err, user) {
if(err){
console.log(err);
req.flash("error", "Ceva a mers prost!");
res.redir ect("/index/events");
} else {
Event.create(req.body.event, function (err, event) {
event.author.id = req.user._id;
event.author.username = req.user.username;
event.save();

user.events.push(event._id);
user.save();

req.flash("success", "Eventul a fost adaugat cu
succes");

res.redirect("/index/events/");
});
}
});
});
//SHOW
router.get("/:id", middlew are.isLoggedIn, function (req,res) {
Event.findById(req.params.id, function (err, foundEvent) {
if(err) throw err;
res.render("event/show", {event: foundEvent});
});
});

//EDIT
router.get("/:id/edit", middleware.isLoggedIn, functio n
(req,res) {
Event.findById(req.params.id, function (err, foundEvent) {
if(err) throw err;
res.render("event/edit", {event: foundEvent});
});
});

23 Pentru secventele show si edit se va realiza o cautare dupa un id specific in colectia
Event, iar in situatia in care nu este intampinata nicio problema atunci vom lansa in
executie vizualizarea paginii show, respectiv edit. In ambele situatii vom trimite sub forma
unui obiect toae informatiile despre evenimentul gasit.

Pentru a realiza actualizarea informatiilor dintr -o colectie, vom efectua o cautare
dupa id -ul evenimentului pe care dorim sa -l modifica si vom realiza operatia de
actualizarea pe baza noilor informatii primite de la formularul existent pe pagina edit.

Stergera informatilor dintr -o baza de date se va realiza intr -o maniera asemanatoare
cu cea mentionata mai sus, singura exceptie fiind: vom aplela functia findByIdAndRemove
in loc de findByIdAndUpdate. Dupa ce vom finaliza stergerea evenimentului, vom fi
redirectionati catre pagina index a evenimentelor.
Ultima linie de cod este utilizata penru a spune ce va returna scriptul event.js din
interiorul componentei de control.

Continuare pentru posibilitatile de filtrare mai avansate

Calendar //UPDATE
router.put("/:id", middleware.isLoggedIn, function (req,res)
{
Event.fi ndByIdAndUpdate(req.params.id, req.body.event,
function (err, foundEvent) {
if(err) res.redirect("back");
res.redirect("/index/events/"+foundEvent._id);
});
});
//DELETE
router.delete("/:id", middleware.isLoggedIn, function
(req,res) {
Event.findByIdAndRemove(req.params.id, function (err) {
if(err) res.redirect("back");
req.flash("success", "Eveniment Sters");
res.redirect("/index/events");
});
});

module.exports = router;

24

Calendar: n otificari cand se realizeaza modificari, ajax?
Harta

25 5. Concluzii

26 6. Bibliografie

https://en.wikipedia.org/wiki/Integrated_development_environment
https://www.jetbrains.com/webstorm/
https://www .mongodb.com/what -is-mongodb
https://en.wikipedia.org/wiki/MongoDB
https://www.techopedia.com/definition/30340/mongodb
http://www.scritub.com/stiinta/informatica/SISTEME -DE-GESTIUNE -A-BAZELOR –
92297.php
https://en.wikipedia.org/wiki/NoSQL

https://www.tutorialspoint.com/javascript/javascript_overview.htm
https://en.wikipedia.org/wiki/JavaScript
https://www.tutorialspoint.com/css/what_is_css.htm
https://en.wikipedia.org/wiki/Cascading_Style_Sheets
http://www.yourhtmlsource.com/starthere/whatishtml.html
https://en.wikipedia.org/wiki/HTML

https://en.wikipedia.org/wiki/Express.j s
http://expressjs.com/
https://www.programmableweb.com/news/what -expressjs -and-why-does-it-
matter/analysis/2017/05/05
https://developer.mozilla.org/en -US/docs/Learn/Server -side/Express_Nodejs
https://www.upwork.com/hiring/development/express -js-a-server -side-javascript –
framework/
Accesat 04/04/2017:
– http://smartcitypro.ro/concept/notiuni -si-definitii/
– https://www.comunica tii.gov.ro/smart -city-concept -2/
– http://www.upb.ro/evenimente/upb -va-deveni -primul -smart -campus -din-romania.html
– https://www.ncbi.nlm.nih.gov/pmc/articles/PMC4 931999/
Accesat 11/03/2017:
– http://romaniasmartcities.ro/wp -content/uploads/2017/02/2015 -01.pdf
– http://administratiepublica.eu/smartcitiesconfer ence/publicatii/Orasul_inteligent_editia
_03.pdf
– https://www.bhert.com/events/2015 -06-08/Smart -Cities -Round -Table -Report -June-
2015.pdf

27