Lucrare de licență [609828]

UNIVERSITATEA BABEȘ -BOLYAI
Facultatea de Științe Economice și Gestiunea Afacerilor
Cluj -Napoca

Lucrare de licență

Coordonator științific,
Conf.univ.dr. Dan -Andrei SITAR -TĂUT

Absolvent: [anonimizat]

2019

UNIVERSITATEA BABEȘ -BOLYAI
Facultatea de Științe Economice și Gestiunea Afacerilor
Cluj -Napoca

Lucrare de licență

Gestionarea rețelelor de socializare

Coordonator științific,
Conf.univ.dr. Dan -Andrei SITAR -TĂUT
Absolvent: [anonimizat]

2019

Cuprins

INTRODUCERE ………………………….. ………………………….. ………………………….. ………………………….. … 1
MOTIVAȚIE ………………………….. ………………………….. ………………………….. ………………………….. ……… 2
MODEL DE DEZVOLTARE ………………………….. ………………………….. ………………………….. ………….. 3
CAPITOLUL 1. IDENTIFICAREA ȘI DESCRIEREA PROBLEMEI, CONTEXT ȘI
CERINȚE ………………………….. ………………………….. ………………………….. ………………………….. ………….. 4
1.1. Identificarea și descrierea problemei ………………………….. ………………………….. ……………………… 4
1.2 Context ………………………….. ………………………….. ………………………….. ………………………….. ………. 4
1.2.1. Fațeta subiect ………………………….. ………………………….. ………………………….. …………………… 5
1.2.2. Fațeta utilizare ………………………….. ………………………….. ………………………….. ………………….. 6
1.2.3. Faț eta IT ………………………….. ………………………….. ………………………….. ………………………….. 6
1.2.4. Fațeta dezvoltare ………………………….. ………………………….. ………………………….. ………………. 7
1.3. Cerințe de sistem ………………………….. ………………………….. ………………………….. …………………… 10
1.3.1 Surse de cerințe ………………………….. ………………………….. ………………………….. ……………….. 10
1.3.2. Elicitația cerințelor ………………………….. ………………………….. ………………………….. ………….. 11
1.3.3. Modelul cazurilor d e utilizare ………………………….. ………………………….. ……………………….. 13
1.4. Documentarea cerințelor ………………………….. ………………………….. ………………………….. ………… 18
2.1. Procese și Activități ………………………….. ………………………….. ………………………….. …………… 21
2.2 Tehnologii specifice ………………………….. ………………………….. ………………………….. ……………….. 23
CAPITOLU L 3. ANALIZA BAZEI DE DATE ………………………….. ………………………….. …………… 31
3.1 Structura tehnică a datelor ………………………….. ………………………….. ………………………….. ……….. 31
3.2. Baze de date relaționale ………………………….. ………………………….. ………………………….. …………. 32
CAPI TOLUL 4. PROIECTAREA SISTEMULUI INFORMATIC ………………………….. …………… 36
4.1. Proiectarea logica ………………………….. ………………………….. ………………………….. ………………….. 36
4.1.1 Arhitectura Sistemului ………………………….. ………………………….. ………………………….. ……… 36
4.1.2 Baza Informațională ………………………….. ………………………….. ………………………….. …………. 40
4.2 Proi ectarea tehnică ………………………….. ………………………….. ………………………….. …………………. 41
CAPITOLUL 5. IMPLEMENTAREA ȘI TESTAREA APLICAȚIEI ………………………….. ……… 46
5.1 Implementarea aplicației ………………………….. ………………………….. ………………………….. …………. 46
5.1.1. Instalarea și configurarea serverului WAMPP ………………………….. ………………………….. …. 46
5.1.2 Adaugarea bazei de date ………………………….. ………………………….. ………………………….. ….. 47
5.1.3 Crearea părții back -end ………………………….. ………………………….. ………………………….. …….. 48
5.1.4 Adaugarea template -ului pentru Front -end ………………………….. ………………………….. ……… 51
5.1.5 Dezvoltarea interfeței cu utilizatorul ………………………….. ………………………….. ……………….. 51
5.2. Testarea aplicației ………………………….. ………………………….. ………………………….. …………………. 55
5.2.1. Testarea funcțională ………………………….. ………………………….. ………………………….. ………… 55
5.2.3. Testarea de utilizare ………………………….. ………………………….. ………………………….. ……………. 58
5.2.3 Testarea compatibilității ………………………….. ………………………….. ………………………….. ……….. 60
5.2.4 Testarea securității ………………………….. ………………………….. ………………………….. ………………. 61
CONCLUZII ………………………….. ………………………….. ………………………….. ………………………….. ……. 62
BIBLIOGRAFIE ………………………….. ………………………….. ………………………….. ………………………….. . 63

Listă cu figuri:
Figura 1 . Modelul de dezvoltare incremental ………………………….. ………………………….. ……………………. 3
Figura 2. Diagrama Fish -bone ………………………….. ………………………….. ………………………….. ……………. 8
Figura 3 . Diagrama Pareto ………………………….. ………………………….. ………………………….. ………………… 9
Figura 4 . Diagrama Obiectivelor ………………………….. ………………………….. ………………………….. ………. 10
Figura 5 . Diagrama cazurilor de utilizare ………………………….. ………………………….. ………………………. 14
Figura 6 . Diagrama de secvență pentru utilizare ………………………….. ………………………….. …………….. 18
Figura 7 . Diagrama de procese și activități ………………………….. ………………………….. …………………….. 22
Figura 8 . Stilizarea tag -urilor HTML ………………………….. ………………………….. ………………………….. … 25
Figura 9. Diagrama ERD ………………………….. ………………………….. ………………………….. …………………. 33
Figura 10 . Modelul client/server pe două niveluri ………………………….. ………………………….. ……………. 37
Figura 11. Arhitectura multi -nivel ………………………….. ………………………….. ………………………….. …….. 38
Figura 12 . Diagrama arhitecturii Model -View -Controller ………………………….. ………………………….. … 39
Figura 13. Baza informațională ………………………….. ………………………….. ………………………….. ………… 40
Figura 14. Baza de date ………………………….. ………………………….. ………………………….. …………………… 47
Figura 15. Tabela events ………………………….. ………………………….. ………………………….. ………………….. 48
Figura 16 Popularea tabelei users ………………………….. ………………………….. ………………………….. …….. 48
Figura 17. Scripturi le PHP ………………………….. ………………………….. ………………………….. ………………. 49
Figura 18 Script pentru logare utilizator ………………………….. ………………………….. ………………………… 50
Figura 19. Script -ul de socializare ………………………….. ………………………….. ………………………….. …….. 50
Figura 20. Fișierele limbajului CSS ………………………….. ………………………….. ………………………….. …… 51
Figura 21 . Fișierele limbajului JavaScript ………………………….. ………………………….. ……………………… 52
Figura 22. Implementare calentare JavaScript ………………………….. ………………………….. ………………… 52
Figura 23. Formularul de autentificare ………………………….. ………………………….. ………………………….. 53
Figura 24 Pagina principală a aplicației ………………………….. ………………………….. ………………………… 54
Figura 25. Calendarul pentru planificare evenimente ………………………….. ………………………….. ………. 54
Figura 26. Chat friends ………………………….. ………………………….. ………………………….. ……………………. 55
Figura 27 Testarea datelor introduse la înregistrarea utilizatorului ………………………….. ……………….. 56
Figura 28 Creeare cont cu succes ………………………….. ………………………….. ………………………….. ……… 57
Figura 29 Imposibilitatea creării contului ………………………….. ………………………….. ………………………. 57
Figura 30 Testarea formularului de logare ………………………….. ………………………….. ……………………… 58
Figura 31 Testarea pentru cautare utilizator ………………………….. ………………………….. …………………… 58
Figura 32 Cererea de prietenie ………………………….. ………………………….. ………………………….. …………. 59
Figura 33 Testarea schimbului de mesaje prin chat ………………………….. ………………………….. …………. 59
Figura 34 Planificare eveniment ………………………….. ………………………….. ………………………….. ……….. 60

Listă cu tabele:
Tabel 1 . Scenariu de utilizare ………………………….. ………………………….. ………………………….. …………… 16
Tabel 2 . Scenariu de utilizare II ………………………….. ………………………….. ………………………….. ………… 17
Tabel 3 . Cerințele funcționale ………………………….. ………………………….. ………………………….. …………… 19
Tabel 4 . Cerințele calitative ………………………….. ………………………….. ………………………….. ……………… 20
Tabel 5. Tabela de mapare ………………………….. ………………………….. ………………………….. ………………. 35

1
INTRODUCERE

Omul este definit ca fiind o ființă complexă, având mai multe nevoi de bază . O trăsătură
fundamental ă care îi definește viața este aceea de a comunica, de a t ransmite sau de a primi
mesaje (informații, idei, sentimente) . Oamenii sunt diferiți, pot să comunice mai greu sau mai
ușor cu ceilalți, totul depinde de propriile trăsături si propriile experiențe
În cele ce urmează intenționăm să vă prezentăm motivele c are ne -au condus la alegerea
acestei teme precum și soluți a în ceea ce privește dezvoltarea aplicației și anume facilitarea
procesului de comunicare textuală prin intermediul internetului. Totodata propunem să definim
succinct unele noțiuni, pe care le vom folosi în cadrul prezentei lucrări. Scopul fiind acela de a
facilita înțelegerea și familarizarea cu conceptul de rețea socială.
În prezent există foarte multe tipuri de socializare precum: bloguri, rețelele de
socializare, microbloguri, video, podcasts etc. O rețea de socializare (rețea socială) este,
general vorbind, o rețea de persoane cu scopuri comune. Ceea ce se poate spune în prezent
despre rețelele de socializare este faptul ca sunt într -o continu ă creștere .
Socializarea online este foarte importantă, acest lucru explicându -se prin faptul ca liceele,
colegiile și locurile de munca nu au atât de mulți membri, spre deosebire de Internet care este
utilizat de milioane de persoane, dintre care o parte este foarte interesată și să dezvolte prietenii
online.
Un avantaj al comunicării online se referă la ușur ința și comoditatea prin care putem
interacționa cu mulți alți oameni, cunoscuți sau necunoscuți. Faptul ca "totul se întamplă" pe
un ecran al unui calculator/ laptop, face ca totul să fie mai simplu.
Tinând cont de toate aceste lucruri, am decis să reali zezăm o aplicație online pentru
utilizatorii care doresc să își programeze întâlniri cu prietenii și preferă mediul online pentru
a face acest lucru. Aplicația permite unui utilizator să se înregistreze, în cazul în care acesta nu
are cont încă, sau să se logheze dacă acesta are deja contul creat. După ce utilizatorul este logat,
acesta poate să adauge prieteni, să socializeze cu aceștia printr -un chat și să creeze evenimente
în funcție de propriul calendar și de calendarul prietenilor. Utilizatorul poate să trimită invitații
la anumite evenimente dar, de asemenea, poate să primească invitații de la prieteni și, în funcție

2
de propria dorință, să accepte sau să refu ze invitațiile. Urmărind o abordare tehnologică,
lucrarea este structurată în 7 capitole .
MOTI VAȚIE

