APLICAȚ IE WEB PENȚRU GESȚIONAREA UNUI MAGAZIN VIRȚUAL PROIECT DE DIPLOMĂ Autor: Simișor Valentin SOCACIU Conducător științific : As.drd.i ng. Adela… [629013]

FACULTATEA DE AUTOMATICĂ ȘI CALCULATOARE

2018

APLICAȚ IE WEB PENȚRU GESȚIONAREA
UNUI MAGAZIN VIRȚUAL

PROIECT DE DIPLOMĂ

Autor: Simișor Valentin SOCACIU

Conducător științific : As.drd.i ng. Adela PUȘCAȘIU

FACULTATEA DE AUTOMATICĂ ȘI CALCULATOARE

DECAN
Prof.dr.ing. Liviu MICLEA Vizat,

DIRECȚOR DEPARȚAMENȚ AUȚOMAȚICĂ
Prof.dr.ing. Honoriu VĂLEAN

Autor : Simișor Valentin SOCACIU

APLICAȚ IE WEB PENTRU GESTIONAREA UNUI MAGAZIN VIRTUAL

1. Enunțul temei: Aplicația web este utilizată pentru administrarea unui magazin on line
de suplimente nutritive.

2. Conținutul proiectului: Pagina de prezentare , Declarație privind autenticitatea
proiectului, S inteza proiectului , Cuprins, Introducere , Studiu Bibliografic , Analiză,
Proiectare, Implementare, Concluzii, Bibliografie .

3. Locul documentației : Universitatea Tehnic ă din Cluj -Napoca .

4. Consultanți: As.drd.ing. Adela PUȘCAȘIU

5. Data emiterii temei:

6. Data predării:

Semnătura autorului

Semnătura c onducător ului științific

FACULTATEA DE AUTOMATICĂ ȘI CALCULATOARE

Declarație pe proprie răspundere privind
autenticitatea proiectului de diplomă

Subsemnatul(a) Simișor Valentin SOCACIU ,
legitimat(ă) cu CI seria XB nr. 417600 , CNP [anonimizat] ,
autorul lucrării:
Aplicație web pentru gestionarea unui magazin virtual

elaborată în vederea susținerii examenului de finalizare a studiilor de licență la
Facultatea de Automatică și Calculatoare , specializarea Automatică și Informatică
Aplicată , din cadrul Universității Țehnice din Cluj -Napoca, sesiunea Iulie 2018 a anului
universitar 2017 -201 8, declar pe proprie răspundere, că această lucrare este rezultatul
propriei activități intelectuale, pe baza cercetărilor mele și pe baza informațiilor obținute
din surse care au fost citate, în textul lucrării, și în bibliografie.
Declar, că această lucrare nu conține porțiuni plagiate, iar sursele bibliografice au
fost folosite cu respectarea legislației române și a convențiilor internaționale privind
drepturile de autor.
Declar, de asemenea, că această lucrare nu a mai fost prezentată în fața unei alte
comisii de examen de licență.
In cazul constatării ulterioare a unor declaraț ii false, voi suporta sancțiunile
administrative, respectiv, anularea examenului de licență .

Data Simișor Valentin SOCACIU

(semnătura)

FACULTATEA DE AUTOMATICĂ ȘI CALCULATOARE

SINTEZA
proiectului de diplomă cu titlul:
APLICAȚ IE WEB PENTRU GESTIONAREA UNUI MAGAZIN VIRTUAL

Autor: Simișor Valentin SOCACIU
Conducător științific: As.drd.ing. Adela PUȘCAȘIU

1. Cerințele temei: cuprind implementarea și administrarea unui site web de tipul
unui magazin online. Această aplicație oferă posibilitatea clienților de a se informa si de
a achiziționa produsele nutritive prin plasarea unei comenzi online.
2. Soluții alese: pentru imp lementarea aplicaț iei am început de la construcția bazei
de date cu ajutorul mysql , aplicație inclusă î n programul Apache. U rmătorul pas fiind
crearea design -ului și funcționalitățile dintre gesign ș i baza de date , apoi pentru a rula
fișierele de tip php ave m nevoie de un server care se gă sește tot în programul Apache la
fel și programul phpmyadmin pe care îl utilizăm pentru a lucra cu baza de date . Scrierea
codului s -a realizat cu ajutorul lui NetB eans descris in paginile ce urmează împreună cu
programele folos ite pentru rularea aplicației.
3. Rezultate obținute: aplicația creată permite clienților posibilitatea de a se informa
despre produsele nutritive oferite, precum și achiziționarea acestora printr -o simplă
comandă online. Țotodată, aplicația cuprinde și o parte de administrare.
4. Țestări și verificări: au fost efectuate o serie de teste atât din perspectiva
administratorului care se ocupă de stocul produselor, verificarea comenzilor și
trimiterea acestora, cât și din perspectiva clienților, prin crearea un or conturi de
utilizator și plasarea mai multor comenzi.
5. Contribuții personale: în urma analizei tehnologiilor actual e folosite î n acest
domeniu, am creat un sistem fiabil și ușor de utilizat, care să cuprindă funcționalitățile
de bază necesare unui mag azin online.
6. Surse de documentare: site-uri web de specialitate.

Semnătura autorului

Semnătura conducătorului științific

1
Cuprins

1 INTRODUCERE ………………………….. ………………………….. ………………………….. ………………………….. 2
1.1 CONTEXTUL PROIECTULUI ………………………….. ………………………….. ………………………….. …………….. 2
1.2 OBIECTIVELE PROIECTULUI ………………………….. ………………………….. ………………………….. ……………. 2
2 STUDIU BIBLIOGRAFIC ………………………….. ………………………….. ………………………….. ……………….. 4
2.1 HTML (HYPERTEXT MARKUP LANGUAGE ) ………………………….. ………………………….. ……………………… 6
2.2 PHP (PHP: HYPERTEXT PREPROCESSOR ) ………………………….. ………………………….. ……………………….. 9
2.3 CSS (CASCADING STYLE SHEETS ) ………………………….. ………………………….. ………………………….. …… 10
2.4 JAVASCRIPT ………………………….. ………………………….. ………………………….. ………………………….. .. 12
2.5 MYSQL ………………………….. ………………………….. ………………………….. ………………………….. ……. 12
2.6 BOOTSTRAP ………………………….. ………………………….. ………………………….. ………………………….. .. 15
3 ANALIZĂ, PRO IECTARE, IMPLEMENTAR E ………………………….. ………………………….. …………………. 16
3.1 CERINȚELE APLICAȚIEI ………………………….. ………………………….. ………………………….. ………………… 16
3.2 ARHITECTURA APLICAȚIE I………………………….. ………………………….. ………………………….. …………….. 16
3.3 ARHITECTURA BAZEI DE DATE ………………………….. ………………………….. ………………………….. ……….. 17
3.4 ASPECTE GENERALE ALE INTERFEȚEI ………………………….. ………………………….. ………………………….. … 20
3.5 PAGINA INDEX .PHP ………………………….. ………………………….. ………………………….. …………………… 21
3.6 ANTETUL PAGINII ………………………….. ………………………….. ………………………….. ……………………… 23
3.7 PAGINA INREGISTRARE .PHP ………………………….. ………………………….. ………………………….. …………. 25
3.8 PAGINA AUTENTIFICARE .PHP ………………………….. ………………………….. ………………………….. ………… 26
3.9 GAMA NOASTRĂ ………………………….. ………………………….. ………………………….. ………………………. 28
3.10 PAGINA CUMPARA .PHP ………………………….. ………………………….. ………………………….. ………………. 30
3.11 COȘUL DE CUMPĂRĂTURI ………………………….. ………………………….. ………………………….. ……………. 32
3.12 FINALIZARE COMANDĂ ………………………….. ………………………….. ………………………….. ……………….. 34
3.13 OBIECTIVELE TALE ………………………….. ………………………….. ………………………….. …………………….. 35
3.14 SUBSOLUL PAGINII ………………………….. ………………………….. ………………………….. ……………………. 37
3.15 PAGINA TERMENI ȘI CON DIȚII ………………………….. ………………………….. ………………………….. ……….. 37
3.16 PAGINA ADMINISTRARE ………………………….. ………………………….. ………………………….. ………………. 38
4 CONCLUZII ………………………….. ………………………….. ………………………….. ………………………….. …. 45
4.1 REZULTATE OBȚINUTE ………………………….. ………………………….. ………………………….. ………………… 45
4.2 DIRECȚII DE DEZVOLTARE ………………………….. ………………………….. ………………………….. …………….. 45
BIBLIOGRAFIE ………………………….. ………………………….. ………………………….. ………………………….. …… 46

Introducere
2 1 Introducere
1.1 Contextul P roiectului

World Wibe Web , abreviat www sau pe scurt web este un concept de care odată cu
trecerea timpului devenim tot mai depen denți, încat ajungem să constată m cu stupoa re
ca majoritatea aplicațiilor și dispozitivelor sunt dependente de acest concept. Putem chiar
afirma ca i nternetul a devenit o parte componentă a vieții umane, reușind să schimbe o
bună parte a lucrurilor, spre exemplu felul cum învațăm sau ne documentăm, iar nu în
ultimul râ nd și poate cel mai important felul în care comunicăm.
Unul dintre cele mai mari avantaje ale Internetului este faptul că distanța dintre
cerere și informație este de doar un singur click. Acel singur click pune la d ispoziția
utilizatorului o sumedenie de informații din toate domeniile, astfel că majoritatea
companiilor au implementat acest s istem creând aplicații personalizate pentru a ajuta tot
mai mult utilizatorul dar tot odată și pentru creșterea marketing -ului c ompaniei.
Astfel că, în urma unei ample analize am decis ca lucrea mea de licență să constituie
o aplicație web de tipul unui magazin online.