Motivația care stă la baza dezvoltării unei astfel de aplicații web o reprezintă creșterea
continuă a popularității a acestui tip de site care ne ajut ă să fim mereu în contact cu prietenii și
cunoștințele , devenind principala modalitate de creare și menținere a relaților și de comunicare
virtuală.
Deoarece în prezent datorită modernizării din domeniul tehnologiilor informaționale,
omul a fost pus în fața altui tip de comunicare și anume comunicarea electronic ă. Aceasta se
efectuează prin rețelele de socializare. Re țelele de socializare pot fi definite foarte simplu, avem
nevoie doar sa arunc ăm o priviere asupra vie ții noastre, chiar daca termenul este relativ nou
conceptul este la fel de vechi ca și omenirea. Unul din alte motive este faptul ca re țelele de
socializare pot contribui la schimbarea mentalit ății și la prezentarea altor alternative dec ât
metodele tradi ționale de comunicare a unei idei.
Un alt aspect important este faptul ca rețelele de socializare ofer ă gratis servicii de comunicare
și servicii entertainment.
Rețelele de socializare numite și rețele sociale sunt printre site -urile în trend în ultimii
ani. Putem spune faptul că nu doar ne ajută să fim mereu în contact cu prietenii și cunoștințele,
dar au revoluțonat și felul în care face m afaceri prin Internet sau modalitatea prin care ne găsim
un job. Mișcarea de socializare pe web a luat o amploare deosebită în ultima perioadă și,
conform statisticilor, în următorii ani situația va deveni și mai complicată, pentru că se
estimează, că în următorii ani numărul utilizatorilor de Internet va crește considerabil.
Potrivit Wikipedia, o rețea de socializare reprezintă o rețea de persoa ne care au acelasi scop
sau scopuri commune cum ar fi o retea de studenti [1].

3
MODEL DE DEZVOLTARE

În prezen t ingineria informatică trebuie încă să găsească rezolvări pentru problemele
aplicatiei, pentru a putea produce sisteme care sa poată satisface cerințele utilizatorilor, să fie
flexibile și adaptabile în timp.
Modelele de dezvoltare sunt utilizate pentru a ghida analiza, dezvoltarea și întreținerea
sistemelor informatice.
Pentru această aplicație modelul de dezvoltare ales este modelul incremental, care are la bază
ideea următoare: dacă un sistem este prea complex pentru a putea fi înțeles, conceput sau
realizat într -o singură fază, atunci este mai bine să fie realizat în mai multe faze. Se va folosi
modelul incremental deoarece este cel mai potrivit pentru dezvoltarea aplicațiilor care
evoluează în timp.
Dezvoltarea incrementala este benefică deoarece împarte proiectul în părți mai mici care
permite obținerea unor rezultate mai rapide precum reacții mai valoaroase în ceea ce privește
utilizatorii. Ceea ce se poate spune despre aceast model de dezvoltare este faptul că fiecare
iterație/incrementare repre zintă un miniproces în cascadă în care reacția de la o fază furnizează
informație vitală pentru proiectarea urmatoarei faze. Produsele software rezultate la ieșirea
fiecărei etape pot fi introduce în producție imediat ca versiuni incrementale.La utilizarea
acestui model, prima versiune reprezintă o aplicație funcțională care îndeplinește funcțiile de
bază dorite.
Figura 1. Modelul de dezvoltare incremental

4
CAPITOLUL 1. IDENTIFICAREA ȘI DESCRIEREA PROBLEMEI ,
CONTEXT ȘI CERINȚE

1.1. Identificarea și descrierea problemei

Rețelele de socializare s -au dezvoltat foarte rapid în ultimii 20 de ani, în prezent
devenind principala modalitate de creare și menținere a relaților și de comunicare virtual ă.
Socializarea online este foarte impor tanta, acest lucru explic ându-se prin faptul că s -a
dezvoltat atât de mult, astfel încât în momentul de față există rețele sociale cu scopuri relativ
diferite.
Rețelele de socializare reprezintă multe avantaje. În prezent se poate spune că datorit ă
lor a crescut foarte mult activitatea socială. Totul datorită u șurinț ei și comodit ății comunicării
online în timp real chiar și cu persoanele care se afla la o distanță de mii de kilometrii.
Un avantaj este reprezentat de faptul că pentru unele persoane este dificil s ă se exprime
în viața reală, iar rețelele de socializare pot fi un ajutor pentru creșterea în sine. De a
interac ționa cu alti oameni, cunoscu ți sau necunoscu ți. Foarte important este faptul că te ajută
chiar și să economisești timp, bani, si de ce nu de ați găsi un partener de viață.

1.2 Context

În ceea ce privește rețelele de socializare, ele reprezintă o țintă în permanență mișcare
pentru cercetatorii și factorii de decizie din mai multe domenii. În prezent există mai multe
rețele de socializ are precum Facebook, Youtube, LinkedIn, Twitter etc. Aceste rețele de
socializare au atras milioane de utilizatori mulți dintre aceștia accesându -le zilnic, folosindu -le
zilnic pentru diferite scopuri. Aceste site -uri pot fi orientate spre contexte legate de muncă,
recrutare personal( cum ar fi de exmplu LinkedIn.com) conectarea utilizatorilor cu interese
comune, sau de către studenții din universități (precum Facebook.com).
Studenții fiind una din categoriile care utilizează în mod frecvent rețelele de socializare.
Reprezintă și o modalitate ușoară și bună de a găsi prieteni și de a comunica mai ușor cu ei
precum și pentru petrecerea timpului liber .

5
Facebook fiind una din cele mai cunoscute retele de socializare utilizat pentru diferite
scopuri, inlcusi v pentru educa ție, deoarece pune în legatură pe cei care doresc s ă învețe același
lucruri precum si s ă pastram legatura cu prietenii, colegii de liceu sau facultate. Utilizatorii au
posibilitatea de a asocia grupuri de interes comun, organizate pe categori i de colegi de serviciu,
școală sau universitate, ei putând grupa prietenii pe liste, cum ar fi “Informatica Economica
2016 -2019”.
Twitter este un serviciu de micro blogging, care permite utilizatorilor săi să trimită și
să citească imagini și mesaje bazat e pe text care pot ajunge până la 140 de caractere, cunoscute
neformal drept “tweets”. A fost creat în luna Martie al anului 2006, ajungând ca în anul 2011
să fie înregistrați un numar de peste 200 de milioane de utilizatori. Această retea oferă
oamenilor informații actualizate despre evenimente de moment. Comunicarea este foarte
optimizată , permițând recepționarea imediată a reacției din partea oamenilor( de expmplu:
puneți o intrebare – ulterior vedeți informația care o primiți drept răspuns).
YouTube r eprezintă un site pentru schimb de fișiere video, ce permite utilizatorilor să
încarce, să facă schimb și să vizualizeze fișiere video. Creat in anul 2005, cu ajutorul acestei
rețele utilizatorii au libertatea de a încărca propriile video -uri pe site, cond itionate ca fișierele
respective să nu depășească marimea de 100 MB și să nu fie mai lungi de 10 minute. Exista
posibilitatea ca fișierele să fie publice sau private, cu posibilitatea de a plasa un comentariu la
video.
Rețeaua Linkedln este o rețea de soc ializare orientată spre mediul de afaceri. Acestă
rețea a fost lansata în 2002, iar motivul a fost acela de a construi o legatur ă între profesioniști
și companii. Fiind prezentate în același timp și competențele pe care persoanele le dețin,
precum și infor mații legate despre locuri de muncă și oportunități de angajare.
Aplicația dezvoltată va ajuta să fim mereu în contact cu prietenii și cunoștințele,
distanța nemaifiind cel mai important element. Cu ajutorul metodologiei fatetelor vom detalia
fiecare fațet ă în parte și anume: subiect, utilizare, IT si dezvoltare.
1.2.1. Fațeta subiect
La deschiderea în browser a aplicației web de socializare, utilizatorului îi va apărea un modal
de login cu următoarele funcționalități:
• Login -utilizatorul trebuie să completeze câmpurile pentru username și password

6
• Register -utilizatorul trebuie să completeze câmpurile pentru username, email și
password
• Forgot password -utilizatorul trebuie să completeze câmpul pentru email.
În cazul în care dorește să se înregistreze, n eavând în că cont, acesta va complete câmpul
pentru username, email și password și va apasa butonul “REGISTER”.
În cazul în care este un utilizatorul nou acesta se va înregistra prin creearea unui cont sau
dacă este deja utilizator doar se va log a prin com pletarea câmpul pentru username și password
și va apăsa butonul “LOGIN”. Utilizatorul are posilibilitatea de a adauga prieteni noi sau să
primeasca cereri de prietenii de la alți utilizatori.
Mai are și posibilitatea sa primească invitații de la diferite evenimente, iar fiecare invitație în
parte va avea două butoane: Going și Not going.
La sfârșit când utilizatorul va dori să se delogheze, se va declanșsa butonul “LOGOUT”.
1.2.2. Fațeta utilizare
Aplicația web poate fii utilizată de toți cei care își doresc să socializeze sau să își facă
prieteni noi sau de ce nu să vorbeasca printr -o modalitatea mult mai simplă cu persoanele dragi.
După ce utilizatorul s -a logat, acesta are posibilitatea să verifice dacă a primit cereri de prietenie
de la alte perso ane, în cazul în care nu este utilizator nou. Având posibilitatea sa trimită cereri
de prietenie, să verifice dacă a primit invitații la diferite evenimente, să creeze el anumite
evenimente sau planuri și să socializeze cu prietenii pe chat.
În cazul în care utilizatorul dorește să creeze un plan sau un eveniment, se va deschide
un modal în care utilizatorul va putea să adauge un nume evenimentului, o locație, să adauge
prieteni care vor primi invitații la acesta și să adauge o descriere evenimentului.
1.2.3. Fațeta IT
Internetul este un sistem global de calculatoare și alte aparate cu adrese computerizate,
interconectate conform protocoalelor de comunicare “Transmission Control Protocol” și
“Internet Protocol”(TCP/IP). Internetul oferă o gamă largă de resur se și servicii de informare,
cum ar fi documentele interconectate hypertext și aplicații ale World Wide Web -ului(WWW),
poșta electronica, serviciile de telefonie și rețelele peer -to-peer pentru partajac. World Wide
Web -ul sau Web -ul este doar unul dintr -un număr mare de servicii Internet. Web -ul este o

7
colecție de documente interconectate(pagini web) și alte resurse web, legate prin hyperlink –
uri și adrese URL [3].
Trebuie să existe și un sistem de operare pe care să fie instalat un browser, pentru ca
aplicația să poată fi accesată și să ruleze. Aplicația funcționează pe majoritatea sistemelor de
operare (PC, laptop, tableta, smartphone) și poate să fie utilizată de pe orice browser (Google
Chrome, Opera, Mozilla Firefox, Internet Explorer etc.), dar es te recomandată folosirea Google
Chrome.
1.2.4. Fațeta dezvoltare
Tehnologiile folosite pentru implementarea unei aplicații cuprind straturile de
componente sau servicii care sunt folosite pentru a oferi o solutie software, fiind formate dintr –
o sumă de AP I-uri, platforme, sisteme de operare, baze de date și componente care sunt puse
împreună pentru construirea unui produs.
Fiecare limbaj de programare vine cu propriile sale argumente pro și contra, și într -o
anumită măsură, alegerea limbajului de programa re și a cadrului de dezvoltare va influența
arhitectura sistemului. Este dificil să pretindem că unul dintre ele va oferi rezultate mai bune
pe termen lung. Ceea ce este sigur, cu toate acestea, cu cat codul este scris mai bine, cu atat
mai ușor va fi ca acesta să fie adaptat și modificat în viitor.
O aplicație web este o aplicație software de tip client -server pe care clientul ( sau
interfață de utilizator) o execută într -un browser web.
În ceea ce prive ște diferența între un site web interactiv de orice fel și o aplicație web
nu este foarte clară. Site -urile web care pot fi văzute ca și aplicații web sunt cele care au funcții
similare cu o aplicație software pentru desktop, sau cu o aplicație mobile. HTML5 a introdus
un limbaj explicit pentru a face apl icații care sunt încărcate ca și pagini web, dar care pot stoca
date la nivel local și să funcționeze offline.
În procesul de dezvoltare a aplicației se vor folosi mai multe limbaje, și anume:
HTML/HTML5, MySQL, PHP, CSS/CSS3 si elemente de JavaScript. Pen tru verificarea
codului scris se va utiliza un server PHP si MySQL local, WAMP. Pentru editarea codului în
procesul de implementare se va folosi programul Notepad++ și Visual Studio Code , iar pentru
baza de date, programul phpMyAdmin . În etapa de dezvoltare, aplicația se va rula pe browserul
Google Chrome și se vor folosi diverse librării de cod open source pentru facilitarea anumitor
funcționalități.

8
Majoritatea aplicaților web sunt dezvoltate conform șablonului architectural
MVC(Model -View -Contro ller). Scopul acestu i bloc este de a separa modelul de date de
interfața cu utilizatorul(view), astfel încat schimbările de interfață să nu afecteze datele, iar
acestea să poată fii reorganizate fără schimbări de interfață. Componentele putând fii testate
independent unele față de altele.
Diagrama Fishbone permite evidențierea și ierarhizarea cauzelor care generează
dificultatea zonelor cu probleme, care au nevoie de informații suplimentare.
În figura de mai jos se vor prezenta cauzele ce au condus la ne cesitatea realizării unei
aplicații web de socializare.

Figura 2. Diagrama Fish -bone

Diagrama Pareto este folosită pentru a prioritiza cele mai relevante cauze și pentru a
ierarhiza obiectivele în funcție de importanța care este acordată acestora.

9
Diagrama de mai jos cuprinde problemele cel mai frecvent întâlnite atunci când este
utiliiza tă această aplicație web, precum și procentul din populație care întampină problema
respectivă.

Figura 3. Diagrama Pareto
Diagrama de descompunere a obiectivelor, generale și specifice, stabilite pentru
implementarea, este surprinsă mai jos : 0102030405060708090100
Transparența
datelorImposibilitatea
folosirii platformeiCresterea
numarului de
utilizatoriAccesul la Internet Supraîncărcarea
datelorDeținerea unui
smartphone051015202530354045Diagrama Pareto
Aparitii
Procentaj din 100%

10

Cresterea numarului
de clienti
Produs Sistem de gestiune Accesibilitate Promovare
Feedback de la
utilizatori
Usor de utilizat
cu un browser
webDispune de un
meniu usor de
navigat
Gruparea
evenimentelor pe
dataCautarea persoanei
dorite Configurarea bazei
de date
Salvarea datelorAccesul facil
asupra datelorReclameCresterea
vizibilitatii
Usor de creat
campanii
publicitare
Figura 4. Diagrama Obiectivelor

1.3. Cerințe de sistem
1.3.1 Surse de cerințe

În prezent, rețele sociale online, nu doar conectează foarte mulți utilizatori, dar, în
același timp, colectează cantități imense de informații asociate cu interacțiunile lor de zi cu zi.
Sursa cerințelor provine de la faptul că majoritatea persoanelor în prezent preferă aceasta
modaliatate de comunicare chiar dacă se afl ă la distanțe relativ mici în speci al pentru cei care
se afl ă la distanțe foarte mari și singura modalitate de comunicare fiind cea prin rețelele de
socializare si anume chat.
Rețelele sociale ajută la construirea relațiilor, în comunicarea cu alte persoane cu un
cost scăzut, ajută cu opo rtunitățile de carieră, la exprimarea gândurilor și sentimentelor. În
prezent oamenii petrec destul de mult timp pe site -uri de socializare, cum ar fi YouTube,
Facebook, Google+, LinkedIn, Facebook, Twitter rețea, etc., iar această utilizare se asociază
cu colectarea unui volum din ce în ce mai mare de date. Cu ajutorul site -urile de socializare se
pot conecta persoane cu alte persoane cu care s -a pierdut legătura dar și cu persoane noi.
Consider ca acest fapt fiind unul foarte important si motivează uti lizatorii să le folosească în

11
continuare, cu o frecvență ridicată. Pasul urmator va fii implementarea acestei aplicații web
care să poată satisfice nevoile utilizatorilor, fiind benefică datorită faptului că aceștia vor avea
posibilitatea de a -și organiza cu ușurință evenimente sau planuri cu prietenii în funcție de
propriul calendar totul facându -le online fără a necesita niciun cost. Este foarte important un
astfel de calendar mai ales că în prezent oamenii sunt foarte grabiți, timpul este foarte prețios
și este necesar pentru o bună organizare.
Totodata site -urile de rețele sociale permit utilizatorilor să împărtășească în același timp
idei, imagini, evenimente și interese cu persoane din rețeaua lor. Serviciile de rețele sociale
facilitează dezvoltarea r ețelelor sociale online prin conectarea profilului unui utilizator cu cele
ale altor utilizatori și / sau grupuri.
După ce specificațiile sunt stabilite, se poate trece la formularea cerințelor aplicației, la
care va contribui publicul țintă, urmărind astf el ca rezultatul să fie cât mai relevant pentru el.

1.3.2. Elicitația cerințelor

În procesul de dezvoltare al acestei aplicații părțile implicate sunt mai exact utilizatorii
și dezvoltatorul aceastei aplicati web. Persoanele care vor beneficia în urma a cestei aplicații
sunt cei care doresc să utilizeze aplicația și funcționalitățile ei pentru a fii conectați cu prietenii,
familia de la distanță sau pentru a putea creea evenimente în functie de calendarul prietenilor .
În ultimii ani se poate observa o de zvoltare rapidă a rețelelor sociale online și o creștere
a diversității lor atât din punct de vedere funcțional cât și al utilizatorilor. Varietatea de rețele
sociale online generează o cantitate imensă de date care pot fi utilizate pentru a face predicții
pe baza preferințelor utilizatorilor. În această lucrare au fost analizate mai multe aspecte ale
rețelelor sociale online ca surse de Big Data, cu accent pe instrumentele și sistemele cu care să
gestionăm datele masive provenite din Social Media.
Informaț ia digitală a pătruns în fiecare domeniu industrial sau de afacere și reprezintă în
momentul de față un element important. Unul dintre cele mai importante avantaje ale rețelelor
sociale este reprezentat de viteza foarte mare cu care utilizatorii obțin info rmații noi. Acest
lucru îi ajută să rezolve problemele într -un mod eficient, ceea ce poate fi de ajutor în situații
cât mai diverse.

12
Această aplicație va pune la dispoziție utilzatorilor posibilitatea de a creea un cont în
cazul în care nu au, sau de loga re în situația în care dețin deja un cont. Aceasta aplicație având
anumite funcționalități ca de exemplu adaugare de prieteni noi , creare evenimente în funcție
de calendarul și disponibilitatea prietenilor, precum și gestionarea de invitații.
Dezavantaj ul aplicației este reprezentat de existența pe piață a altor aplicații web care
oferă funcționalități similare, retelele sociale, precum Facebook , Twitter sau Google+ , au
mare succes în rândul utilizatorilor de internet. Un alt dezavanjat, ar fi, pentru inceput,
acomodarea cu noua interfață.
Analizând riscurile în urma dezvoltării acestei aplicații, constatăm faptul că există și se
vor dezvolta din ce în ce mai mult astfel de aplicații web deoarece numărul de utilizatori este
tot mai mare .
Pentu a putea extrage necesitățile stakeholder -ilor, vom folosi mai multe metode de elicitație a
cerințelor. Una din metode folosite este metoda interviului, iar a doua metodă folosită este
„modelul cazurilor de utilizare”, reprezentat prin diagrama Use -Case.
Metoda in terviului fiind utilizat ă pentru o bună înțelegere în legatură cu ceea ce trebuie realizat
și cum se va modifica serverul. Deoarece se dorește o înțelegere cât mai exactă a problemei
care trebuie rezolvată cu ajutorul acestui sistem informatic. Pe baza ră spunsurilor acestora,
putem să ne formăm o idee cam ce ar trebui schimbat și din care poate rezulta modelul cazurilor
de utilizare.
Diagrama cazurilor de utilizare este folosită pentru a indica sau caracteriza funcționalitățile și
comportamentul sistemului ce interacționează cu unul sau mai mulți actori .
Pentru metoda interviului, am ales câteva persoane care folosesc deja aplicații similare,
pentru a le putea pune câteva întrebări în legătură cu buna funcționare în dezvoltarea aplicație
dorite. S -a început printr -un set de întrebări generale, constructive pentru a afla mai multe
detalii despre aplica țiile existente.
Întrebările generale sunt următoarele:
1. Sunteți mulțumit de cum funcționează aplicațiile social media existente pe piață?
2. Ce îmbunatățiri ați a duce?
3. Care este motivul pentru care folosiți cel mai des aplicația?

13
4. Cât timp petreceți pe aceste tipuri de aplicații?
5. Întâmpinați erori când folosiți aplicația?
6. Considerati c ă interfa ța aplicației este una prietenoasa?Ce modificări ați aduce?
7. Ce avantaje c onstituie pentru dumneavoastră un site de acest fel?
8. Ce dezavantaje ați înt âlnit la folosirea unui astfel de site?
Întrebările sunt realizate pentru a identifica care este părerea unor persoane care folosesc deja
aplicații similare, ce îmbunatățiri ar aduc e în cazul acestor aplicați și ce nemulțumiri au în ce
privesc aplicațiile existente deja pe piață.
1.3.3. Modelul cazurilor de utilizare
Diagrama cazurilor de utilizare este o reprezentare la nivel conceptual a unei
interacțiuni dintre un actor și un sis tem, dar și a activităților care se produc și pe care sistemul
le face. Un caz de utilizare este o secvență a tranzacților realizate de un sistem ca răspuns la
evenimente declanșate de un actor sistemului și conține toate evenimentele care pot surveni în
cadrul perechii actor – caz utilizare.
Diagrama cazurilor de utilizare este folosită în general pentru a indica sau caracteriza
funcționalitățile și comportamentul sistemului ce interacționează cu unul sau mai multi actori.
Un actor poate fi un utilizator sau orice sistem ce poate interacționa cu sistemul modelat.
Atâta timp cât actorii reprezintă utilizatorii, ei ajută la construirea unei imagini clare a ceea ce
se așteaptă a se întampla în sistem. Cazurile de utilizare sunt construite pe baza nevoilor pe
care le au actorii(utilizatorii). Aceasta asigură faptul că sistemul va produce ceea ce s -a dorit.În
continuare vom evidenția modelarea cerințelor aplicației prezentate cu ajutorul diagramei de

14
utilizare .
Creare cont
Utilizator
neinregistratLogare
Utilizator
inregistratAdăugare prieteni
Creare eveniment
Chat
Gestionare invitațiiGestionare website
Administrator<<include >>