1.2 Obiectivele Proiectului
Țema aplicației este reprezentată de o aplicație web cu scopul unui magazin virtual,
găsit sub denumirea SM- Suplimentele Mele. De cele mai multe ori un magazin online
reprezintă o platformă unde sunt adăugate produse, care mai apoi sunt prezentate
clienți lor cu sco pul de a fi comercializate, ace st criteriu reprezentând punctul principal al
unui magazin online.
În prim plan se găsește un meniu care are rolul de a permite utilizatorului navigarea
în întreaga aplicație prezentând informații legate de produsel e disponibile. Produsele
sunt adăugate de către un administrator care are rolul de a controla ș i gestiona întreaga
aplicație, cu ajutorul unei pagini destinate lui.
Autentificare la pagina de administrare se face pe baza utilizatorului și a parolei , iar
determinarea administratorului se face dupa campul acces .
Cerința aplicației este realizarea unui magazin virtual cu scopul de a vinde produse
nutritive online. Intenția acestei lucrări este de a prezenta un magazin virtual .
În principiu , rolul administrat orului este de a fi un super vizor peste tot ceea ce se
petrece în aplicație . Așadar el poate să adauge sau să șteargă un produs, având și
posibilitatea de a vizualiza și administra comenzile efectuate de către clienți.
Contul de administrator permite pe langa posibilitatea de a întreține stocul de
produse și pe cea de a achiziționa suplimente online.

Introducere
3
În ceea ce privește utilizatorul acesta poate să achiziționeze p rodusele disponibile
în aplicaț ie.
Navigarea în aplicație se face cu ajutorul meniului, ac esta fiind prezentat în
rândurile ce urmează. Pentru a putea achiziționa un produs, utilizatorul treb uie să se
autentifice în sistem.
Autentificarea se realizează cu ajutorul unui nume de utilizator și o parolă. Creare
unui utilizator se face cu ajutorul unui formular dedicat acestei funcții și o să fie pre zentat
în detaliu în capitole le ce urmează.
Achiziționarea unui produs se poate face numai după ce utilizatorul este autentificat
în sistem deoarece pentru a putea indentifica utilizatorul și produsele p e care acesta le
dorește avem nevoie de un id de utilizator, acest id de utilizator se crează odată cu
autentificare în sistem după anumite verificări în baza de date.
O altă caracteristică importantă în ceea ce privește achizionarea unui produs este ca
acesta sa fie disponibil pe stoc, adică numărul de bucăți cerute să fie mai mic sau egal decât
numărul de bucăț i disponibile.

Studiu bibliografic
4 2 Studiu bibliografic
Conform referintei [1], site-ul web este un ansamblu de documente de tip hypertext
care formează un tot uni tar bine structurat. Documentele de tip hypertext alcătuiesc
fiecare câte o pagină web sau o bucată din aceasta, ele pot să conțină imagini, clipuri video
sau audio, text, animații și multe alte elemente.
Site-ul web trebuie sa fie găzduit de minim un ser ver web pentru a putea fi accesat
din orice colț al pământului. Un server reprezintă mai exact un sistem hardware special
configurat cu anumi te caracteristici pentru a fi capabil sa fac ă față tuturor cererilor
trimise de către utilizatori.
Accesul se face cu ajutorul rețelei globale de internet printr -o adresă de tip URL
(Uniform Re source Locator ) mai exact calea primară de acces a unui site web. WWW
(World Wide Web) cuprinde în totalitate toate site -urile web făcute publice.
Legăturile dintre toate dispozitivele care utilizează rețeaua de internet sunt
realizate cu ajutorul protocoale lor și anume:
• Internet Protocol (IP)
• Transmission Control Protocol (TCP)
• User Datagram Protocolo (UDP)

Conectarea la un site web se face prin pagina principală, numită pagină de index . În
cele mai multe cazuri aceasta are un nume sugestiv. Odată afișată această pagi nă de index
oferă diferite opțiuni de navigare către toate celelalte pagini în funcție de nevoile
utilizatorului.
Multe aplicații web au o pagină de dicată special ă unei hărți a aplicației pentru a face
mai ușoară navigarea utilizatorului.
Interfața prin intermediul căreia site-urile Word Wide Web își prezintă conținutul
se numește browser web. De -a lungul timpului au fost dezvoltate diferite browsere web
fiecare cu o int erfață proprie, si anume :
• Google Chrome
• Internet Explorer
• Mozilla Firefox
• Opera
• Safari
• Microsoft Edge
• Etc.

Cele mai utilizate fiind primele trei .

Studiu bibliografic
5
Conform referinț ei [2], paginile web au la bază multe standarde, iar cel mai folosit și
important standard ar fi HTTP acronimul de la Hyper Text Transfel Protocol. Acest
standard oferă o tehnică de comunicare prin care un calculator aflat la distanță poate
transmite spre propriul calculator o multitudine de pagini web, aceasta reprezentând
comunicarea dintre server și browser -ul utilizatorului. Protocolul HTTP este un protocol
de tip text, fiind protocolul i mplicit al World Wibe Web -ului.
Site-urile web sunt clasificate dupa mai multe criterii , pe câteva dintre acestea le-am
enumerate mai jos:
• scopul pentru care a fost creat
• destinația acestuia
• în funcție de publicul pe care îl servește
• tehnologiile utilizate
• mărimea acestuia

sau după modul de afiș are:
• static
• dinamic
• combinat (static și dinamic)

Conform referinț ei [3], p aginile web statice sunt cele mai simple, de obicei sunt
scrise cu ajutorul limbajului HȚML și sunt transmise spre browser în același format în
care sunt stocate pe server. Acest tip de pagină prezintă tuturor utilizatorilor aceleași
informații, iar schimb area conținutului sau a structurii acestora se face manual fiind
necesare anumite cunoștințe ale limbajului HȚML.
Spre deosebire de acestea , paginile dinamice sunt ceva mai complexe, ele oferă un
conținut variabil în funcție de vizitator și de condițiile impuse de cel care le creează.
Pentru a oferi această flexibilitate paginile dinamice sunt realizate cu ajutorul unor
limbaje de programare mult mai complexe utilizate în comun. În combinație cu limbajele
de programare sunt utilizate și bazele de date pent ru a stoca anumite informații . Cele mai
comune sunt bazele de date MySQL.
Conform referinței [2] un magazin online este un website format din pagini
dinamice la baza căruia se află o bază de date complexă în care sunt stocate date precum:
utilizatori, pro duse, comenzi și alte informații necesare.
Nu de mult acest gen de aplicație nici nu exista, însă în ultimi i ani piața online a avut
o dezvoltare exponențială la nivel global, la fel și în România, magazinele online reprezintă
un model de afacere.

Studiu bibliografic
6 Avantajul magazinelor online este distanța de un click față de orice produs sau
serviciu solicitat de utilizator, astfel, de acasă putem să achiziționăm orice ne dorim fară
a face nici un efort și cel mai important , într-un timp mult mai scurt fiind scutiți d e
anumite deplasări.
Pe lângă avantajele prezentate mai sus acest tip de magazin oferă și alte avantaje
precum:
• numărul de angajați necesari pentru administrarea lui este mult mai mic
decât a l unui magazin real
• este la dispoziția clienților 24 de ore pe zi, 7 zile pe săptămână
• cheltuielile af erente chiriei unui domeniu sunt mult mai mici față de
cheltuielile cu o chirie pentru un spațiu comercial
• oferă o vedere de ansamblu mult mai utilă asupra diferențe lor de preț dintre
produse și calitatea acestora
• clientul poate să treacă usor de la o categorie de produse la alta
• aranjarea produselor pe rafturi nu mai este necesară

Cum pentru construirea unui magazin real a vem nevoie de spațiu, mobilier și
elemente de design pentru a i oferi un aspect cât mai atrăgăto r la fel și pentru a creea un
magazin online avem nevoie de o gazdă (domeniu) , spațiu de stocare (baza de date) ,
elemente de design și limbaje de programare cu ajutorul cărora website -ul este scris.
În ceea ce privește proiectul meu de diplomă am ales să u tilizez următoarele
tehnologii:
• HTML – pentru a aranja și structura conținutul paginilor
• PHP – pentru realizarea paginilor dinamice
• CSS – pentru a formata textul HTML, deoarece acesta este suportat de toate
browser -ele web
• JavaScript – pentru adăugarea unor funcționalități dinamice paginilor web
• MySQL – reprezintă tot ceea ce înseamna baza de date, datele sunt salvate pe
server, iar operarea pe baza de date se realizează cu funcții specific e acestui tip.
• Bootstrap – framework de CSS care ajută la stil izarea paginilor.

2.1 HTML (HyperText Markup Language)

Conform referinței [4] HTML este unul dintre elementele care stau la baza WWW
(World Wide Web) și reprezintă formatul cu ajutorul căruia documentele sunt văzute în
browser. Bazele acestui limbaj au fost scrise de Tim Berners -Lee în 1989 și a fost utilizat
pentru prima dată în documentele transmise de către fizicieni, prin intermediul
Internetului.

Studiu bibliografic
7 Era apreciat datorită independenței f ață de platformă ceea ce însemnă că era afișat
la fel pe orice tip de c alculator.
Utilizarea limbajului HTML presupune introducerea textului între tag -uri, numite
și etichete sau marcaje, elementele de care orice browser se folosește pentru a interpreta
codul ca mai apoi să afișeze textul conținut între tag -urile respective fără ca acestea să
apară pe display, ele fiind utile doar pentru interpretare, aranjare în pagină și pentru a
putea atribui textului anumite caracteristici precum: font, size, bold, color etc.
În conformitate cu referința [4] standardul oficial este World Wide Web
Consortium, ulterior W3C enunțând câteva versiuni HȚML precum HȚML 2.0, HȚML 3.0,
HȚML 3.2 etc. Cea mai recentă versiune apărută este HȚML 5. Fiind documente în format
ASCII este posibilă editarea acestora cu orice editor de text normal.
Structura unui document HȚML este alcătuită cu ajutorul unor cuvinte cheie puse
între caracterele “<” și “ >” acestea formând un tag. Cele mai mul te astfel de etichete au
nevoie și de o pereche, mai precis un tag de încheiere, singura diferență dintre tag -ul de
început și tag -ul de incheiere o reprezintă caracterul “ /” folosit astfel: “</cuvânt cheie>”.
Orice document HȚML începe cu tagul <html> și se incheie cu tagul </html>, între
cele doua taguri sunt conținute două secțiuni:
• antet (<head>…</head >)
• corp (<body>…</body >)
cu ajutorul acestora, documentul este bine structurat.

Figura 2 .0: Structura unui document HTML

Studiu bibliografic
8
Antetul unui fișier HȚML poate să conțină spre exemplu titlul pagini i, care va fi
introdus între tagurile < title>…</title>, elemente de stil care vor fi aplicate conținutului
sau legături către fișiere extrerne de tip CSS și JavaScript. Corpul fișierului HȚML cuprins
între tagurile <body> respectiv </body> va conț ine toate elem entele care doresc să fie
afișate mai târziu in browser -ul web. Pentru a prelucra textul unei pagini web, HTML pune
la dispoziție o serie de etichete utile în acest scop. În cele ce urmează o sa prezint sub
formă de tabel cele mai utilizate etichete conform referinței [4]:

Nr. Tag Descrie re
1 <html>…</html> -după cum am prezentat și în aliniatele
anterioare , aceste taguri sunt utilizate in
toate documentele HTML, fiind
indispensabile;
2 <head>…</head> -între aceste taguri este cuprins antetul
paginii;
3 <title>…</title> -conține titlul unei pagini;
4 <body>…</body> -cuprinde întreg corpul unei pagini web;
5 <font>…</font> -sunt utilizate p entru formatarea
textului, ca a tribute putem avea: “size”,
“font”, “color”, etc. Refer itor la atributul
“color”, acesta poate fi utilizat atât
pentru a da culoare textului cât și pentru
a colora fundalul. Exista trei metode prin
care putem atribui culori elementelor
unei pagini web: prin numele culorii (16
culori), cu ajutorul RGB sau prin cod de
culoare generat cu ajutorul unui “Color
Picker”;
6 <table>…</table> -etichete pentru inserarea unui tabel
intr-o pagină web. Pentru a crea o linie
intr-un tabel utilizăm tagurile
<tr>…</tr >, iar pentru a adăuga o
coloană utilizăm tagurile <td>…</td>.
Adăugarea unui cap de tabel se face cu
ajutorul tagurilor <th>…</th>;
7 <ul>…</ul> – marchează o listă neordonată;
8 <ol>…</ol> – marchează o listă ordonată;
9 <li> – marchează un element de listă;

Studiu bibliografic
9 10 <p>…</p> -utilizate pentru afișarea textului sub
formă de par agraf, iar ca atribute putem
să aliniem textul cu ajutorul cuvântului
cheie “align”;
11 <img> -utilizată pentru adăugarea unei imagini.
Este un tag singular , prin urmare nu
necesită etichetă de final;
12 <a href=”cale”>…</a> -cu ajutorul acestei etichete legăm
paginile între ele sau facem trimitere
către alte site -uri web;
13 <h1>…</h1> -tagurile pentru titluri, sunt de mai
multe dimensiuni de la 1 la 6, 1 fiind cele
mai mari, iar 6 cele mai mici;

Tabelul 2 .0. Taguri HTML

2.2 PHP (PHP : HyperText Preprocessor)
Conform cu referința [5], în anul 1995 Rasmus Ledorf a compus un set de scripturi
pe care le -a utilizat pentru a contoriza numărul de persoane care îi accesează CV -ul
publicat online. Mai apoi , acest limbaj a fost dezvoltat în C cu posibilități mult mai variate
de utilizare, inclu siv având posibilitatea de a comunica cu bazele de date , lucru care l -a
făcut să fie utilizat cel mai des în cre area paginilor web dinamice.
Este un limbaj de programare Open Source ceea ce oferă posibilitatea oricui de a
îmbunătăți codul sursă. În anul 1 997 a fost lansată versiunea de PHP 3.0 creată de Zeev
Suraski și Andi Gutmans cu o bază solidă care oferă o posibilitate vastă de extindere. Țrei
ani mai târ ziu apare PHP 4.0 cu îmbunătățir i majore asupra securități i bazelor de date,
posibilitatea de a su sține mai multe servere web, fiind introduse sesiunile și alte facilități.
Versiunea apărută în 2004 aduce îmbunătățiri la nivel de programare orientată pe obiect,
îmbunătățește performanțele și adaugă alte funționalități. Ulterior au mai apărut noi
versiuni ale acestui limbaj de programare, fiecare adăugând plusuri acestuia.
Este un limbaj extrem de popular în rândul programatorilor de limbaje server
datorită unor caracteristici importante precum:
• gratuitate
• securitate
• eficiență
• simplitate
• flexibilitate

Studiu bibliografic
10 Limbajul de programare PHP este compatibil cu orice sistem de operare și este
capabil să interacționeze cu toate serverele web. Codul este inclus între secvențele de
HȚML de unde serverul îl interpretează după care este convertit și el în cod HȚML, pentru
a putea fi văzut de către utilizator cu ajutorul br owser -ului. Pentru ca serverul să
recunoască secvențele de cod PHP , acesta trebuie să fie inclus obligatoriu între eticheta
de început “ <? php” și eticheta de final “?>”. Rolul acestui limbaj în cadrul apl icațiilor web
este de a obține date de la utilizator, de a verifica accesul utilizatorilor la fișiere, de a
prelucra datele și de a afișa în mod dinamic paginile web.

Figura 2 .1: PHP model

Ca și dezavantaje ale acestui limbaj de programare putem să vorbim despre timpul
destul de mare în car e este executat codul sursă, însă datorită numeroaselor avantaje pe
care PHP le oferă, eficiența acestuia nu este influențată de acest dezavantaj.

2.3 CSS (Cascading Style Sheets)
In limba română CSS se traduce “foi de stil în cascadă” și este un limbaj care se
folosește la stilizarea conținutului HȚML. Stilurile CSS se aplică asupra părților unui
document HTML prin i ntermediul unor fișiere externe și local cu ajutorul etichetei <style >
sau a atributului style.
În timp ce limbajul HTML este utiliza t pentru a structura conținutu l unei pagini web,
CSS are rolul de a formata și stiliza elementele conținute de aceasta.

Studiu bibliografic
11 Tipul limbajului CSS este style -language și sunt folosite următoarele atrib ute pentru
elementele limbajului HTML: margini, înălțime, lățime, font, culori, modificarea
imaginilor, a tabelelor, a listelor și multe altele.
Conform referinț ei [7], când au apărut paginile web , singura modalitate prin care
acestea se structurau era cu ajutorul etichetelor HTML care erau inter pretate de browser
în același mod astfel toate paginile erau aproape identice. Cu timpul când numărul site –
urilor web a început să crească, designerii au început să caute soluții pentru a schimba
aspectul acestora. Au început sa apară noi etichete , însă aceste a nu erau interpretate de
orice browser astfel era nevoie ca un anumit site web să fie accesat doar cu un anume
browser, ceea ce nu era pre a convenabil. Aceste probleme au dat naștere CSS -ului, un
limbaj comun c are oferă o multitu dine de funcții cu ajutorul cărora fiecare site web este
personalizat și diferit unul față de celălalt.
O construcție CSS este alcătuită dintr -un “selector” și “declarative”, primul utilizat
pentru a specifica exact cărui element din pa gină îi sunt aplicate atributele, iar cel din
urmă reprezintă exact ce elemente de stil dorim să aplicăm.

Figura 2 .2: Modelul unei instrucțiuni CSS
Limbajul CSS are mai multe avantaje, pe câteva dintre ele le -am enumerat în
următoarea listă, ele fiind preluate din referința [ 7]:
• reduce substanțial timpul petrecut pentru realizarea site -ului web;
• este suportat de către absolut toate navigatoarele;
• este redusă memoria utilizată de pe hard și lățimea de bandă utiliza tă la
transmiterea documentelor;
• multitudinea de modalități de stilizare pe care limbajul HȚML nu le oferă;
• CSS permite formatarea conținutului pentru a putea fi afiș at pe mai multe
tipuri de dispoz itive precum telefoane, laptopuri, PC etc.
• codul HTML este mult mai simplu , elementele de style fiind conținute
separat;

Studiu bibliografic
12 2.4 JavaScript
În urma studiului făcut, din referința [6] prezint următoarele definiț ii și
caracteristici ale limbajului de programare JavaScript.
Este un limbaj de programare bazat pe p rototipuri și orientat pe obiect. În practică
are rolul de a adăuga anumite funcții site -urilor web. Brendan Eich este primul
dezvoltator al acestui limbaj numit la început Mocha, ulterior LiveScript, iar în final
JavaScript. Sintaxa este foarte apropiată de a limbajului C la fel ca și în cazul Java, însă
contrar asemănării denumirilor , Java și JavaScript nu au nimic în comun.
Programatorii utilizează cel mai mult JavaScript la dezvoltarea de aplicații web,
codul acestuia fiind inclus în paginile web sub f ormă de script având ca funcționalități
crearea meniurilor și a altor efecte de animație sau la verificarea unor date primite de la
utilizatori. În momentul de față JavaScript este cel mai utilizat limbaj de programare de
tip script. Pentru a rula acest ti p de scripturi avem nevoie de un browser care suportă
JavaScript.
HTML are taguri speciale , secvențe de cod de tip script , care pot fi inserate direct
în codul său. Aceste a sunt <script>…</script >, astfel browser -ul știe când are de -a face cu
o secvență de cod JavaScript.

2.5 MySQL
Conform referinței [9], MySQL este un sistem de gestiune a bazelor de date, care a
apărut în anul 1995 pentru prima dată, creat în primă instanță de către cei de la MySQL
AB mai apoi fiind dezvoltat de cei de la Oracle Corporation .
La baza lui stau limbaje de programare precum C și C++. Este capabil să ruleze pe
majoritatea sistemelor de operare, mai exact pe Windows, OS X, Linux, Solaris sau
FreeBSD.
MySQL este cel mai popular SGBD de tip open -source, de cele mai multe ori este
utilizat alături de P HP fiind capabil să construiască aplicații în orice limbaj. În momentul
de față reprezintă o componentă extrem de importantă a stivei LAMP (Linux , Apache,
MySQL, PHP). Datorită faptului că deține o listă numeroasă de caracteristici repr ezintă un
puternic server de date , fiind și portabil.
Principalele avantaje ale MySQL sunt următoarele:
• Securizarea datelor – cu toate că sunt disponibile în mediul online fiind
posibilă accesarea de către oricine , datele sunt securizate prin controlul
accesului fapt care face ca persoan ele neautorizate să nu aibă acces;
• Portabilitate – este utilizat fără a întâmpina probleme pe majoritatea
platformelor;
• Cost scăzut – este disponibil în doua metode, una la un preț f oarte scăzut și
alta de tip OpenSource;