Figura 5. Diagrama cazurilor de utilizare
Diagramele de secvență cunoscute și ca MSC, prezintă temporal interacțiunile între obiecte
având rolul de a modela scenariile posibile, pentru a descoperi interfețele necesare fiecărui
obiect și pentru a valida fiecare interfață cu adevarat utilizată.
Descrierea cazurilor de utilizare:
• Înregistrare
Modul de utilizare al aplicației are un design simplu și ușor de înțeles pentru orice
utilizator. În cadrul aplicației este posibilă autentificarea pentru utilizatoru l care nu are un cont
creat, acesta va putea sa se autentifice, introducandu -și username -ul, email -ul și parola.
• Autentificare
În cazul în care utilizatorul are deja cont creat, în acelați modal, doar că în cadrul secțiunea
de „LOG IN”, acesta se va loga , introducandu -și username -ul si parola. Dacă utilizatorul isi
uita parola poate să și -o recupereze accesând secțiunea „LOST PASSWORD”.

15
• Navigare
După ce utilizatorul s -a înregistrat și s-a logat, acesta are posibilitatea s ă navigheze în
pagin ă cu ajutorul unui meniu foarte u șor de înțeles.
• Verificare cereri prietenie
Utilizatorul are posibilitatea de a verifica dac ă a primit cereri de prietenie de la alte
persoane.
• Trimitere cereri de prietenie
• Verificare de primire invita ții
• Creare evenimente sau planuri
Utilizatorul poate să își creeze anumite evenimente sau planuri și să socializeze cu prietenii
pe chat. Când utilizatorul dorește să creeze un eveniment sau plan, se va deschide un modal
în care utilizatorul va putea adăuga un nume evenimentului, o locație, să adauge prieteni
care vor primi invitații la acest eveniment și să adauge o descriere evenimentului.
• Gestionare cont
Administratorul contului poate vizualiza toate evenimentele cu fiecare data în parte precum
și prietenii virtuali, având opțiuni de edit are, ștergere și adăugare.
Scenariul de utilizare I: Vizitator al site -ului (user neautentificat)
Nr. Crt. Secțiune Explicații
1. Descriere La prima utilizare, fiecare
utilizator trebuie să se
înregistreze în sistem cu email,
nume si parolă.
2. Precondiție Vizitatorul deține un device care
se poate conecta la
internet/server: Wi-Fi sau mobile
data, cu un browser web.
3. Postcondiție Menținerea conexiunii la
server.Existenta internetului
trebuie sa existe pe toata
perioada folosirii aplicatiei.

16
4. Eroare posibilă Dispozitivul utilizatorului nu
este conectat la internet.Prin
urmare nu se poate conecta si
aplicatia nu ruleaza..
5. Situația sistemului în caz de
eroare Se afișează pe ecran un mesaj de
eroare, cum că nu s -a putut
conecta la server.
6. Actor Utilizator care vrea să folosească
platforma fiind user -ul
neînregistrat
7. Obiectiv Socializarea și cunoasterea de
oameni noi
8. Procese standard 1. Utilizatorul trimite o cerere
către serverul care
găzduiește aplicația.
2. Serverul îî răspunde cu un
mesaj care constă în afișarea
conținutului site -ului.
3. Utilizatorul poate să vadă
conținutul site -ului.
9. Procese alternative 1. Posibilitatea creării unui
cont, prin completarea unor
campuri obligatorii.
2. Navigarea cu ajutorul unui
meniu precum si
posibilit atarea de a creea
prietenii in mediul online.
3. Creearea de evenimente sau
planuri și socializarea cu
prietenii prin intermendiul
chat-ului.

Tabel 1. Scenariu de utilizare
Scenariul de utilizare II: Administratorul site -ului
Administratorul fiind persoana care a dezvoltat aceasta aplicatie, acesta având drepturi
de gestionare a conturilor precum și a bazei de date.
Nr. Crt. Secțiune Explicații
1. Descriere Exista o singură persoană care va
avea drepturi de administrator.

17
2. Precondiție Va avea acces la cod -ul site -ului
și la baza de date.
3. Postcondiție Menținerea în permanență
conexiunii cu serverul.
4. Eroare posibilă Erori de cod sau de autentificare
precum și în cazul uitării parolei.
5. Situația sistemului în caz de
eroare Se va afișa în browser un mesaj
de eroare cum că nu s -a putut
conecta la contul de
administrator.
6. Actor Administratorul
7. Obiectiv Gestionarea bazei de date și a
traficului din cadrul site -ului
8. Procese standard 1. Utilizatorul se conectează în
aplicație pe baza contului de
administrator
2. Administratorul poate
gestiona baza de date si
userii.
9. Procese alternative

Tabel 2. Scenariu de utilizare II
Diagrama de secvență are rolul de a evidenția interacțiunile actorilor cu sistemul,
desfășurate în timp. Din acest motiv, este folosită pentru documentarea scenariilor de testare.
În continuare voi evidenția diagrama de secvență pentru partea de autentificare a
utilizatorului.

18

:Login :Register :Date Base :Home Page
:Utilizator
2:Login () 1: isValid ()
5:Redirect ()4:isValid ()3:isRegister ()
6:Show Page ()
Figura 6. Diagrama de secvență pentru utilizare

1.4. Documentarea cerințelor

Conform informațiilor obținute la fazele anterioare, cerințele de sistem se obțin prin
aplicarea metodelor de elicitație prezentate. Fiind un document structurat care stabile ște
descrierea detaliată a funcțiilor sistemului, serviciilor oferite și a constr ângerilor operaționale.
Acestea se împart în două categorii: cerințe funcționale și cerințe calitative. Cerințele
funcționale conțin afirmații despre serviciile p e care sistemul trebuie să le conțină, cum trebuie
el să răspundă la anumite intrări și cum reacționează în anumite situații. Cerințele calitative
descriu felul în care funcționalitățile vor fi realizate de către sistem, fiind evitate cerintele
ambigue.

19
Cerință Prioritate Influențează Soluție
Logare 4 Utilizatorii Implementare pagină de
logare
Înregistrare 4 Utilizatorii Crearea unui formular
de înregistrare
Implementarea de liste
de prieteni 3 Utilizatori Implementarea
functionalitaților aceste
aplicații:
adaugare,stergere și
căutare
Creare evenimente

3 Utilizatori Creare eveniment cu
invitarea
persoanelor,transmiterea
de mesaj către
participanți.
Trimiterea de mesaje 4 Utilizatori Implementare chat între
utilizatorii înregistrați.

Tabel 3. Cerințele funcționale

Cerință Prioritate Influențează Soluție
Pentru utilizatori
Timp încărcare
pagină(în condițiile în
care ești conectat la
internet) 4 Utilizatorii
Utilizabilitate 4 Utilizatori
Interfață prietenoasă,
ușor de folosit.
Disponibilitate 3 Utilizatori
Aplicație gratuită,
accesibilă pentru
oricine. Să fie gazduită
pe un server care sa fie
online cât mai mult
timp

20
Pentru administrator
Mentenabilitate 4 Administrator Pentru ca problemele să
fie găsite mai ușor și
intr-un timp cât mai
efficient.
Portabilitate 3 Utilizatori,administrator Rulare pe orice browser
instalat în sistem

Tabel 4. Cerințele calitative

21
CAPITOLUL 2. ANALIZA ȘI DEZVOLTAREA SISTEMULUI
2.1. Procese și Activități

Prima impresie este mereu cea mai importantă atunci când un client vede un produs de care
este interesat. Dacă aspectul sau design -ul produsul nu este pe placul lui, șansele ca acel client
să se piardă sunt foarte mari.
Utilizatorul se înregistrează în cont. După înregistrare, datele acestuia îi merg în sistemul unde
sunt stocate toate datele persoanelor care și -au făcut cont. După logarea în cont, fiecare
utilizator poate naviga pe platformă și poate să socializeze cu prietenii și să iși creeze prietenii
noi și nu în ultimul rând să creeze evenimente în funcție de programul celeilalte persoane.
Această aplicație fiind foarte utilă în prezent și solicitată de majoritatea persoanelor indiferent
de vârstă. Se poate spune faptul că procentul cel mai mare îl reprezintă persoanele cu vârstă
între intervalul 25 -34, dar ea fiind folosită de majoritatea persoanelor, indiferent de vârstă. Ceea
ce se poate observa este faptul că rețelele de socializare au cei mai mulți tineri.
Tot ce v -am descris mai sus, este reprezentat mai jos in diagrama de procese și activități.

22

Procese si activitati
Utilizator Sistem
Inregistrare
Salvarea datelor
Logare
Cautare informatii
cerute
Returneaza rezultatulCautare prieteni
Adaugare prieteni
Creare evenimente
Figura 7. Diagrama de procese și activități

23
2.2 Tehnologii specifice

Tehnologiile folosite pentru implementarea unei aplicații cuprind straturile de
componente sau servicii care sunt folosite pentru a oferi o soluție software, fiind formate dintr –
o suma de API -uri, platforme, sisteme de operare, baze de date și componente care sunt puse
împreuna pentru construirea unui produs.
Nicio tehnologie nu este considerată mai bună decât alta, fiecare având propriile sale
particularități care o fac potrivită pentru o anumită clasă de probleme.
Fiecare limbaj de programare vine cu propriile sale argumente pro și contra,și într -o
anumită măsură, alegerea limbajului de programare și a cadrului de dezvoltare va influența
arhitectura sistemului. Este dificil să pretindem ca unul dintre ele va oferi rezultate mai bune
pe termen lung. Ceea ce este sigur , cu toate acestea , este că, cu cât codul este scris mai bine ,
cu atât mai ușor va fi să fie adaptat și modificat în viitor. [8]
Tehnologii Front -End
Partea de Front -End este mai ușoară, dat fiind faptul că opțiuniile de prezentare ale
conținutului în hy pertext sunt limitate. Mentinute de World Wide Web Consortium(W3C),
limbajul standard cu ajutorul căruia este afișat conținutul HTML, împreuna cu CSS -cel care
definește aspectul paginii. JavaScript este folosit pentru a ajuta la interacțiunea paginii cu
utilizatorul. Ceea ce merită utilizat în dezvoltarea parții de interfață a aplicațiilor web sunt
librăriile și framework -urile implementate. Aceastea se aleg în funcție de comportamentul
interfeței și modul în care se vor trimite și lua datele de la server.
Hyper Text Markup Language (HTML ) este limbajul standard de marcare folosit
pentru a crea pagini web. Împreuna cu CSS și JavaScript, HTML este o tehnologie de bază
utilizată pentru a crea pagini web[8], precum și pentru a crea interfețe cu utilizatorul pe ntru
aplicații mobile și web. Browserele Web pot citi fișiere HTML și să le transforme în pagini
web vizibile. HTML descrie structura unui site web, acest lucru făcându -l un limbaj de marcare,
mai degrabă decât un limbaj de programare. Elementele HTML form ează blocurile de pagini
HTML, care permit imagini și alte obiecte să fie integrate în pagină și care pot fi folosite pentru
a crea formulare interactive. Elementele HTML sunt delimitate de tag -uri, scrise paranteze
unghiulare.