Studiu bibliografic
13 • Fiab ilitate – ca limbaj este unul uș or cu instrucțiuni simple fiind înțeles de
către oricine fără mari dificultăți;
• OpenSource – în timpul fazei de dezvoltare limbajele de tip OpenSource, cum
este și MySQL oferă acc es liber procesului, utilizatorii putând îmbunătăți
produsul finit;

În comparaț ie cu alte aplicații de gestiune a bazel or de date MySQL este cel mai uș or
de utilizat din prisma faptului că acesta are elemente de sintaxă foarte simple, un bun
exemplu ar fi comanda de ieș ire (quit sau exit) . Pentru gestiunea bazelor de date avem
posibilitatea să u tilizăm aplicații cu interfață p ractică (MySQL Front), modulul liniei de
comandă sau “phpmyadmin ”, aplicație scrisă în PHP.
Bazele de date sunt formate din unul sau mai multe tabele care la fel conțin una sau
mai multe celule în care sunt stocate informațiile. Pentru a manipula datele unei tabele se
utilizează un set de instrucțiuni simple și sugestive. Dintre acestea le -am enumerat în lista
următore pe cele mai des utilizate preluate din referința [9]

• „INSERȚ INȚO denumire_tabel (denumire _coloană1, denumire_coloană2,
denumire_coloană3, etc.) VALUES (valoare 1, valoare2, valoare3, etc.) “– este
utilizată pentru a introduce date noi în tabel;

• “SELECȚ denumire_coloană FROM denumire_ tabel “– este utilizată pentru a
scoate datele dintr -un tabel;

• “UPDAȚE denumire_tabel SEȚ denumire_coloană1 = valoare1,
denumire_coloană2 = valoare2, etc. WHERE denumire_coloană_identificator
= valoare” – este utilizată pentru a modifica înr egistrările făcute anterior;

• “DELEȚE FROM denumire_tabel WHERE denumire_coloană_identificator =
valoare” – este utilizată pentru a șterge un anume rând dintr -un tabel;

Comanda JOIN este utilizată pentru a creea relații între mai multe tabele ale
unei baze de date și are mai multe forme fi ecare având un efect diferit:

• JOIN/INNER JOIN – afișează liniile în cazul în care între tabele se găsește cel
puțin o potrivire;

• LEFT JOIN – afișează liniile tabelului aflat în partea stângă fără a fi nevoie să
se gasească vreo potrivire între cele două;

Studiu bibliografic
14 • RIGHT JOIN – afișează toate liniile tabelului din dreapta fără a fi nevoie de
vreo potrivire între cele două tabele;

• FULL JOIN – îndeplinește fun cțiile comezilor LEFȚ JOIN și RIGHȚ JOIN la un
loc;
În momentul in care creem o bază de date în MySQL la declararea fiecărei coloane a
tabelului este nevoie să selectăm un tip de date conform cu ceea ce dorim sa stocăm în
acea coloană. Aplicațiile MySQL oferă utilizatoril or un număr mare de tipuri de date care
alese corect sporesc eficiența bazei de date. În MySQL se pot importa noi baze de date sau
exporta bazele de date deja create .
Cele mai utilizate tipuri de date le voi prezenta în tabelul următor fiind preluate din
sursa cu referința [9].

Tip Dimensiune Descriere
INT [lungime] 4 octeți Valor i cuprinse între –
2.147.483.648 și
2.147.483.647 sau de la 0 la
4.294.967.295 fără semn;
CHAR [ lungime ] Sunt alocați octeți în funcție
de “[ lungime ]”; Șir de lungime fixă, de la 0
la 255 de caractere;
VARCHAR [ lungime ] Sunt alocați “[ lungime ]” +
1 octeți; Șir de lungime variabilă, de
la 0 la 255 de caractere;
FLOAT 4 octeți Număr zecimal cu valoare
mică;
DOUBLE [ lungime,
zecimale ] 8 octeți Număr zecimal cu valoare
mare;
TEXT [ lungime ] Sunt alocați “[ lungime ]” +
2 octeți; Șir de caractere cu o
lungime maximă admisă de
65.535 de caractere;
DATE 3 octeți Format – YYYY -MM-DD
TIME 3 octeți Format – HH:MM:SS

Tabelul 2 .1. Tipuri de date în MySQL

Studiu bibliografi c
15 2.6 Boots trap

Conform referinț ei [10], Bootstrap este un framework open -source folosit pentru
desig n-ul web -site-urilor si a aplicaț iilor web. La început a fost numit Țwitter Blueprint și
a fost dezvoltat de Mark Otto și Jacob Țhornto ca un tool intern pentru Țwit ter. După
câteva luni de dezvoltare tot mai mulți developeri au început să contribuie la acest proiect,
iar pe data de 19 August 2011 a fost numit Bootstrap și transformat întru -un proiect open –
source.
În 31 i anuarie 2012 a fost lansat Bootstrap 2 în ca re au fost adăugate doisprezece
coloane ca nivele de organizare a paginilor web și alte componente, iar cele vechi au fost
modificate.
Pe data de 19 a ugust 2013 a apărut următoarea versiune, Bootstrap 3, care a
modificat și imbună tățit vechile componente.
În 29 octombrie 2014 Mark Otto a anunț at dezvoltarea Bootstrap 4, iar pe data de
19 a ugust 2015 a f ost l ansat Alpha Bootstrap 4. În 10 august 2017 a fost lansată versiunea
Beta, iar în 18 i anuarie 2018 a apărut versiunea stabilă pentru Bo ostrap 4 îmbun ătățind
utilitățile bordurilor și implementând un control mai bun adăugând Sass și flexbox
control.
Boostrap este compilat în pachete și apoi inclus în paginile web, dar pot fi adăugate
sau șterse și elemente individuale. Aceste pachete conțin un set de v ariabile care
controlează culoarea sau consistența elementelor. Bootstrap oferă un set de foi de stil
predefinite care oferă un aspect de baza pentru toate componentele HȚML. Acestea oferă
un stil uniform și modern pentru formatarea textului, a tabelelor și a elementelor de
formă.

Analiză, proiectare, implementare
16 3 Analiză, proiectare, implementare
3.1 Cerințele aplicației

Pentru funcționarea acestei aplicații, este necesară îndeplinirea unor cerințe
minime hardware și software. În primul rând este nevoie de un calculator pe care să găsim
un sistem de operare Windows sau Mac OS , în al doilea rând este nevoie de anumite
programe cu care lucrează aplicația și anume: un server Apache, PHP, phpMyAdmin și nu
în ultimul rând de baza de date MySQL .
Toate aceste programe de care are nevoie aplicaț ia și anume Apache, PHP respectiv
MySQL le găsim din programul XAMPP Control Panel . De asemnea pentru scrierea codului
HȚML și PHP m -am folosit de binecunoscutul program de editat NetBeans , dar se pot
utiliza și alte aplicații pentru editarea textului cum ar fi : Notepad, Notepad++, Sublime,
PHPStorm , etc.
Aplicația, pentru a fi vizualizată are nevoie de un navigator în care să fie deschisă. În
cazul de față eu m -am folosit de Google Chrome , dar se pot folosi și alte navigatoare
precum Mozilla Firefox, Oper a sau Internet Explorer.
Vizualizarea bazei date și implicit lucrul cu aceasta se poate face cu ajutorul
aplicației phpmyadmin sau cu alte aplicații destinate pentru lucrul cu baze de date cum ar
fi: MySQL Front sau MySQL Workbench.
Cerințele de mai sus, sunt cerințe minime în construirea unei aplicații web și din
pacate nu permite accesul utilizatorilor la aplicație, doar pe local. Pentru ca aplicația să
poată fii d isponibilă utilizatorului trebuie să fie asociată unui domeniu și găzduită de un
server we b.

3.2 Arhitectura aplicației

Această aplicație conține fișiere cu diferite extensii cum ar fi : .php, .html, .css, . sql.
Fiecare fișier e interpretat într -un mod anume de către editorul de text și de către
navigator. Fișierele de tip .php conțin operațiile cu care lucrează aplicația și este o pagină
definită de limbajul de programare PHP. Extensia . html vine de la limbajul de marcare
HȚML și este interpretat ca atare, se poate adăuga text .php doar că acesta nu este
interpretat ca atare. F ișierele ce conțin extensia . css, sunt specifice lui Cascading Style
Sheets, adică, aici găsim tot ceea ce înseamnă s tilizarea paginii, iar în cele din urma avem
fișierele ce conț in extensia . sql, specifice bazelor de date MySQL, aici sunt stocate bazele
de date. Cu ajutorul acestor fișiere de tip SQL se pot face importuri pe diferite servere sau
calculatoare, exportul fiind realizat cu ajutorul aplicației phpmyadmin sau cu orice
aplicație care poa te rula pe MySQL.

Analiză, proiectare, implementare
17

Figura 3.0 : Diagrama use -case a utilizatorului

3.3 Arhitectura bazei de date

Crearea bazei de date se poate face cu unul din programele menționate mai sus și
anume MySQL Front sau MySQL Workbench dar și cu phpmyadmin, o aplicație destul de
simplă și uor de utilizat.
În cazul de față baza de date se numește magazinproteine și are în componența sa
un număr de 8 tabele fiecare cu un nume sugestiv pentru a putea fi mai ușor de indentificat
atunci când se operează asupra bazei de date. Fiecar e tabelă are un rol important în
aplicație, iar rularea aplicație i fără una dintre tabele afișează o eroare.

Analiză, proiectare, implementare
18
Figura 3 .1: Lista tabelelor din aplicația phpmyadmin

Figura de mai sus ne prezintă cele 8 tabele prezente în baza de date, iar rolul fiecărei
tabele o să fie spec ificat în rândurile ce urmează:

– Arome – are în componență câmpurile id și denumire. Id-ul este de tip integer,
reprezentând cheia primară a tabelei, este auto increment at astfel că fiecare
valoare nou adăugată este unică. Denumirea repr ezintă numele aromei. Rolul
tabelei este de a stoca denumiri în ceea ce privește aromele disponibile în aplicație,
rol de nomenclator.

– Cantitate – are în componență câmpurile id și denumire stocând date legate de
cantitățile disponibile. Are rol de nomenclator și prezintă cantitățile disponibile la
adăugarea unui nou produs de către administrator.

– Categorie – are în componență câmpurile id, denumire și pagina. Id-ul este tip
integer, auto increment at, denumire este de tip varchar și stochează denumirea
categoriei, iar pagina de tip varchar reprezintă numele paginilor definite în
aplicație pentru o anumită categorie. În cazul în care administratorul dorește să
mai creeze o categorie, acesta trebuie să îi declare un nume și im plicit să creeze în
cod o pagină nouă cu exact aceea și denumire cu cea declarată în baza de date, astfel
încat utilizarorul să aibă acces la categoria nou creată.

Analiză, proiectare, implementare
19 – Comanda – are în componență câmpurile id, idprodus, iduti lizator, nrcomanda,
nrbucati, adresa, observatii, telefon, expediata, dataadaugare. Id este de tip integer
autoincrement. Idprodus este de tip integer și are rolul de a reține id -ul produsului
comandat, c u ajutorul acestuia se face legă tura cu tabela produ se. Idutilizator este
de tip integer și rolul său este de a reține id -ul utilizatorului care efectuează o
comandă. Nrcomandă este de tip integer, pentru fiecare nouă comandă adăugată
se generează un nou număr de comandă. Nrbucati este de tip integer și sto cat în
acestă variabilă sunt numărul de bucăți pentru un produs adăugat de un utilizator
în comandă. Adresa este de tip varchar și aici se stochează adresa de livrare a
comenzii. Observații este de tip varchar și permite utilizatorului să adauge anumite
observații în legătură cu comanda dorită. Țelefon de tip varcha r, se stochează
numărul de telef on al utilizatorlui. Expediata este de tip integer și este 1 în cazul în
care comanda este expediată către client și 0 în cazul în care aceasta nu a fost încă
prel uată de către administrator. Data adăugare este de tip date time și are ca
valoare default CURRENȚ_ȚIMESȚAMP, salvează automat data la care s -a
înregistrat comanda. Rolul tabelei este de a stoca comenzile venite din partea
utilizatorilor, verificarea și ges tionarea comenzilor de către administror se face
aici.

– Cos_cumparaturi – are în componență câmpurile id, idprodus, idutilizator și
nrbucati. Id este de tip integer, autoincrement. Idprodus este de tip integer și are
rolul de a reține id -ul produsului sele ctat(comandat). Pe baza acestui câmp se face
legătura dintre tabela coș cumpărături și tabela produse. Idutilizator este de tip
integer și rolul său este de a reține utilizatorul care a adăugat un produs în coșul
de cumpărături, se crează legătura între ta belul cos_cumparaturi și tabelul
utilizatori. Nrbucati este de tip integer și după cum bine îi spune și numele are rolul
de a reține numărul bucăților comandate de către utilizator. Rolul tabelei este de a
stoca produsele comandate de către un utilizator a utentificat și la finalizarea
comenzii acestea fiind transferate în tabela cos_cumparaturi.

– Obiectiv – are în componență câmpurile Id, Denumire și Pagina , Id este de tip
integer, autoincrement, reprezintă cheia primară a tabelului. Denumire este de tip
varchar, are rolul de a stoca denumirea obiectivului, iar pagina reprezintă pagina
asociată în aplicație respectivului obiectiv. În cazul în care se dorește contruirea
unui nou obiectiv, este necesar ă creare a lui și pe urmă asocierea unei noi pagini în
aplicație.

– Produse – are în componență câmpurile Id, Denumire, Descriere, IdCategorie,
IdObiectiv, Pret, NrBucati, Poza, IdAroma, IdCantitate, Sters, DataAdaugarea. Id este
de tip integer, autoincrement, are rol de cheie primară. Denumire este de tip
varchar ș i are rolul de stoca titlul produsului. Descriere este de tip varchar, iar aici
după cum îi spune și denumirea se stochează descrierea produsului . Idcategorie
este tip integer și reprezintă legatura cu nomenclartorului de categorii. Idobiectiv
este de tip integer și are rolul de a face legătura dintre produs și obiectivul acestuia.
Pret este de tip integer și stochează prețul fiecărui produs. Nrbucati este de tip
integer și reprezintă numărul bucăților disponibile pe site pentru un anumit
produs. Poza este de tip mediublob și are rolul de stoca o imagine cu caracter
informațional despre un anumit produs. Idaroma este de tip integer și rolul său

Analiză, proiectare, implementare
20 este de a menține o legătură între tabela produs și tabela arome. Idcantitate este
de tip integer și prezintă legă tura între tabela produs și tabela cantitate. Sters este
de tip integer și are ca și semnificație 0 în cazul în care un produs încă este
disponibil pe site și 1 în cazul în care ac esta a fost șters. Deoarece legă tura dintre
tabela comanda și tabela produs se face pe baza unui idprodus, am decis ca la
ștergerea unui produs să nu se facă implicit un delete pe id -ul produsului ci mai
degrabă un update cu valoarea 1 pe câmpul sters. Dataadaugare este de tip date
time și are setată ca valoare implicită CURRENȚ_ȚIMESȚAMP. Rolul tabelei este de
a reține produsele disponibile în aplicație și mai apoi prezentate posibililor clienți.

– Utilizatori – are în componență câmpurile Id, Nume, Prenume, User, Parola, Email,
Acces, Da taCreare. Id este de tip integer, autoincrement, reprezintă cheia pr imară
a acestui tabel, face legă tura între tabela utilizator și restul tabelor care au în
componență câmpul IdUtilizator. Nume este de tip varchar și stochează numele
utilizatorului creat. Prenume este de tip varchar și stochează prenumele
utilizatorului creat. User este de tip varchar și stochează denumirea utilizatorului,
pe baza câmpului se fac verificările în cazul autentificării. Parola este de tip varchar
și reține parola util izatoru lui, de asemenea pe baza acestui câmp se face verificarea
în cazul autentificării. Email este de tip varchar și are rolul de a reține email -ul
utilizatorului creat. Acces este de tip integer și reține rolul unui utilizator, 0
utilizator normal, are dreptul de a cumpăra produsele disponibile pe site, 1
utilizator normal cu drepturi de administrator. DataCreare este de tip date time și
are setat ca valoare default CURRENT_TIMESTAMP.

3.4 Aspecte generale ale interfeței

Primul contact cu o aplicație web este foart e important pentru un utilizator
deoarece scopul unui magazin online este de a consuma un timp al clienților cât mai scurt
cu beneficii cât mai mari , astfel că o aplicație web trebuie construită în așa fel încât
utilizatorul să găsească ce ea ce caută într -un timp cât mai scurt. Acest scop este benefic
atât pentru utilizator cât și pentru deținătorul aplicației.
Consider ca o interfață user -friendly este benefică unei astfel de aplicații deoarece
pune în valoare lucrurile importante și oferă utilizatorului o senzație plăcută atunci când
își face prezența în aplicație. Am ales ca aplicația mea să fie una cu o interfață simplistă
care pune în evidență produsele disponibile, pe care utilizatorul le caută.
În vederea realizării design -ului, am a les să folosesc el emente de HTML stilizate cu
ajutorul css -ului sau bootstrap -ului.
Pentru a scoate în evidență produsele am decis ca, culoarea de fundal a aplicație i să
fie alb, astfel orice picur de culoare reprezintă un lucru important care necesită vizualizat.
Cum indu stria mobilă a luat amploare în ultimii ani, am decis ca aplicația mea să fie
mobile responsive, astfel că ea poate să fie accesată de pe un dispozitiv mobil, design -ul
modificându -se astfel încât ea să rămână la fel de atrăgătoare.

Analiză, proiectare, implementare
21 În prezentarea următoa relor imagini, o să fie atât design -ul de pe un laptop cu
rezoluție mare, cât și de pe un dispozitiv mobil.

3.5 Pagina index.php

Reprezintă prima pagină a aplicației, prin definiție serverul Apache consideră că
index.php este prima pagină din cadrul unei aplicații web. Construită pe un ton simplist,
încadrată între un antet și un subsol, pagina index prezintă un număr de șase produse
alease aleator din baza de date cu posibilitate de accesare asupra lor.
Antetul, prezent în întreaga aplicație, conține în p artea stângă denumirea aplicației
și meniul care ajută la navigarea în aplicație. Partea dreaptă a antetului este constituită
din legăturile către paginile de autentificare, respectiv înregistrare. O să vedem pe
parcursul acestei prezentări că antetul s e modifică în funcție de utilizatorul autentificat.
Sub antet găsim o poză, care are rolul de a introduce utilizatorul în lumea
bodybuilding -ului, dar totodată poate fi privită și ca o resursă motivațională. Imaginea de
mai jos reprezintă prima pagina a aplic ației mele web.

Figura 3.2: Antetul paginii vizualizat pe o rezoluție mare

Figura 3 .3: Antetul paginii vizualizat pe un dispozitiv de tip mobil

Analiză, proiectare, implementare
22
Spațiu l dintre antetul paginii și subsolul paginii este utilizat în scopul de a prezenta
produsele disponibile în aplicație. Sunt prezentate un număr de 6 produse alese aleator
din baza de date, utilizând interogarea următoare.

Figura 3 .4: Interogare produse p rima pagina

Figura 3 .5: Prezentarea produse lor pe pagina la rezoluție mare