24
Tag-uri cum ar fi <img/> ș i <input/> introduc direct conținutul în pagină. Altele, cum ar fi
<p>…</p> furnizează informații cu privire la textul documentului și pot include și alte etichete
ca sub -elemente. Browserele nu afișează etichetele HTML, dar le folosesc pentru a interpreta
conținutul paginii. HTML poate încorpora script -uri scrise în alte limbaje, cum ar fi JavaScript
care afectează comportamentul paginilor web HTML.
HTML -ul este format din ai multe componente cheie, inclusiv cele numite etichete (și
atributelelor) tipuri de baze de date bazate pe caractere, referințe la caractere și referințe la
entități. Tag -ul HTML, cel mai frecvent vin din perechile, cum ar fi <h1> și </h1>(nu toate
elementele au perechi, de exemplu <img>). Primul tag într -o astfel de pereche este tag -ul de
start, iar al doilea este tag -ul final(acestea sunt numite, de asemenea, tag -uri de deschidere și
închidere).
HTML5 este un limbaj pentru structurarea și prezentarea conținutului pentru World
Wide Web, o tehnologie nucleu pentru Internet propusă iniț ial pentru software -ul Opera. [9]
Este a cincea revizuire a standardului HTML, obiectivele sale principale fiind acelea de a
îmbunătăți limbajul cu un suport pentru cele mai recente apariții multimedia în același timp
menținându -l ușor de citit de oameni ș i bine înțeles de computere și device -uri.
HTML5 mai oferă un suport pentru StyleSheet, astfel că se pot folosi stiluri scrise în CSS3
pentru formatarea elementelor din pagină.
CSS(Cascading Style Sheets) este un limbaj de stil folosit pentru a descrie fo rmatarea
și aspectul unui document scris într -un limbaj de markup. Acesta este cel mai des folosit pentru
stilizarea paginilor web în HTML sau XHTML.
Stilurile se pot atașa elementelor HTML prin intermediul fișiere externe sau in cadrul
documentului, pri n elementul <style> și /sau atributul style. CSS se poate utiliza și pentru
formatarea elementelor XHTML, XML și SVGL.
Împreuna cu HTML și JavaScript, CSS este o tehnologie de bază folosită de cele mai
multe site -uri web pentru a crea interfețe cu utiliza torul pentru aplicații web și pentru aplicații
mobile.
CSS este destinat în primul rând separării conținutului de stilizarea acestuia, cum ar fi aspectul
conținutului, culorile și fonturile. Această separare poate îmbunătăți accesibilitatea
conținutului, oferă mai multă flexibilitate și control în specificarea caracteristicilor de

25
prezentare, precum și permite ca mai multe pagini HTML să partajeze formatarea prin
specificarea CSS -ului într -un fișier .css separat, și reduce repetarea în conținutul structura l.
Această separare între formatare și conținut face posibilă afișarea paginii de web în mod diferit,
în funcție de dimendiunea ecranului sau a dispozitivului pe care acestă este vizualizat.
Modificările aduse design -ului grafic al unui document pot fi apl icate rapid și ușor , prin
editarea câtorva linii în fișierul CSS pe care îl folosesc, mai degrabă decât prin schimbareaîn
documente.
CSS-ul are o sintaxă simpla și ușoară, folosind un număr de cuvinte în engleză pentru
a specifica numele diverselor propr ietăți de stil.
Înainte de a apărea CSS, toate culorile de fonturi, stiluri de fundal, aliniamentele de
elemente, borduri și dimensiuni trebuiau să fie descrise în mod explicit, de multe ori în mod
repetat,în HTML. CSS permite să mute o mare parte din ac este informații într -un alt fișier,
rezultând un HTML considerabil mai simplu.

Tag#an_id {
.
}
Tag.a_class {
….
} <tag class = a_class >
</tag>
<tag id = an_id >
</tag>
<tag class = a_class >
</tag>
<tag class = a_class >
</tag>CSS HTML

Figura 8. Stilizarea tag -urilor HTML
Aplicațiile actuale au ca obiectiv funcționarea pe orice divice, fie el smartphone, tablet sau
desktop. Cu ajutorul CSS3 există posibilitatea de a modifica stilurile applicate elementelor în
funcție de dimensiunea ecranului. Modulele cele mai importante ca re au fost adăugate în CSS3
și care până în prezent au adus un plus valoare în cee ace privește dezvoltarea activității de

26
web-design sunt: Selectors, Backgrounds and Borders, Box Model, Image Values and Replace
Content, Text Effects, 2D/3D Transformations , Animations, Multiple Column Layout și User
Interface.
JavaScript este un limbaj de programare de nivel înalt, netipizat .[10]. Alături de
HTML și CSS, acesta este unul dintre cele trei tehnologii de bază de producție mondială de
conținut Wide Web, majori tatea site -urilor îl folosesc și este susținut de toate browserele
moderne fără plug -in-uri.
Fiind folosit pentru scriptarea paginilor web prin adăugarea de funcționalități în cadrul lor. Este
folosit, de asemenea pentru verificarea datelor introduse de u tilizator, crearea meniurilor și
altor efecte animate. Limbajul este binecunoscut pentru folosirea sa în construirea site -urilor
web, dar și pentru accesul la obiecte încastrate în alte aplicații.
Se poate spune faptul c ă între limbajul JavaScript și Java exista asemănări exterioare, inclusiv
numele limbajului, sintaxa și bibliotecile standard, cele doua limbaje distincte, diferă foarte
mult în designul lor.
De asemenea JavaScript poate fii folosit pentru documente PDF, widget -uri desktop și
aplicații web server -side. Fiind folosit in dezvoltarea jocurilor, creearea de aplicații desktop și
mobile, precum și programare de rețea de server -side cu medii de rular e, cum ar fi Node.js.
JQuery este o bibliotecă populară in JavaScript fiind folosită în zilele noastre având
calitatea de a fi cross -platform și gratuită. A fost concepută pentru a ajuta la simplificarea
script -urilor client -side. Principalul beneficiu a l librăriei este acela că facilitează navigarea în
document, ajută la selectarea elementelor din DOM, la crearea animațiilor, a manipulării
evenimentelor, și faptul că lucrează cu AJAX.
Mai oferă, de asemenea capacități de dezvoltare a aplicașilor și pagin ilor web dinamice.
Bootstrap este un framework liber și open -source pentru proiectarea site -urilor și
aplicaților web. Aceasta conține template -uri de design CSS și HTML pentru formulare,
butoane, navigare și alte componente de interfață precum si extensi i opționale JavaScript.
Bootstrap are elemente prestabilite, cu stiluri deja definite care pot fi puse direct în aplicație.
Noile versiuni au introdus grid sistem care se ocupă de reorganizarea elementelor și stilizarea
lor ăn funcție de marimea ecranului. Odată puse acele clase specifice, bootstrap se ocupă de

27
verificarea media query -urilor în locul programatorului, acest lucru făcând design -ul aplicației
să fie unul responsive. [9]

Tehonologii Back -End
Separarea sistemelor software în partea de Back -End și cea de Front -End ajută la
dezvoltarea mai rapidă a aplicației. Partea de Back -End se ocupă cu lansarea programelor
sistemului de operare ca răspuns a cerințelor clientului care interactioneaza cu partea de Front –
End.
Față de Front -End, Back -End-ul are un câmp mult mai mare când vine vorba de
tehnologii. Cele mai comune sarcini ale unei aplicații web se constituie în accesarea,interogarea
unor baze de date și afisarea rezultatelor la web server și mai apoi catre browser.Într -un astfel
de scenariu cel ma i des intalnit se poate folosi orice limbaj de programare, asta deoarece
majoritatea limbajelor au posibilitatea de implementare a unei comunicări cu bazele de date.
La realizarea părții de back -end am utilizat PHP (HypertextPreprocessor), iar pentru crear ea
bazei de date, MySQL.
PHP este un limbaj de programare folosit initial pentru a produce pagini web dinamice,
acum fiind folosit pe scară largă în dezvoltarea paginilor și aplicațiilor web. Codul PHP poate
fi incorporat în codul HTML, sau poate fi utili zat în combinație cu diverse sisteme de template –
uri web, sistem de management al conținutului web și al unor framework -uri. PHP este simplu
de utilizat, fiind un limbaj de programare structurat, ca și C -ul, Perl -ul sau începând de la
versiunea 5 chiar Jav a, sintaxa limbajului fiind o combinație a celor trei. Una din cele mai
importante facilități ale limbajului este conlucrarea cu majoritatea bazelor de date relationale,
de la MySQL și până la Oracle, trecând prin MS Sql Server, PostgreSQL sau DB2.
PHP poa te rula pe majoritatea sistemelor de operare, de la UNIX, Windos, sau Mac OS X si
poate interactiona cu majoritatea serverelor web.Codul PHP este interpretat pe serverul WEB
si genereaza un cod HTML care va fi vazut de utilizator (clientul -browserului fii ndu-i transmis
numai cod HTML).
PHP foloseste extensii specifice pentru fisierele sale: .php, .php3, .ph3, .php4, .inc, .phtml.

28
Aceste fișiere sunt interpretate de către serverul web iar rezultatul este trimis în formă de text
sau cod HTML către browser cl ientului.[12]
Un script PHP este executat pe server, iar rezultatul HTML simplu este trimis inapoi la browser.
Un script PHP poate fi plasat oriunde in document si incepe cu <php si se termina cu ?>:
<?php
//codul php vine aici
?>
Exemplu de cod PHP pe ntru partea de logare din propria aplicatie:
if (isset($_POST[‘login’])) {
if (isset($_SESSION[“userid”])) {
Session_unset();
}
$request = $_POST[‘login’];
$conn = new mysqli ( $servername, $username, $password, $dbname);
//Creare conexiune(Create conn ection)
if ($con ->connect_error){
//Verificare conexiune(Check connection)
die(“Connection failed: “ . $conn ->cnnect_error);
}
$credentials = explode(“;”, $request);
$sql = “select iduser, username, online from users where username = ‘”;
$sql .= $credentials[0];
$sql .= “’ and password = ‘”;

29
$sql .=$credentials[1] . “’”;
$result = $conn ->query($sql);
if($result ->num_rows > 0){
$_SESSION[“userid”] = $result ->fetch_row()[0];
//output data of each row (datele de iesire pentru fiecare rand)
$id = $ result ->fetch_row()[0];
$name= $result ->fetch_row()[1];
$online = $result ->fetch_row()[2];
Echo $credentials[0];
}
else echo “Login failed, incorrect username or password. Please revisit your
credentials”;
$conn ->close();
}
MySQL este un sistem de ges tiune a bazelor de date relaționale, fiind cel mai popular
SGBD open -source la ora actuală [13]. Este folosit cel mai des împreuna cu limbajul de
programare PHP, cu ajutorul lui MYSQL se pot construi aplicații în orice limbaj major. Putem
spune faptul că M ySQL este una din cele mai cunoscut sistem de baze de date folosit pentru
utilizarea în aplicații web, fiind și o componentă centrală a stivei LAMP(“Linux, Apache,
MySql, Perl/PHP/Python”) utilizată pe scară largă.
MySql este folosit cel mai des cu limbaj ul de programare PHP, ceea ce se poate spune este
faptul că datorită acestui sistem de gestiune se pot construi aplicații în orice limbaj major.
Schemele API care sunt disponibile pentru MySql și permit scrierea aplicațiilor în numeroase
limbaje de program are a putea accesa baya de date din MySql, ca de exemplu: C, C++, C#,
Java, PHP, etc, fiecare din cele enumerate folosing un anumit tip specific de API.