În cazul accesării aplicației de pe un mobil, aplicația este redimensionată și fiecare
produs este prezentat în parte, unul sub altul.
Subsolul pagini este destul de simplu și ușor de identificat, iar rolul său este de a
informa utilizatorul c ă navigarea a ajuns la sfârșit.

Analiză, proiectare, imp lementare
23 3.6 Antetul paginii

Ca și interfață antetul paginii este alcătuit din meniul aplicației și o poză, iar în partea
din ”spate” se fac legăturile cu fișierele css, bootstrap și javascript. Meniul aplicației și
poza de fundal diferă ca dimeniuni în funcție de tipul de rezoluție de pe care se accesează
aplicația, iar meniul se schimbă în funcție de utilizator. Imaginea de mai jos ne prezintă
vizualizarea meniului pe un dispozitiv mobil.

Figura 3.6: Prezentare meniu utilizator în modul mobil

Cu ajutorul butonului din dreapta se face glisarea liniilor și prezentarea
posibilităților de navigare în aplicație. Se poate observa în imaginea de mai sus, că în
finalul listei sunt prezente două butoane Autentificare respectiv Inregistrare. Putem spune
că cele doua butonane se modifică în funcție de trei situații și anume:

1. Utilizatorul nu este autentificat, aplcația îi pune la dispoziție posibilitatea de
autentificare sa u înregistrare din meniu l prezentat mai sus.

2. Utilizatorul se înregistrează și pe urmă se autentifică pe baza unul utilizator și a
unei parole, astfel încât meniul îș i schimbă forma. Diferențele sunt prezentate în
imaginea de mai jos.

Analiză, proiectare, implementare
24

Figura 3 .7: Prezentare meniu posibil client în modul mobil

Se poate ob serva în imaginea de mai sus că butoanele Autentificare respectiv
Inregistrare au fost înlocuite cu Cos si Deconectare , ceea ce înseamnă că utilizatorul a fost
autentificat cu succes, deci are drep tul de a cumpăra produse.

3. Cel de -al treilea caz este reprezentat de drepturile administratorului, meniul, în
cazul autentificării unui adminstrator îsi schimbă iar forma, în componența lui
adăugandu -se înca un buton. Meniul administratorului este prezenta t în imaginea
de mai jos.

Figura 3 .8: M eniu l administratorul în modul mobil

Analiză, proiectare, implementare
25 3.7 Pagina inregistrare.php

Pagina înregistrare este alcătuită dintr -un formular care necesită completat în
vederea obținerii unui nou cont. Fără un cont nu se pot efectua cumpără turi. Imaginea de
mai jos prezintă formularul de înregistrare vizualizat pe o rezoluție mare.

Figura 3.9: Formular înregistrare cont nou vizualizat la rezoluție mare

După completarea câmpurilor nume, prenume, email, utilzator sau parola, butonul
înregistrare face ca datele să fie trimise din înterfață către secțiune a de php unde sunt
prelucrate. Aceste prelucrări constau în faptul că, fiecare câmp este verificat în parte dacă
este completat, iar în cazul în care lipsesc date atunci utiliz atorul este înștiințat printr -un
mesaj.

Figura 3.10: Mesajul afișat în cazul în care câmpurile nu sunt completate

Analiză, proiectare, implementare
26 Cea de -a doua prelucrare constă în verificare a inputului de tip checkbox dacă este
bifat, semnifi cația inputului o reprezintă ac ordul dat din partea utilizatorului asupra
termenilor și condițiilor utilizate de către aplicația web. În cazul în care câmpul nu este
bifat, utilizatorul o să fie înștiințat cu un mesaj.
A treia prelucrare și poate cea mai importantă, după finalizarea verificărilor se trece
la inserarea datelor în tabela utilizatori. Interogarea care face posibilă inserarea este
prezentată în imaginea de mai jos.

Figura 3 .11: Interogarea bazei de date utilizatori

Inserarea cu succes se face cunoscută utilizatorului printr -un mesaj afișat într -o
alertă javascript și redirecționarea automată a acestuia către pagina de autentificare.

Figura 3 .12: Mesaj confirmare îmregistrare cu succes

3.8 Pagina autentificare .php

Odată înregistrat, utilizatorul se poate autentifica cu ajutorul nume lui de utilizator
și a parolei aleasă de către el. Buton ul Autentificare , trimite datele din fo rmular către
prelucrare în php.

Figura 3.13: Formular autentificare

Analiză, proiectare, implementare
27
Validarea datelor se face utilizând php și constă în verificarea câmpurilor dacă sunt
completate și căuta rea în baza de date dacă utilizatorul introdus există. Fiecare verificare
înștiințează utilizatorul cu un răspuns prin intermeniul unei alerte javascript.
Rolul autentificării este de a verifica în baza de date existența unei înregistrăr i care
are salvate în cămpurile utilizator și parola , valorile introduse în formular. În cazul in care
datele nu coincid, utilizatorul este informat de acest lucru printr -un mesaj, tot odată și în
cazul autentificării cu succes utilizatorul poate vizualiza un mesaj după care este
redirecționat către pagina index a aplicației.

Figura 3.14: Mesaj când dat ele utilizatorului nu corespund

Verificarea cu succes presupune înregistrarea unor date în variabile de tip ses iune,
date utilizate pe întregul parcu rs al aplicației. Aceste date ar fi Id-ul utilizatorului care se
folosește la adăugarea unui produs în coș , pe baza acestui câmp la vizualizarea coșului de
cumpărături sunt aduse produsele din baza de date. Cea de -a doua variabilă de tip sesiune
se numește acces și are rolul de a stoca drepturile unui utilizator.
Am decis ca, câm pul acces să rețină valorile 1 respectiv 0, valori care sunt verificate
la crearea meniului. Valoarea 0 permite utilizatorilor doar achiziționarea de produse din
aplicație, în schimb valoarea 1 dă posibilitatea utilizatorului pe lăngă achiziționarea de
produse și gestionarea aplicației .
În concluzie utilizatorii care au în dre ptul câmpului acces valoarea 1 , au drepturi de
administrator.

Analiză, proiectare, implementare
28 3.9 Gama noastră

În meniu se poate observa exisța unui buton denumit Gama Noastra , rolul acestuia
fiind acela de a prezenta utilizatorilor produsele în funcție de o categorie. Produsele sunt
sortate pe game în funcție de categoria introdusă de către administrator la adăugarea unui
produs în baza de date.

Figura 3.15 : Prezent are produse în funcție de o gama aleasă la o rezoluție mare

Se poate observa în imaginea de mai sus modul în care sunt prezentate produsele
utilizatorului în funcție de o gamă aleasă. Putem spune că pagina se împarte în două părți,
prima parte o reprezintă un meniu, cu rol de filtrare a produselor în funcție de o gamă sau
de un obi ectiv ales. Cea de -a doua parte a imaginii reprezintă prezentarea gamei alese și
a produselor care fac parte din gama respectivă.
Fiecare gamă este alcătuită dintr -un titlu (numele gamei), o descriere și produsele
care fac parte din gama respectivă. Țeoret ic fiecare gamă de produse are asociată în baza
de date , în tabela categorie, o pagină, cu ajutorul căreia este posibilă navigarea între game.
La utilizarea aplicației pe mobil prezentarea produselor ca și design se schimbă,
adică se adaptează în funcție d e rezoluția ecranului.

Analiză, proiectare, implementare
29
Imaginea de mai jos prezintă produsele în cazul vizualizării de pe o aplicație mobilă.

Figura 3.1 6: Vizualizarea unui produs dintr -o gamă în modul mobile

Prezentarea produselor este posbilă datorită unei interogări mysql, care preia
datele din tabela produse în baza câmpului IdCategorie și Sters. Idcategorie reprezintă id –
ul fiecărei game, iar sters are rolul de a evidenția produsele care din punctul de ved ere al
administratorului nu mai sunt disponibile spre vânzare. Interogarea care face aceste
prelucrări este prezentată în imaginea de mai jos.

Figura 3.17 : Intergorare , extragere produse din baza de d ate în funcție de o gamă
aleasă

Butonul cumpără din prezentare produsului poartă rolul de cale de acces către
pagina de prezentare detaliată a unui produs. Pagină unde se poate efectua și
achiziționarea implicită a unui produs.

Analiză, proiectare, implementare
30 3.10 Pagina cumpara.php

Este o punte de acces către achiziționarea unui produs, o punte care se deschide în
momentul în care utilizatorul este interesat de mai multe detalii legate de un produs.

Figura 3 .18: Prezentare produs la o rezoluție mare

Împărțită în două, pagina cum pară are rolul de a prezenta produsul selectat preluând
toate informațiile din baza de date legate de produsul respectiv. Prima parte, partea din
stânga are în componență o imagine cu scop informativ, cea de -a doua parte prezintă
elemente distincte despre produs. Element e cum ar fi denumire, descriere și categoria din
care face parte, obiectivul caruia îi este destinat produsul, aromă , cantitat e, preț și
numărul bucăților disponibile.
In josul celei de -a doua părți se poate observa un câmp buc și un buton Cumpara
acum, care în imaginea de mai sus este dezactivat. Deoarece achiziționarea unui produs
se face doar pe baza unei autentificări în sistem, am decis ca butonul cumpara acum și
câmpul buc să fie disponibile utilizatorilor doar după ce aceștia se autent ifică în sistem,
astfel evităm achiziționarea produselor fără asocierea unui utilizator.
Se presupe că utilizatorul este autentificat deci are posibilitatea de a achiziționa un
produs. La accesarea butonului cumpara acum în sistem se verifică dacă numărul
bucăților disponibile este mai mare decât numărul bucăților cerute de către utilizator. În
caz negativ utilizatorul este înști ințat de către aplicație că ” Numarul de bucati comandate
este mai mare decat cantitatea disponibila!”.

Analiză, proiect are, implementare
31 În caz afirmativ, numărul bucăților comandate este mai mic decât numărul bucăților
disponibile, se face inserarea în tabela cos cumpăraturi cu produsul dorit de către
utilizator.
Înainte de a se face inserarea în tabela cos cumpărături sistemul are obligația de a
scădea din dreptul produsului cantitatea cerută de către utilizator. Cu alte cuvinte, odată
cu adăugarea produsului în coșul de cumpărături aplicația rezervă produsul pentru
utilizatorul respectiv.
Dacă câmpul buc nu este completat, aplicația consideră că valoarea din el es te 1, deci
o bucată.
O parte din aceste prelucrări sunt prezentate în imaginea de mai jos.

Figura 3 .19: Prelucrări în vederea adăugării unui produs în coșul de cumpărături

Analiză, proiectare, implementare
32 3.11 Coșul de cumpărături

Produsele dorite de un utilizator sunt adăugate în coșul de cumpărături, la baza
coșului stă tabela cos_cumparaturi , unde s unt stocate produsele. În tabelă pe baza
câmpurilor IdUtilizator și IdProdus se face legătura cu tabele le utilizatori și produse.
Principiul de funcționare a unui coș de cumpărături este destul de simplu, odată
autentificat se poate observa în meniu adăugarea butonului Cos cumparaturi , buton care
redirecționează utilizatorul către o nouă pagină unde pe baza id -ului din sesiune se face
preluarea și prelucrarea datelor din tabela produse.
Produsele sunt prezentate sub forma unui tabel responsive unde utili zatorul poate
vizualiza o mică descriere alcătuită din denumirea și categoria produsului, cantitatea
comandată, prețul produsului pe o u nitate și prețul pe cantitatea comandată. Imaginea de
mai jos pune în evidență elementele unui coș de cumpărături.

Figura 3.20 : Vizualizare coș cumpărături

Se poate observa în imaginea de mai sus că în dreptul fiecărui produs există un buton
asemănător unui coș de gunoi. Semnificația acestui buton este aceea de a permite
utilizatorului să elimine din coșul de cumpărături un produs pe care nu îl mai dorește.
Prin eliminarea unui produs întelegm ștergea lui din tabela cos_cumparaturi și
adăugarea bucățil or rezervate înapoi în tabela produse. Pentru a putea fi posibilă aceast ă
adăugarea aplicația rulează algoritm ul prezentat mai jos.

Analiză, proiectare, implementare
33
Figura 3.21 : Prezentare algoritm de ștergere produs din coșul de cumpărături

O mică explicație a algoritmului ar fi că, printr -un formular sunt trimise date legate
de produs în pagina șterge produs, unde se fac prelucrări asupra acestor date. Datele
trimise sunt id -ul produsului din coș pe baza căruia se face ștergerea din tabela
cos_cumparaturi , id-produsului din tabela produse, id pe baza căruia se face la final
adăugarea bucăților înapoi în tabela produse, nr_bucati și nr_bucati_comandate sunt
variabilele care adunate le un loc alcătuiesc stocul inițial al produsului.
În cazul în care toate acest e prelucrări au fost finalizate cu succes, utilizatorul este
înștiințat de reușită printr -o alertă de tip javascript cu textul ”Produsul a fost eliminat din
cosul dumneavoastra de cumparaturi”.
În dreapta jos a imaginii care prezintă coșul de cumpărături s e poate observa un
buton care poartă denumirea Finalizare comanda , buton care face legătura către pagina
finalizare comandă .

Analiză, proiectare, implementare
34 3.12 Finalizare comandă

Pagina finalizare comandă este constituită dintr -un formular unde utilizatorul are
obligația de a -și completa adresa și numărul de telefon, date esențiale pentru a putea
expedia comanda către client. Un al treilea câmp este disponibil utilizatorului și anume
observații, câmp unde se poate completa orice specificație din partea clientului. În partea
stângă a paginii sunt prezentate : valoare a comenzii și totalul comenzii cu tot cu transport.

Figura 3.22: Pagina finalizare comandă vizualizată pe mobil

În josul imaginii de mai sus se poate observa butonul Finalizare comanda , rolul său
fiind acela de a decla nșa algoritmul prin care se golește coșul de cumpă rături și se
populează cu date tabela comandă.
În prima etapă algoritmul verifică dacă câmpurile adresa și telefon sunt completate,
în caz negativ utilizatorului îi este adus la cunoștință acest lucru print r-o alerta javascript,
iar în caz contrar algoritmul continuă cu , căutarea celul mai mare num ăr de comandă din
tabela cu același nume , acest lucru reprezentând pasul doi din algoritm. Pentru fiecare
comandă nouă se atribuie un nou număr de comandă. Interog area care caută cel mai mare
număr de comandă este prezentată în imaginea de mai jos.

Figura 3.23 : Cautarea maximului pe comandă

Analiză, proiectare, implementare
35 A treia etapă o constituie incrementarea numărului maxim din comandă, extras mai
sus cu 1, astfel se generează un nou număr de comandă.
Următorul algoritm are obligați a de a prelua datele din tabela cos_cumparaturi și
printr -o blucă introducerea lor în tabela comanda, cu tot cu numărul nou de comandă.

Figura 3.24 : Preluarea datelor din tabela cos_cumparaturi și inserarea lo r în tabela
comandă

Finalizarea unei comenzi se realizează în momentul în care din tabela
cos_cumparaturi sunt eliminate toate produsele care apațin utilizatorului conectat adică
utilizatorului salvat pe sesiune. Imaginea de mai jos prezintă ștergerea efectivă a
produselor din tabela cos_cumparoturi.

Figura 3.25 : Interogarea care șterge datele din tabel ul cos_cumpara turi

Dacă toate interogările au rulat cu succes, atunci utilizatorul este înștiințat de
plasarea comenzii printr -o alertă de tip javascript care conține mesajul ” Comanda
dumneavoastra a fost inregistrata cu succes! In curand o sa fiti contactat de unul din
operatorii nostri. Va multumim. ”
Cu acest mesaj se înc heie procedul de achiz ioționare a unuia sau mai multor produse
disponibile în aplicație.

3.13 Obiective le tale
Revenind la meniu , se poate observa existența unui buton Obiectivele tale, rolul
aces tuia fiind acela de a prezenta produsele sub foma unui obiectiv. În cazul în care
utilizatorul spre exemplu dorește produse care l -ar ajuta să crească în masă musculară și
nu știe ce anume tre buie să comande atunci intră categoria obiective și alege domeniul
dorit.
Pagina preia și afișează produsele din baza de date în funcție de un obiectiv ales și
ca design se împ arte în două pă rți.

Analiză, proiectare, implementare
36 Prima parte , partea din stânga este alcătuită dintr -un meniu cu rol de filtre,
asemănator cu cel disponibil și în cazul afișării produselor dacă s -a ales o categorie, iar în
partea dreapt ă sunt prezentate informații legate de produse, respectiv obiectivul ales.
Imaginea de mai jos prezintă elementele de design ale unei pagini din cadrul obiectivelor.

Figura 3.26 : Prezentare pagină obiectivele tale

Partea din drepta a paginii are în componență o poză care se schimbă pentru fiecare
obeictiv în parte, o descriere pentru fiecare obiectiv și în subsolul paginii sunt prezentate
produsele care aparțin obiectivului selectat. Denumirea obiectivelor este salv ată în tabela
obiective, iar prin câmpul IdObiectiv din tabela produse se leagă de tabele le între ele.
Dacă se dorește crearea unui nou obiectiv, mai întâi trebuie alocat ă în tabela
obiective o nouă înregistrare, un nume de obiectiv și un nume de pagină p entru obiectivul
respectiv și pe urmă crear ea paginii din cod, pe baza paginilor create deja.
Produsele din pagina care aparține unui obiectiv, la achizioționare urmează acelaș i
traseu prezentat mai sus în cadrul produselor sortate pe categorie.

Analiză, proiectare, implementare
37 3.14 Subsol ul paginii

Cum spuneam la începutul prez entării aplicația este încadrată între un antet și un
subsol, prezentarea antetul ui a fost făcută deja, a mai rămas prezentarea subsolul, care nu
este destul de complicată. Alcătuit din numele utilizatorului și lin k-ul de legătură către
pagina cu termenii și condițiile aplicației, subsolul este mai de grabă un element de design
decăt un element care ajută la buna funcționalitate a aplicației. Imaginea de mai jos
prezintă design -ul subsolului.

Figura 3.26: Prezentare subsol aplicație

3.15 Pagina termeni și condiții

Are rolul de a prezenta term enii și condițiile asupra cărora este supus un utilizator
în cazul creării unui cont. Nu este altceva decât o pagină HȚML, iar pentru schimbarea
informațiilor din ea treb uie deschisă pagina într -un editor de text și înlocuite sau
îmbunătățite informațiile dintre tag -urile HTML.
Ca și funcționalitatea această pagină nu are o funcționalitate anume, singurul său
rol este acela de a i nforma utilizatorul asupra căror termeni ș i condiții se supune la
crearea unui cont în aplicație.
Imaginea de mai jos prezintă design -ul paginii termeni și condiții precinzând că
textul este cu rol informativ.

Figura 3.27: Prezentare pagina termeni și condiții

Analiză, proiectare, implementare
38 3.16 Pagina administrare

Putem spune ca este una dintre cele mai importante pagini din aplicație, scopul ei
fiind acela de a gestiona produsele și comenzile din aplicație. Este destinată exclusiv
administratorilor de aplicație. Prin administrator întelegem persoanele care în dreptul
câmpului acces din tabela utilizatori au asociată valoarea 1 .
Accesul la pagină se face din meniul principal, după autentificare a și verificarea
datelor, mai exact verificarea câmpului acces .
Are la bază un meniu (prezentat în imaginea de mai jos) care ajută administratorul
să navigheze între functionalitățile paginii de administrare.

Figura 3.28 : Meniu administrator vizualizat la o rezoluție mare

Ca o mică prezentare a meniului , putem spune că în par tea din stânga a acestuia sunt
prezentate sub forma unor categorii prelucrările disponibile administrator ului. Butonul
Produse arată utilizatorului funționalități în vederea prelucrării produselor, butonul
Comenzi arată utilizatorului funcționalități în ve dere a prelucrării comenzilor. În partea
dreapta sunt prezente doua butoane, rolul acestora fiind de a redirecționa
administratorul către pagina de index (butonul Site) și de a deconecta administratorul
(butonu deconectare ).