30
Este foarte important un aspect în ceea ce privește MySql și anume faptul că nu vine cu
un instrument implicit GUI(interfața utilizator) pentru a administra bazele de date, însă există
numeroase instrumente folosite pentru a le administra. Dintre acestea cel mai utilizat este
phpMyAdmin deoarece este dezvoltat în PHP și include striva Apache, MySql, PHP, î nsă
există și alte instrumente care pot administra bayele de date precum MySQL Workbench,
DBEdit, Libre Office Base.

31
CAPITOLUL 3. ANALIZA BAZEI DE DATE
3.1 Structura tehnică a datelor
O bază de date, uneori numită și bancă de date (abreviat BD), reprezintă o modalitate de
stocare a unor informații și date pe un suport extern (un dispozitiv de stocare), cu posibilitatea
extinderii ușoare și a regăsirii rapide a acestora. [20]. Bazele de date pot stoca de asemena
informații despre persoane, produse sau despre orice altceva.
Scopul unui sistem care gestionează o bază de date este să reducă distanța între informații și
date și de a oferi utilizatorilor o vedere abstractă a datelor, ascunzând detalii despre cum sunt
stocate și manipulate datele. [18]
Procesul de proiectare al bazei de date trebuie s ă reprezinte o descriere abstractă ș i generală a
cerințelor beneficiarilor, care urmează să fie reprezentată în baza de date.
3.1.1. Scenariul explicativ al bazei de date
În acest scenariu este prezentată o aplicație de socializare, scopul fiind acela de a ajuta oamenii
sa interacționeze mult mai ușor și de a crea prietenii în mediul virtual și ulterior real.Fiind în
prezent tot mai solicitată astfel de aplica ții.
Baza de date pentru acestă aplicație conține date despre utilizatori acestei aplicații, prieteniile
care și le creează precum și evenimentele planificate . În ceea ce privește tabela mesaje, fiecare
utilizator are posibilitatea de a face schimb de mesaje cu un alt utilizator al aplicației printr -un
chat.
Va exista o structură a acestei baze de date și anume:
• Vom crea 5 entități: user, events, message, tagged și friendship.
• Fiecare entitate conține un număr de atribute ce va fi evidențiat în cele ce urmează.
• Vom crea relații între cele 5 entități astfel încât să eliminăm redundanța pentru
obținerea rezultatele dorite.

32
3.2. Baze de date relaționale
Bazele de date relaționale sunt un tip de baze de date în care datele, văzute ca și atribute ale
entităților reale, sunt socate în tabele și sunt legate între ele prin relații.
Acest mod de structurare a datelor, bazat pe legături într e date, permite eliminarea redundanței,
astfel încât stocarea și, mai ales, modificarea unei informații se face într -un singur loc, iar, din
punct de vedere funcțional, această structură permite regăsirea, filtrarea, ordonarea și agregarea
datelor, în mod natural. [18]
Cel mai popular limbaj de programare este SQL (Structured Query Language) care este un
limbaj de programare specific pentru manipularea datelor în sistemele de manipulare a bazelor
de date relaționale (RDBMS). Permite inserarea datelor, actualizare și ștergere, modificarea și
crearea schemelor, precum și controlul accesului la date.
În Diagrama Entitate -Relație am prezentat cele mai utilizate entități din baza de date, de la
care am pornit proiectarea bazei de date

33

Friendship
MessageUser
TaggedEvent
iduser PKidfriend PK
status idmsg PK
from FK
timestamp to FKiduser PK
username
email password
online
idstory PK
iduser FKidevent PK
iduser FK
datetime location
durationname
username

Figura 9. Diagrama ERD

DIAGRAMA ENTITATE -RELAȚIE (ERD)

34
Tabelele de mapare
USERS (USR)
Tip cheie Opționalitate Nume
coloană Observații
CP * iduser Este un identificator unic artificial pentru
putea identifica un anumit user dupa acest
identificator
* Username
* Password
* Email
* online

EVENTS (EVT)
Tip
cheie Opționalitate Nume coloană Observații
CP * idevent Idevent este important pentru a putea
identifica persoana c ărui user ii apartine
* Name
* Location
* Datetime
* Username
* Duration
CS * iduser Relatie cu tabela USERS (USS)

FRIENDSHIPS (FSP)
Tip
cheie Opționalitate Nume coloană Observații
CP * Idfriend Idfriend este important pentru a identifica
cu ce persoane suntem prieteni
* Status
CS1 * iduser Relatie cu tabela USERS (USR )

MESSAGES (MSE )
Tip
cheie Opționalitate Nume coloană Observații
CP * Idmsg Identificatorul idmsg fiind cheia primară
important pentru a identifica userii care fac
schimb de mesaje.
CS1 * From
CS2 * to
* Timestamp

35

TAGGED (TGD )
Tip
cheie Opționalitate Nume coloană Observații
CP * Idstory
CS * iduser Relatia cu tabela USERS

Tabel 5. Tabela de mapare

36
CAPITOLUL 4. PROIECTAREA SISTEMULUI INFORMATIC

4.1. Proiectarea logica

În ceea ce privește această aplicație, prelucrarea datelor la nivel de sistem este centralizată.
Această modalitate prezintă mai multe avantaje, cele mai importante fiind urmatoarele:
• deoarece datele nu trebuie aduse din alta parte,iar în cazul în care ar trebui aduse timpul
ar fii unul destul de mare;
• datele sunt memorate o singură dată pentru toată baza de date;
• datele sunt unice, astfel că nu există duplicate
Un alt avantaj al abordării acesteia îl constituie posibilitatea aplicării restricțiilor de securitate:
pot fi impuse restricții la nivelul fiecărui utilizator și pentru fiecare tip de dată. În felul acesta,
integritatea datelor este mai ușor de asigurat.
Descrierea proiectării logice va fi realizată cu ajutorul diagramei de flux de date. Aceasta
prezintă circuitul datelor și transferul de date ce are loc între procese, adică sarcinile pe care
sistemul trebuie sa le poată realiza .

4.1.1 Arhitectura Sistemului

Arhitectura sistemului este un model client -server în care interfața, procesul funcțional
și stocarea datelor snt dezvoltate și menținute ca module independente. Modelul client -server
este o structură sau arhitectură distribuită care partajează procesarea între furnizori de servicii
numiți servere și elemente care solicită servicii numite clienți. Clienții și serverele comunică
printr -o rețea de calculatoare, de obicei prin Internet, având suporturi har dware diferite, dar pot
rula și pe același sistem fizic. Un server (fizic) rulează unul sau mai multe programe server,
care partajeayă resursele existente cu clienții. Clientul nu partajează niciuna dintre resursele
proprii, ci apelează la resursele server ului prin funcțiile server. Clienții inițiază comunicația cu
serverele și așteaptă mesajele acestora. Pentru menținerea legăturii între cei doi, indiferent de
pauzele care intervin, se folosește conceptul de sesiunem care de obicei este limitata în timp .

37
Calculatorul client este acela care interacționează cu un utilizator și care în majotitatea
tipurilor de arhitecturi client -server are doua sarcini: logica prezentării(interfața cu utilizatorul)
și logica aplicației(afacerii). Într -o aplicație client/server , clientul conține partea de prezentare(
afișarea folosind o interfață prietenoasă), lucrul efectuat de aplicație ( calcule, algoritmi) și
manipularea datelor( conectivitatea cu bazele de date).
Logica prezentării se referă la acea parte a programului care asigură coordonarea
interacțiunii dintre utilizator și aplicație și include detalii privitoare la afișarea tuturor
informațiilor pe ecranul calculatorului. De asemenea, mai include partea de preluare a datelor
de la utilizator.
Logica aplicației (afaceri i) se referă la acea parte a programului care decide ce acțiuni
trebuie să se execute în diferite situații și ea implementează regulile afacerii. Această parte mai
este denumită uneori și logica afacerii deoarece ea reprezintă acea porțiune din program car e
implementează regulile afacerii (business rules). În funcție de tipul arhitecturii client/server
logica aplicației poate fi plasată în totalitate pe calculatorul server, sau ea poate fi împarțită
între client și server .
CLIENTInterfața cu utilizatorul
Logica aplicațieiCLIENT
Mjloc de comunicațieSERVER
Baya de date
Logica aplicației
Mijloc de comunicație

Figura 10. Modelul client/server pe două niveluri

În ceea ce privește arhitectura sistemului este compusă din trei nivele, acestea fiind nivelul
inferior, nivelul logic si nivelul superior.
Nivelul inferior, ce poartă denumirea și de nivelul de informații sau nivelul de date,
menține datele aplicației. Acesta cuprinde serverul de baze de date MySql în cadrul căruia se