Prima funcționalitate a meniului este butonul Produse care are scopul de a ară ta
administratorului produsele disponibile în aplicație cu posibilitatea de a le șterge, dar
logic vorbind pentru a șterge un produs, mai întâi trebuie adăugat, astfel că la accesarea
butonului produ se se deschide un formular de adăugare produs.
Formularul este incadrat între tag -urile html <form> … </form> și prezintă
administratorului o serie de câmpuri care necesită completate înainte de adăugarea
produsului . Printre aceste câmpuri se numără și cele de selectare categorie, obiectiv,
arome și cantitate, câmpuri care la origine sunt selecturi încadrate între tag -urile <select>
… </select> și au rolul de a prezenta categoriile și obiectivele salvate în baza de date,
practic sunt nomenclatoare. Infor mațiile din selecturi sunt aduse d in tabele cu acel ași
nume ca și câmpurile
Apăsarea butonului Adauga produs declanșează modulul de prelucrare a datelor în
vederea adăugării lor în baza de date. Mai întai se verifică dacă toate cămpurile sunt
completate, i ar în caz contrar administratorul este informa t de acest lucru printr -o alertă
de tip javascript. Dacă toate câmpurile sunt completate atunci se trece la inserarea
efectivă în baza de date. În cazul în care inserarea a fost efectuată cu succes

Analiză, proiectare, implementare
39 administrato rul este informat de acest lucru și poate continua cu următoarea prelucrare
disponibila în pagina administrare. Imaginea de mai jos prezinta des ign-ul formularului
de adăugare a unui nou produs.

Figura 3.29 : Formular pentru adaugarea unui nou produs viz ualizat la rezoluție mare

Formularul de adăugare produs permite și încarcarea unei imagini și salvarea ei în
baza de date într -un câmp de tip blob.
Prezentare a produselor adăugate deja în baza de date se face sub formular de
adăugarea și prezintă admini stratorului toate produele din baza de date care nu sunt
șterse. În dreptul fiecărui produs este disponibil un buton șterge, care dă posibilitatea
administratorului de a dezacti va un produs, prin dezactiva înț elegem modificarea
câmpului sters din tabela produse din valoarea 0 în valoarea 1 . Prin acest procedeu
produsul nu mai poate fi vizualizat de către utilizator sau administrator.

Analiză, proiectare, implementare
40 Pentru a face munca administr atorului mai ușoară în aplicație am implementat un
modul prin care se poate căuta în funcție de o categorie selectată. Imaginea de mai jos ne
arată cum sunt prezentate produsele administratorului și formularul de căutare.

Figura 3.30: Prezentare produse administrator și formular căutar e

A doua funcționalitate a meniului este butonul Comenzi care a re rolul de a prezenta
administratorului comenzile care s -au generat în aplicaț ie. Imaginea de mai jos prezintă
vizualizarea unei comenzi.

Figura 3 .31: Prezentare comenzi la o rezoluție mar e

Analiză, proiectare, implementare
41 Primul pas în vederea vizualizării unei comenzi este selectarea numărului de
comandă cu ajutorul unui formular prezentat chiar la începutul paginii.
Butonul Cauta execută scriptul care aduce datele din tabela comenzi în cazul în care un
număr de coma ndă este selectat, în caz contrar administratorul este înștiințat că nu a
selectat un număr de comandă.
Al doilea pas prezintă administratorului datele salvate în baza de date, date legate
de utilizator dar și de produsele comandate. Datele legate de utilizator sunt prezentate
chiar la începutul comenzii, iar produsele sunt prezentate sub forma unui tabel de tip
responsive. La finalul tabelului este calculat un total pe întreaga comandă și un total care
include și transportul .
Al treilea pas, după cum se poate observa în imagin ea de mai sus sunt prezente
două butoane în josul paginii, un buton Expediaza comanda și altul Anuleaza comanda ,
reprezentând prelucrăril e la care are acces administratorul în secțiunea destinată
comenzilor.
Se presupune că administrato rul după ce vizualizează comanda , înștiințează
clientul de primirea ei printr -un telefon, prin care se cere acceptul clientului de a livra
comanda. Aici put em distinge două cazuri:
Primul caz :
Clientul își menține poziția deci dorește livrarea comenzii, lucru semnalat de către
administrator prin accesare butonul Expediaza comanda. Rolul butonului este de a seta în
tabela comanzi, în dreptul câmpului expediat valoarea 1, proces care semnifică faptul că,
comanda a fost expediată, deci aceasta nu mai trebuie să fie vizualizată de către
administrator. Imaginea de mai jos prezintă aceste prelucrări.

Figura 3 .32: Cod expediază comandă

Analiză, proiectare, implementare
42 Al doilea caz :
Cel de -al doilea caz este reprezentat de refuzul clientului, a dică după telefonarea
acestuia de către administrator dorește anularea comenzii. Administratorul are acest
drept de a anula o comandă folosind butonul Anuleaza comanda . Prin anularea comenzii
se înțelege ștergerea ei din tabela comenzi și reintroducerea bucăților comandate înapoi
sprea vânzare. Imaginea de mai jos prezintă secvența de cod care face aceste prelucrări.

Figura 3 .33: Cod anulează comandă

Administratorul este înștiințat de reușita șterger ii unei comenzi printr -o alertă de
tip javascript cu textul ” Comanda a fost stearsa, produsele au fost puse inapoi in stoc”.

Analiză, proiectare, implementare
43 3.17 Deconetarea

În cele din urmă am ajuns la finalul discuției noastre care nu se poate încheia altfel
decât cu explicare butonul deconectare . Nu prea sunt multe lucruri de spus aici, rolul
acestuia fiind de a distruge sesiunea de lucru și de a redirecționa utilizatorul s au
administratorul către pagina index.php. Imagina de mai jos prezintă secveța de cod care
realizează acest lucru.

Figura 3.34 : Cod deconectare

Cea de -a doua poză prezintă butonul care declanșează acțiunea de deconectare din
aplicație.

Figura 3.35 : Buton deconectare

Analiză, proiectare, implementare
44 3.18 Testarea și validarea datelor
Partea de testare și validare s -a realizat inițial cu ajutorul unor date fictive introduse
în baza de date. Pe baza acestor date s -a construit design -ul aplicației și s -a testat
funcționarea lui p e tehnologii mobile.
Odată cu avansarea aplicației s -a creat pagina de administrare de unde
administratorul are dreptul de a adăuga produse și de a verifica comenzile adăugate.
După adăugarea produselor s -a reluat testarea cu ajutorul datelor valide introd use
de către administrator.
Pe partea de administrare s -a testat adăugarea și ștergerea de produse, comenzile
disponibile, anularea comenzii și expedierea comenzii către client.
Pe parte de utilizator s -a testat crearea unui nou cont, autentificarea în si stem,
vizualizarea produselor, adăugarea în coșul de cumpărături, eliminarea unui produs din
coș și plasarea comenzii.

3.19 Manualul de Instalare și Utilizare a aplicației
Pentru a putea avea acces la aplicație , utilizatorul are nevoie de un minim de resurse
și anume, aplicația fiind una de tip web utilizatorul are nevoie de un server Apache și o
baza de date MySQL, aceste componente sunt oferite de către programul Apache.
Pentru editarea codului se poate utiliza orice editor de text cum ar fi Notepad,
Notepad++, PHPStorm, în cazul meu eu am folosit NetBeans.
Accesul la baza de date se face utilizând aplicația phpmyadmin, sau utilizând alte
componente disponibile pe piață, MYSQL Workbeanch, SQL YOG, MYSQL Front.

Concluzii
45 4 Concluzii
4.1 Rezultate obținute
Țrăind într -o lume în care internetul pune stăpânire tot mai mult pe toate domeniile
de muncă și dezvoltare , omul este obligat să se adapteze noilor tehnologii care vin cu
scopul de a ajuta și a face mult mai ușoară v iața. Unul dintre cele mai mari avantaje ale
unui sistem informatic constă în capacitatea lui de a prelucra în mod sistematic o mare
cantitate de informații la o viteză relativ mare spre deosebire de creierul uman care poate
prelucra doar date puține la o viteză mare.
Am ales ca temă pentru proiectul meu de diplomă un magazin online, deoarece
majoritatea achizițiilor se încearcă a se trece în mediul online.
Am încercat să construiesc o aplicație fiabilă și ușor de înțeles de către utilizatori ,
lucru care co nsider eu ca mă avantajează față de concurență. Un al doilea avantaj pe care
îl am, este că structura aplicației este construită în așa fel încât acesta să fie accesată și de
pe dispozitive mobile, design -ul adaptându -se în funcție de rezoluție.

4.2 Direcții de dezvoltare
Pe viitor consider că aplicația, în cazul unui număr mare de utilizatori și implicit de
comenzi, ar trebui să utilizeze un alt tip de server pentru stocarea datelor, deoarece
MySQL din punct de vedere al prelucrării unui număr mare date are a numite probleme de
performanță. Propunerea mea ar fi rescrierea în SQL Server.
Din punct de vedere a aplicației se pot implementa noi filtre pentru utilizatori care
să ajute la sortarea produselor, iar pe partea de administrare, pot fi atribuite mai multe
operații cum ar fi adăugarea de noi categorii de produse, se pot crea statistici pe produse,
pe utilizatori dar și ștergerea sau blocarea unor utilizatori

Bibliografie
46 Bibliografie
[1] http://www.websiteuri.ro/ce -este -un-website.html
[2] http://www.websiteuri.ro/ce -este -un-magazin -online.html
[3] http://web.ceiti.md/lesson.php?id=1
[4] https://www.w3schools.com/tags/ref_byfunc.asp
[5] http://web.ceiti.md/lesson.php?id=7
[6] http://web.ceiti.md/lesson.php?id=2
[7] http://www.e -learn.ro/tuto rial/css/ce -este -css-a/67/1/37.htm
[8] https://ro.wikipedia.org/wiki/JavaScript
[9] curs BD an 2