38
stochează datele necesare desfășurării activității. Pentru a realiza operațiile asupra bazei de date
se folosesc in terogările, cu ajutorul cărora sunt extrase date care vor fi ulterior trimise la nivelul
de prezentare.
Nivelul logic, sau nivelul intermediar, este reprezentat de aplicație. Aceasta este
găzduită de un server Apache care coordonează și procesează cereril e venite de la utilizator.
Nivelul logic primește solicitări de la utilizatori prin nivelul de prezentare (cum este solicitarea
de vizualizare a unor produse), apoi prelucrează și procesează informațiile din nivelul de date,
urmănd ca să trimită rezultatul înapoi la utilizator. Tehnica de comunicare între nivelul de
prezentare și aplicație este protocolul HTTP, iar metodele de comunicare utilizate între server
și client sunt GET și POST. Metoda POST este folosită în transmiterea de date confidențiale
ce nu pot fi găsite în URL, iar metoda GET este folosită pentru restul cererilor. Protocolul TCP
este cel care face realizabilă transferul acestor date.
Nivelul superior, numit și nivelul client sau nivelul de prezentare, este interfața care îl
ajută pe utiliza tor să interacționeze în mod direct cu aplicația. Pentru ca aplicația să poata fi
lansată, se utilizează un browser aflat pe calculatorul utilizatorului. Acest nivelul are rolul de a
transmite cereri către server și de a prelua date de la nivelul inferior. Nivelul client afișează
datele obținute din nivelul logic.
Figura 11. Arhitectura multi -nivel
Majoritatea aplicațiilor web sunt dezvoltate conform șablonului arhitectural MVC(Model –
View -Controller. Scopul acestui șablon este de a separa modulul de date de interfața cu
utilizatorul(view), astfel încât schimbările de interfață să nu afecteze datele, iar acestea să poată
fii reorganizate de interfață. Arhitectura MVC rezolvă această problemă prin decuplarea

39
accesului la date și a logicii aplicației de prezentare a datelor și interacțiunea cu utilizatorul,
introducând o componenta intermediară, numita C ontroller.
• Controller -ul este responsabil cu preluarea cererilor de la client (cereri GET/POST
emise pe baza acțiunilor utilizatorului) și gestionează resursele necesare satisfacerii
cererilor. Uzual, această va apela un model conform acțiunii solicitate ș i va selecta un
view corespunzator.
• Modelul desemnează datele și regulile referitoare la date, și anume, concepte vizând
aplicația web. Aceasta ofera controller -ului o reprezentare a datelor solicitate și e
responsabil cu validarea datelor menite a fi stocate.
• View -ul furnizeaza diverse maniere de prezentare a datelor furnizate de model view
controller. Pot exista view -uri multiple, alegerea lor fiind realizata de controller.
Arhitectura generică a unei aplicații web va consta dintr -un set de resurse referitoare la
controller, model și view. Uzual, framework -il web folosit impune o anumita structură a
fișierelor aplicației ce va fi implementată.

Figura 12. Diagrama arhitecturii Model -View -Controller

40

4.1.2 Baza Informațională

O bază de date se formează în momentul în care o persoană își face cont, deoarece informațiile
acestuia intră într -o bază de date secundară, pentru a știi pe viitor informațiile persoanelor când
vor să se logheze în cont.
Baza informațională care este utilizată în această lucrare este următoarea:

Figura 13. Baza informațională

Baza informațională este în strânsă legătură cu sistemul decisional și cu cel operational. Din
sistemul decizional vin informațiile, care apoi merg in baza de informații, care apoi se
transformă în servicii prin intermediul sistemului operational.

41
4.2 Proiectarea tehnică

Informațiile care se găsesc în baza de date sunt reprezentate sub formă de tabele, așa
cum se regăsesc în baza de date. În ceea ce privește tabelele, asupra lor se pot executa
intrucțiuni de manipulare a datelor pentru obținerea rezultatelor necesare utilizatorului. Astfel,
relațiile dintre tabele sunt bazate pe chei primare și cheile secundare aferente fiecărei tabele,
fiind necesar ca tipul de date al cheii secundare s ă fie același cu cel al cheii primare. Inițializarea
datelor este făcută în funcție de tipul ce a fost definit anterior. Principalele tipuri de date folosite
sunt “Integer” și “Varchar”. Tipul “Integer” conține valori numerice întregi și este stocat pe 4
octeți, iar ”Varchar” este un string și poate conține șiruri de până la 255 de caractere.
Atunci când se dorește deschiderea aplicației în browser, utilizatorului îi va apărea un modal
de login cu mai multe funcționalități, precum: login, register și forgot password.
În cazul în care utilizatorul dorește să se înregistreze, neavând încă un cont, acesta va complete
câmpul pentru username, email și password, iar urmatorul pas fiind aapăsarea butonului
“REGISTER”.
Constrângeri în ceea ce privește câmpul usernam e :
-Trebuie să fie unic
-Este case -sensitive
-Nu poate fi null
-Nu poate să fie șir vid
-Trebuie să înceapă cu caractere alfabetice
-Lungimea maximă este de 20 de caractere
-Lungimea minima este de 6 caractere
-Poate să conțină simboluri speciale cum ar fi “.”,”_”, “ -“.
-Nu poate să conțină alte caractere înafară de litere și cifre.
Constrângeri în ceea ce privește password -ului:
-Este case -sensitive

42
-Nu poate să fie null
-Nu poate să fie șir vid
-Lungimea minima este de 8 caractere dintre ca re minim o cifră și minim un simbol
-Lungimea maximă este de 30 de caractere
-Poate să conțină simboluri speciale UTF -8
Constrângeri ale emai -ului:
-Trebuie să fie unic
-Este case -sensitive
-Nu poate să fie null
-Nu poate să fie șir vid
-Trebuie să înceapă cu caractere alfabetice
-Lungimea minima este de 10 caractere
-Lungimea maximă este de 30 de caractere
-Poate să conțină simboluri speciale cum ar fi “.”, “_”, “ -“, “@”.
-Nu poate să conțină alte caractere înafară de litere și cifre
La declanșare a butonului “REGISTER” se va face apelul funcției singup care are urmatoarele
precondiții:
-câmpurile pentru username, email și password sunt validate pe baza constrângerilor de
mai sus
-inputurile sunt valide după apelul funcției CRSF ( Cross -Site Request Forgery) care
parcurge input -urile și verifică dacă acestea conțin cod javaScript
-inputurile sunt valide după apelul funcției sqlInjection care parcurge input -urile și
verifică dacă aceastea conțin cod sql

43
Parametrii acestei funcții se preiau dynamic din câmpurile aferente. În urma validării datelor
se declanșează un request jquery -ajax asincron către server și se trimit input -urile username,
password și email separate prin “;”. După executarea pe server a request -ului , în caz de succes,
clientul primeșt e id-ul user -ul și username -ul separate prin “;” aduse de pe server. Astfel, în
caz de eroare, clientul primește notificare cu textul erorii. În cazul server -ului, la declanșarea
butonului, acesta caută în tabela “Users” din baza de date un user cu datele primite de la client.
Dacă există deja username -ul sau email -ul se aruncă eroare, iar dacă nu este găsit, server -ul
înregistrează un nou user, răspunde cu id și username și setează ca variabilă de sesiune id -ul
username -ului $_SESSION[“userid”]. Din aces t moment se reține cine utilizează aplicația și
orice request care urmează așteaptă ca variabila de sesiune să fie setată și aruncă eroare în caz
contrar.
if (!isset($_SESSION[“userid”])) {
echo “You must be logged in to do this”;
return;
}
În cazul în care utilizatorul dorește să se logheze, având deja un cont, acesta va complete
câmpul pentru username și password și va apăsa butonul “LOGIN”. La declanșarea butonului
“LOGIN” se face apelul funcției login care are urmatoarele precondiții:
-câmpurile pentru username și password sunt valide pe baza constrângerilor de mai sus
-inputurile sunt validate după apelul funcției CRSF ( Cross -Site Request Forgery) care
parcurge input -urile și verifică dacă acestea conțin cod javaScript
-input urile sunt validate după apelul funcției sqlInjection care parcurge input -urile și
verifică dacă aceastea conțin cod sql
La fel ca și funcția de înregistrare, parametrii acestei funcții se preiau dinamic din câmpurile
aferente. În urma validării datelor s e declanșează un request jquery -ajax asincron către server
și se trimit input -urile username și password prin “;”. După executarea pe server a request -ului,
în caz de success, clientul primește id -ul user -ului separate prin “;” aduse de pe server. Altfel,
în caz de eroare, clientul primește notificare cu textul erorii. În cazul server -ului, la declanșarea
butonului, acesta caută în tabela “Users” din baza de date un user cu datele primite de la client.

44
Dacă sunt găsite deja,server -ul răspunde cu un id și us ername și setează ca variabila de sesiune
id-ul username -ului $_SESSION[“userid”]. Din acest moment se reține cine utilizează aplicația
și orice request care urmează așteaptă ca variabila de sesiune să fie setată și aruncă eroare în
caz contrar. În cazul î n care serverul nu găsește datele primate de pe client, clientul primește
mesaj de eroare.
În cazul în care utilizatorul își uită parola și dorește să și -o revendice, acesta va complete
câmpurile pentru email din secțiunea “LOST PASSWORD?”. La declanșare a butonului
“SEND” se face apelul funcției lostpassword care are urmatoarele precondiții:
-câmpurile pentru email este valid pe baza constrângerilor de mai sus
-inputul este valid după apelul funcției CRSF ( Cross -Site Request Forgery) care
parcurge inputu l și verifică dacă acesta conține cod javaScript
-inputul este valid după apelul funcției sqlInjection care parcurge inputul și verifică
dacă acesta conține cod sql
În cazul în care utilizatorul dorește să adauge prieteni se va apela funcția getFriends
care declanșează un request jquery -ajax asincron către server. După executarea pe server a
request -ului, în caz de success se vac rea dynamic un element <li> în lista de prieteni pentru
chat [idprieten1:numeprieten1:profilephoto1, idprieten2:numeprieten2: profilephoto2,…].
Altfel, clientul primește notificarea cu textul erorii. În cazul server -ului, când utilizatorul
trimite o cerere de prietenie unui alt utilizator, se caută în tabelul “Friendships” din baza de
date toate perechiile ce conțin id -ul user -ului curent(iduser, idfriend) sau (idfriend, iduser) cu
statutul “friend”. După ce se caută în tabelul “Users” id -ul egal cu idfriend se ia numele și poza
userului cu id -ul respectiv, iar ulterior se returnează o
listă[idfriend:namefriend:photofriend,…].
Tot în ceea ce privește utilizatorul poate să primească cereri de prietenii de la alți
utilizatori, iar în acest ca z se va apela funcția getFriendRequests care declanșează un request
jquery -ajax asincron către server. După executarea pe server a request -ului, în caz de success
clientul primește o listă de prieteni [idprieten1:numeprieten1, idprieten2:numeprieten2,…]. Se
creează o listă cu personae poză/nume și trei butoane pentru fiecare: accept, reject, ignore. În
caz de eroare, clientul va primi o notifica re cu textul erorii. În cazul server -ului se caută
“Friendships” toate perechiile ce conțin id -ul user -ului current cu status “pending”. Se caută în

45
tabelul “Users” id -ul egal cu idfriends și se ia numele user -ului cu id -ul respective, iar apoi se
returnea ză [idfriend:namefriend,…].
Utilizatorul va avea posibilitatea să primească invitații la diferite evenimente. În acest
caz se va apela funcția getInvitationRequest care declanșează un request -ajax asincron către
server. După executarea pe sever a request -ului, în caz de success clientul primește o listă de
invitații[inv1, inv2,…], iar fiecare invitație va avea doua butoane: Going, Not going. În cazul
server -ului se va căuta în tabelul “Invitations” toate perechile ce conțin id -ul user -ului current
(ideven t, iduser), iar în tabelul “Events” se va căuta evenimentul cu id -ul egal cu idevent și se
va returna o listă [event1, event2,…].
La sfârșit, când utilizatorul dorește să se logheze, se va declanșa butonul “LOGOUT”
și se va face apelul funcției logout. În acest caz nu se trimit date de la client la server,
declanșându -se un request jquery -ajax asincron către server. După executarea pe server a
request -ului, în caz de success clientul este rerutat la pagina php de login, iar în caz contrar
clientul primește notificare cu textul erorii. În cazul server -ului se distruge variabila de sesiune
și sesiunea.

46
CAPITOLUL 5 . IMPLEMENTAREA ȘI TESTAREA APLICAȚIEI

5.1 Implementarea aplicației

Această a plicați e trebuie să se concretizeze într -o pagină web dinamică pentru a putea
gestiona mai multe subpagini ale utilizatorilor. Fiecare utilizator având posibilitatea de a crea
un cont pe website sau de logare , ulterior de a -și personaliza propria pagină prin adăugare de
informații personale precum adăugare ș i ștergere prieteni, creare plan și chiar de a face schimb
de mesaje cu prietenii. Aplicația este creată în mai multe limbaje, acestea fiind: HTML,
JavaScript, PHP și MySql
Trebuie să parcurgem mai multe etape pentru implementarea acestei aplicații.

5.1.1. Instalarea și configurarea serverului WAMPP

Primul pas a fost descărcarea gratuită a pachetului de pe site -ul:
http://www.wampserver.com/en/download.php . După ce a fost descărcat și dezarhivat
executabilul WAMPP, în mod implicit programul se va instala în C: \wampp64, iar în folderul
www care se află in cadrul folderului wampp64 am creat un folder unde am realizat aplicația.
WAMPP reprezintă un mediu de dez voltare PHP, fiind o distribuție Apache ce contine MySql,
PHP precum și PhpMyAdmin care ne va ajuta la gestionarea bazelor de date printr -o interfață
vizuală(GUI). După ce softul este pornit, putem testa dacă serverul Apache rulează accesând

47
adresa http:// localhost . În ceea ce privește interfața phpMyAdmin se va accesa tot in browser.

Figura 14. Baza de date

5.1.2 Adaugarea bazei de date

După cum se poate observa baza de date poartă denumirea de smallworld, fiind
compusă din mai multe tabele și anume: events, friendships, messages, tagged și users.
Tabelele din baza de date au fost create în phpMyAdmin, în secțiunea SQL unde am creat
câmpurile necesare pentru fiecare tabelă. Dupa cum puteți ve dea în figura de mai jos,
implementarea tabelei “events”.

48

Figura 15. Tabela events
După crearea tabelelor am populat fiecare tabelă în parte pentru a deține câteva informații în baza
de date smallworld.

Figura 16 Popularea tabelei users
5.1.3 Crearea părții back -end

Pentru partea de back -end am utilizat PHP care este un limbaj de scripting, cu cod surs ă
deschis(open source) utilizat pe scară largă și care este potrivit în special pentru dezvoltarea
aplicaților web și poate fi integrat în HTML.
Am creat un folder PHP în care am construit toat ă logica din spate grupată pe funcționalități:
script pentru autentificare, script care conține func țiile evenimentelor, script care conține
funcțiile invitaților, scripu l care conține funcționalitățile de editare a profilului, script care
deține funcționalitățile de căutare a oamenilor pentru secțiunea MEET PEOPLE iar nu în

49
ultimul rând script care de ține func ționalit ătțile par ții de socializare; s ă adaugi un prieten, s ă
acepți cereri de prietenie sau s ă le ștergi.

Figura 17. Scripturile PHP
Puteți vedea în imaginea de mai jos s cripul folosit pentru logarea unui utilizator, precum și
conecatarea la baza de date.

50

Figura 18 Script pentru logare utilizator

Un exemplu de func ție prezent în scripul de socializare este funcția de a r ăspunde a unei cereri
de prietenie.

Figura 19. Script -ul de socializare

51
5.1.4 Adaugarea template -ului pentru Front -end

Am utilizat start Bootstrap, un framework care oferă teme, template -uri și instrucțiuni despre
construirea unui website cu o experiență bună pentru utilizator.
Pentru utilizarea lui am găsit toate informațiile utile pe site -ul https://startbootstrap.com/ .
După descarcarea template -ului am avut în proiect partea de JavaScript care ruleaz ă cu ajutorul
anima țiilor sec țiuniile aplica ției.
5.1.5 Dezvoltarea interfeței cu utilizatorul

Pentru dezvoltarea template -ului Start Bootstrap am utilizat urmatoarele tehnologii: CSS,
Bootstrap, HTML și JavaScript.
A fost utilizat p entru a crea scheletul aplicației HTML. În fișierul index.php am adăugat
limbajul de marcare care are scopul de prezentare a informaților: paragrafe, fonturi, titluri,
input -uri, imagini.
Pentru partea de design s -a folosit un alt limbaj de stilizare și anume CSS , acesta oferind
posibilitatea de personalizare a paginii web.

Figura 20. Fișierele limbaju lui CSS

52
După cum se observă în folderul CSS, s -a creat mai multe fișiere cu extensia CSS care dețin
codul de stilizare a diferitelor secțiuni ale paginilor: calendar, chat, event, modal. În fișierul
Bootstrap.min.css se afla codul librăriei Bootstrap minif iat.
După cum se poate observa și partea de JavaScript, fișierele care s -au creat și funcțiile aferente.

Figura 21. Fișierele limbajului JavaScript
Implementarea calendarului si funcțiile aferente create in fișierul JavaScript.

Figura 22. Implementare calentare JavaScript

53

La prima accesare a aplicației partea de autentificare va fi afișată iar utilizatorul are posibilitatea
de a se autentifica sau de a crea un cont nou.

Figura 23. Formularul de autentificare

Ulterior, după ce utilizatorul s -a logat în aplicație, partea de home este afișată . Aceasta
conține un meniu pus la dispoziția utilizatorului pentru a accesa diferite sectiuni ale aplica ție.

54

Figura 24 Pagina principală a aplicației
Utilizatorul are posibilitatea de a planifica un eveniment în funcție de diponibilitatea prietenilor
accesând urmatorul calendar.

Figura 25. Calendarul pentru planificare evenimente
Inclusiv poate sa verifice prietenii pe chat -ul pus la dispoziția utilizatorului pentru a putea face
schimb de mesaje.

55

Figura 26. Chat friends

5.2. Testarea aplicației

Procesul de testare al aplica ției reprezint ă soluția implement ării, fiind împărțit ă pe mai
multe tipuri de test ări și anume: testarea funcționalității, testarea utilizării, testarea
compatibilității și securității . Testarea reprezintă o investigație empirică realizată cu scopul de
a ofer i părților interesate informații referitoare la calitatea produsului sau serviciului supus
testării .
Testarea software mai poate fi definită ca un proces de validare și verificare a faptului
că un program/aplicație/produs software este în conformitate cu cerințe le care au ghidat
proiectarea și implementarea lui.[] Consider ăm faptul că t estarea trebuie să se desășoare pe tot
parcursul aplicației, fiecare funcționalitate nouă necesitând să fie testată în momentul
implementării.
5.2.1. Testarea funcțională

În prezent testarea se realizează utilizând strategia black box care este canali zată pe
verificarea cerințelor funcționale ale aplicației și cuprinde faptul cât de bine execute sistemul
funcțiile sale , acest tip de testare fiind făcut chiar de testeri. În prima treapt ă a testării , s-a
verificat introducerea datelor în formularele de autentificare și înregistrare, dar și în ceea ce
privește funcționalitățiile butoanelor și a search -bar-ului.

56
De asemenea s -au implementat mesaje de alertă pentru toa te situați ile posibile legate de
înregistrare și autentificare.

Figura 27 Testarea datelor introduse la înregistrarea utilizatorului
Dacă persoana este un utilizator nou, atunci va trebui să își creeze cont, iar în cazul în care
parola sau emailul nu este în concordan ță cu constrângerile,v -a primit mesaj de atenționare

57
altfel un mesaj c ă creearea contului a avut loc cu succes.

Figura 28 Creeare cont cu succes

Figura 29 Imposibilitatea cre ării contului

În momentul introducerii user -ului si parolei de autentificare, să poate fi atenționat utilizatorul
de acest lucru în cazul în care s -a gresit parola sau username, după cum se poate observa mai
jos.

58

Figura 30 Testarea formularului de logare
5.2.3. Testarea de utilizare

Testarea de utilizare verifică cât de ușor este de utilizat aplicația din perspectiva utilizatorului.
Unul din obiective a fost acela de a eficientiza modul de lucru , testând utilizarea și modul în
care se utilizeaza aplicația .
Deoarece aplicația prezentată este un site de socializare, dorim să vă aratăm cum se poate
utiliza, după ce ne -am creat cont, căutam persoana dorită de noi iar în cazul în care exista atunci
putem să îî trimitem cerere de prietenie.

Figura 31 Testarea pentru cautare utilizator

59

Ulterior, persoana care a primit cererea are posibilitatea de a accepta, sterge sau ignora
prietenia cu respectivul utilizator.

Figura 32 Cererea de prietenie

În cazul în care 2 utilizatori s -au imprietenit, pot sa socializeze pe chat -ul pus la dispoziție.

Figura 33 Testarea schimbului de mesaje prin chat

Iar nu în ultimul rând posibilitatea de a creea un plan cu un alt utilizator .

60

Figura 34 Planificare eveniment

5.2.3 Testarea compatibilității

În ceea ce privește acest tip de testare s -a verificat dacă aplicația rulează pe mai multe
browsere, diferite de cel utilizat pentru testarea funcționalităților sale în cadrul implementării.
În acest scop, s -au folosit motoare de căutare precum: Google Ch rome, Internet Explorer și
Mozilla Firefox.

61
5.2.4 Testarea securității

Acest tip de testare este utilizată pentru a evidenția dacă sistemul este protejat împotriva
accesului intern sau extern neautorizat. Această metodă a ajutat la verifica rea datel or aplicației
că au fost trimise în siguranță.
Testele efectuate asupra aplicației au avut scopul de a mă ajuta să repar anumite erori apărute
în cadrul aplicației, pentru ca aceasta să îndeplinească scopul pentru care a fost creată.

62
CONCLUZII

În zilele noastre site -urile web pentru socializare sunt într -o continuă creștere din punct
de vedere al popularității, multe persoane fiind mai active în lumea virtuală decât in cea reală.
Rețelele sociale fiind în prezent cele care ajută la contruirea relațiilor în comunicarea cu alte
persoane fără a necesita niciun cost, ele având rol important în viața de zi cu zi a oamenilor.
Datorită acestui fapt, dezvoltarea unei astfel de aplicații web este foarte bine venită, oferi nd
posibilitatea utilizatorilor de a -și face noi prieteni, de a socializa și de a cunoaște persoane noi,
acest lucru putând să se concretizeze chiar și în lumea reală. Această aplicație este benifică
utilizatorilor și datorită faptului că aceștia au posibi litatea de a -și organiza cu ușurință
evenimente sau planuri cu prietenii, în funcție de propriul calendar, totul făcându -se online,
fără a necesita nici -un cost.
Abordarea prezentată în această lucrare poate fi cu ușurință îmbunătățită prin mai multe
acțiuni pe care le putem face. O îmbunătățire care o putem aduce acestei aplicații în viitor ar fi
extinderea aplicției cu caracteristici precum : video call dar și distribuirea unei fotografii sau
clip video în povestea mea , care va reprezenta un mod prin care le putem distribui prietenilor
fotografii sau clipuri video fiind disponibile un anumit timp.

63
BIBLIOGRAFIE

[1] https://ro.wikipedia.org/wiki/Re%C8%9Bea_de_socializare -Retele de socializare
[2] Mark W. Scaefer (2016 ) ”Rețelele sociale explicative” .
[3] ”HTML 4.01 Specification”.HTML 4.01 Specification Word Wide Web Consortium.
[4] Nations, Daniel. ”Web Applications”.
[5] https://en.wikipedia.org/wiki/Ishikawa_diagram – Diagrama Fishbone
[6] https://en.wikipedia.org/wiki/Pareto_analysis – Diagrama Paret o
[7]http://www.rasfoiesc.com/business/management/Metode -de-stimulare -a-creativi58.php
Brainstorming
[8] https://get bootstrap.com/ -Bootstrap
[9]https://ctrl -d.ro/tutoriale/ce -este-bootstrap -si-cum-te-poate -ajuta -in-dezvoltarea -de-site-
uri-web-mode rne/ -Bootstrap
[10] Weerawarana, S., Curbera, F., Leymann, F., Storey, T., Ferguson, D. F., Web Services
Platform Architecture, Prentice Hall, 2005
[11] Thel wall, M.A. (2014). ”Social network sites: Users and users”.
[12] Journal of Computer -Mediated Comm unication Volume 13.
[13] http://vega.unitbv.ro/~cataron/Courses/BD/BD_Cap_2.pdf – Arhitectura ClientServer
[14] Flanagan, David. JavaScript – The definite guide .
[15] https://php.net/manual/ro/intro -whatcando.php – PHP.
[16]Obar, Jonathan A.; Wildman, Steve (2015). ”Social media definition and the governance
challenge: An introduction to the special issue”.
[17] https://en.wikipedia.org/wiki/Cascading_Style_Sheets -Limbajul CSS .
[18] Sitart -Tăut, D. -A. (2005). Baze de date distribuite. Cluj- Napoca: Editura Risoprint.
[19] Jecan, S. (2019). ,,T estarea produselor software “- note curs . Cluj -Napoca.
[20] Ciaca, M. (2019). ,,Inginerie de sistem “-note de curs . Cluj -Napoca.
[21] https://ro.wikipedia.org/wiki/Baz%C4%83_de_date -Baze de date