Dezvoltarea unei aplica ții web ce ofer ă informa ții din lumea fotbalului Coordonator științific Absolvent Lector dr. Ciuc ă Marian -George Radu… [626581]

Ministerul Educației Naționale și Cercetării Științifice
Universitatea OVIDIUS Constanța
Facultatea de Matematică și Informatică
Specializarea Informatică

LUCRARE DE LICEN ȚĂ

Dezvoltarea unei aplica ții web ce ofer ă informa ții din
lumea fotbalului

Coordonator științific Absolvent: [anonimizat] 2018

Cuprins

1.Introducere………………………………………………………………………… 1
1.1 Motivația alegerii temei ..………………………………… …………………… . 1
2.Tehnologii folosite pentru realizarea aplicației …………………………………. 2
2.1 HTML5…………………………………………………………………………… 2
2.2 CSS3………………………………………………………………………………. 3
2.3 Bootstrap………………………………………………………………………… 4
2.4 PHP……………………………………………………………………………… 6
2.5 MySQL………………………………………………………………………..… 7
3.Structura si implementarea aplicației ……………………………………………. 8
3.1 Structura aplicației …………………………………………………………….. 8
3.2 Baza de date …………………………………………………………………….. 9
3.2.1 Structura tabelelor bazei de date …………………………………………………. 10
3.2.1.1 Tabelul administratori ……………………………………………………….. 10
3.2.1.2 Tabelul articole ……………………………………………………………….. 10
3.2.1.3 Tabelul categorii ………………………………………………………………. 10
3.2.1.4 Tabelul comentarii ……………………………………………………………. 10
3.2.1.5 Tabelul echipe ………………………………………………………………….. 11
3.2.1.6 Tabelul jucatori ………………………………………………………………… 11
3.2.1.7 Tabel ul meciuri ………………………………………………………………… 11
3.2.2 Creearea baze lor de date …………………………………………………………… 12
3.3 Variabile superglobale ………………………………………………………….. 13
3.3.1 Superglobala _SESSION…………………………………………………… 13
3.3.2 Superglobala _GET………………………………………………………… 13
3.3.3 Superglobala _POST……………………………………………………….. 13

3.3.4 Superglobala _FILES…………………………………………… .…… .……… 14
3.4 Impl ementarea aplicației ………………………………………………………….. ……………….. 14
3.4.1 Crearea conexiunii către baza de date ……………………………… .……… 14
3.4.2 Adăugarea informațiilor în baza de date ……………………………… .…… 14
3.4.3 Afișarea informațiilor din baza de date ………………………………… .…… 16
3.4.4 Editarea/ștergerea informațiilor din baza de date ………………… .……….. 17
3.4.5 Căutarea informațiilor din baza de date ………………………… ….……….. 17
3.4.6 Paginația ……………………………………………………………………….. 18
3.4.7 Afișarea mesajelor…………………………………………………………….. 18
3.4.8 Afișare data/ora…………………………… …………… ………………………. 19
3.4.9 Adăugarea comentariilor …………………………………………….……….. 19
3.4.10 Aprobarea și afiș area comentariilor …………………………………………………….. 20
3.4.11 Adăugare administrator ………………………………………………………………………. 21
3.4.12 Logarea în partea de administrare …………………………………………. 22
3.4.13 Verificare logare ………………………………………………………………………………….. 24
3.4.14 Delogarea…………………………………………………………………….. 24
4.Prezentarea și testarea aplicației …………………………………………………… 25
5.Concluzii ……………………………………………………………………………… 41
6.Bibliografie …………………………………………………………………………… 42

1
1.Introducere

1.1 Motivaț ia alegerii temei

Fotbalul este cel mai jucat și cel mai urmă rit sport de pe planet ă.Cu peste 4 mil iarde
de urmă ritori,fotbalul devan sează sporturi precum cricketul sau hocheiul de i arbă cu peste
1 milliard de urmă ritori (cricketul -2,5 miliarde/hocheiul de iarbă -2 miliarde) [11].
Fiind un sport atât de urmă rit,numero și oameni sunt angajaț i pentru a oferi cele mai
noi informa ții despre echipe sa u despre jucă tori. Oamenii sunt interesați să afle ultimele
detalii înaintea unui meci(declaraț ii ale antrenorilor de la conferințele de presă,schimbări
in lotul de jucători,accidentă ri ale jucă torilor). În trecut,z iarele erau cump ărate de la
chioșcuri,existau programe de meci ce ofereau aceste informații,î nsă,odat ă cu apariț ia
internetului,tirajul ziarelor a scă zut dramatic, în Romania mai existâ nd un singur ziar de
profil sportiv(Gazeta Sporturilor) .
Timpul economisit este principalul mot iv pentru care s -a făcut trecere a de la formatul
fizic la cel online. Din confortul camerei proprii, se pot primi aceste informații foarte
ușor.O simp lă căutare pe internet returneză mii de rezultate despre orice lucru din
lume,inclusiv despre fotbal.
Acest lucru,plus faptul că sunt un mare fan al fenomenului numit fotbal,m -a facut să
realizez această aplicaț ie.

2

2. Tehnologii folosite pentru realizarea aplica ției

Pentru realizarea aplicaț iei am folosit limbajul de mark -up HTML5,CSS3(pentru formatarea
conținutului),framework -ul Bootstrap,limbajul de scripting PHP și sistemul de gestiune a bazelor
de date MySQL.

2.1 HTML5

HTML5(Hyper Text Markup Language) este un limbaj de mark -up ce define ște structura
proiectelor web , creat de că tre progra matorul englez Tim -Berners -Lee î n anul 199 3.Este format
dintr -un set de elemente reprezentat de taguri(etichete) .De obicei,aceste taguri se află î n perechi
de forma:
<etichetă>conținut</etichetă >
Un exemplu de fișier HTML este urmă torul:

Fig.1 Cod HTML

Fig. 2 Rezultatul execuț iei codului HTML

3
Tagul <!DOCTYPE html> împreună cu perechea <html></html> arata faptul că acesta este
un document de tip HTML .Perechea <head></head> conț ine de obicei titlul paginii(aflat î ntre
tagurile <title>< /title>) si legăturile catre fiș ierele CSS sau JavaScript. În perechea
<body></body> este afișat conținutul fiș ierului HTML, <p></p> este perechea de etichete ce
defineș te un paragraf , iar finalul unui fiși er HTML este reprezentat de către î nchiderea etichetei
html (</html>).Un fișier HTML se creează î ntr-un editor de text (de
exemplu:Notepad, Atom,SublimeText) si se salvează fie cu extensia .html sau .htm. Alte etichete
folosite î n proiectul final sunt :
o <ul></ul> – creare l istă neordonată (un-ordered list )
o <li></li> – afișarea elementelor unei liste
o <table></table> – creare tabel
o <form></form> – creare form
o <input> – câmp unde se pot introduce date
o <a></a> -legătură către o altă pagină
o <img> – inserare imagine

2.2 CSS

CSS3(Cascading Style Sheets) este un lim baj folosit pentru a stiliza fiș ierele de tip
HTML.A fost creat de că tre norvegianul Hakon Wium Lie,împreună cu englezul Tim -Berners î n
anul 1993. Cu ajutorul CS S-ului se pot modifica poziț ia,culoarea sau dimensiunea unui element
HTML[2 ].Eticheta specifică CSS este eticheta <style>. Pentru a selecta un element HTML putem
adăuga clase sau id -uri,în cazul în care se dorește diferențierea modului de afiș are a
elementelor. CSS poa te fi adăugat unu i fișier HTML în două moduri:fie intern,adă ugat direct in
eticheta <head> ,fie extern,î n acest caz în <head> adaugâ ndu-se eticheta <lin k> cu legătura către
locația fiș ierului (fișier sal vat cu extensia .css) ce conț ine codul pentru stilizare.

Fig.3 CSS Intern Fig.4 CSS Extern

4

Fig.5 Rezultatul execuț iei codului HTML+CSS pentru ambele scenarii

Pentru a selecta o clasă se folose ște ‘.’,urmat de numele dat clasei,iar pentru a selecta un
id se foloseste ‘#’,urmat de numele dat id -ului.Alte utiliză ri ale CSS folosite in proiect sunt:

o font-size: stabile ște dimensiunea unui element
o font-family: tipul de font al elementului
o background -color:culoarea de fundal a elementului
o padding: adaugă spaț iu in jurul elementului
o width/height:lungimea/înalț imea unui element
2.3 Bootstrap

Bootstrap a fost dezvoltat de că tre angajaț ii companiei Twitter î n anul 2011 ,fiind unul
dintre cele mai populare frameworkuri ce poate fi f olosit pentru a dezvolta aplicaț ii web ,in
special pentru telefoane mobile [3].În Bootstrap sunt pre -definite clase ce ajută la îmbunătăț irea
aspectului si funcționalităț ii unei p agini. Pentru a putea f olosi Boots trap este nevoie să fie incluse
fișierele CSS,respectiv JavaScript,împreună cu jQuery(libr ărie JavaScript). Aceste fișiere pot fi
descă rcate de pe site -ul official Bootstrap( getbootstrap.com).
Una dintre ce le mai importante funcționalităț i ale frameworkului este sistemul de
grid,sistem folosit pentru a afișa elementele HTML în funcț ie de dimensiunea dispozitivului de
pe care este accesat un site. Pentru a putea folosi acest s istem este nevoie să existe clasa
‘container’,apoi în această clas ă este nevoie să existe clasa ‘row’ ,în interiorul acestei clase
putând fi crea te clase de tip ‘col -%-%’,unde în primul ‘%’ se pot adăuga 4 opț iuni(xs -pentru

5
telefoane mobile, sm-pentru tablete,md -pentru laptopuri de mici dimensiuni si lg -pentru laptopuri
si PC-uri),iar în al doilea ‘%’ se adaugă numă rul de coloane pe c are îl poate ocupa acel
element,numă rul total de coloane de pe un râ nd neputănd depăș i 12[9].În exemplul de mai
jos,am impărțit pagina în două parț i ce au dimensiunile egale. După redimensionare a
paginii,coloana ‘2’ își va schima poziția,trecâ nd sub coloana ‘1’. În Fig.7 se poate vedea
rezultatul execuției codului prezent î n Fig. 6 pe toată dimensiunea ferestrei, iar în Fig. 8 este
prezent at rezultatul execuției aceluiaș i cod după redimensionarea ferestrei. Astfel,vizita torii
paginii pot vedea informația completă indiferent de dimensiunile dispozitivul ui utilizat.

Fig.6 Exemplu de folosire a claselor bootstrap

Fig.7 Fig.8

Alte clase Bootstrap folosite în dezvoltarea aplicaț iei sunt:
o alert – folosită pentru afiș area mesajelor
o table –adaugă style unui tabel
o btn –adaugă style unui buton

6
o pagination – folosită pentru a limita numărul de elemente de pe pagină
o primary,danger,success – sunt adă ugate pentru a oferi culoare claselor
bootstrap

2.4 PHP

PHP(PHP:Hypertext Processor) este un limbaj de programare creat de că tre danezul Rasmus
Lerdorf in anul 1995 ce poate fi utilizat pe toate sistemele de operare .Inițial,PHP î nsemna
Personal Home Page,Lerdorf creându -l pentru a contoriza câț i vizitatori avea pagina sa
personală .Însă,cu timpul PHP a devenit un limbaj compl ex,capabil inclusiv sa interacți oneze cu
sisteme de gestiune a bazelor de date,precum MySQL,SQLite sau PostgreSQL [4].
PHP poate fi folosit atât în mod procedural,cât și î n mod POO(Progamare O rientată pe
Obiecte ).Fișierele PHP se sa lvează cu extensia .php,ele putâ nd sa conțină inclusi v cod
HTML/CSS. Pentru a arăta că fiș ierul este un fiș ier de tip PHP codul trebuie s a înceapă cu ‘<?php
‘ și să se î ncheie cu ‘?>’. PHP poate fi descă rcat de pe site -ul
oficial(php.net/ downloads.php) ,însă,de obicei,se folosesc program e ce conț in deja instalarea
PHP-ului(XAMPP,LAMP,WAMP) .

Fig.9 Fig.10
În Fig.9 se poate observa faptul că pentru afișare se folosește comanda ‘echo’,urmată de
‘;’,iar variabilele se declară cu ajutorul semnului ‘$’ .Rezultatul execuț iei codului din Fig.9 poate
fi observa t in Fig.10 .
Alte utiliză ri ale PHP în proiect:
o if – instrucț iune de decizie
o while/for – instrucț iuni repetitive
o isset – verifică daca există o variabilă
o ./+/++ – operatori (concatenare/ad ăugare/incrementare)
o strlen – află lungimea unui ș ir
o isnumeric – verifică daca o variabilă este de tip numeric

7

2.5 MySQL

MySQL este unul dintre cele mai populare sisteme de gestiune a bazelor de date ,fiind creat
de că tre compania suedeză MySQL AB in anul 1995 .Numele său este format din numele fiicei
co-fondatorului Michael Widenius(My) si SQL(Structured Query Language) [1].Pentru
administrarea bazelor de date MySQL se poate folosi linia de comandă sau programe create
special pentru acest motiv (phpMyAdmin,My SQL Workbench,MyWeb SQL) .
SQL este limbajul standard pentru modificarea,adă ugarea,eliminarea tabelelor sau a
datelor din tabele .Instrucț iuniile SQL pot fi de două tipuri:DDL sau DML.
Instrucți uniile de tip DDL(Data Definition Language ) sunt folosite pentru a defini
structura unei baze de date. Cu ajutorul aces tor instrucțiuni pot fi create/ș terse/modificate tabelele
unei baze de date .În exemplul de mai jos se arată modul de creare al tabe lului ‘nume_tabel’,tabel
ce conț ine coloanele cu numele ‘coloana 1’ si ‘coloana2’,fiecare coloană având un tip de
dată(numeric,text,data,etc)
CREATE nume_tabel(coloana1(tip_de _dată ),coloana2(tip_de_dat ă));
Instrucț iuniile de tip DML(Data Manipulation Language) sunt folosite pentru a modifica
datele din tabelele bazei de d ate.Cu ajutorul acestor instrucț iuni se pot adăuga,modifica sau
șterge înregistră ri.În exemplul de mai jos s e arată modul î n care se i nserează date în tabelul
‘nume_tabel’,unde î n coloana ‘coloana1’ se adaug ă valoarea ‘valoare1’,iar in coloana ‘coloana2’
se adaugă valoarea ‘valoare2’.
INSERT INTO nume_tabel(coloana1,coloana2) VALUES (valoare1,valoare2 )
Alte instrucțiuni SQL folosite î n cadrul proiectului sunt:
o SELECT – returnează datele din baza de date
o DELETE – șterge datele din baza de date
o UPDATE – modifică datele din baza de date
o ORDER BY – folosit ală turi de SELECT pentru a sorta datele

8

3.Struc tura si imple mentarea aplicaț iei

3.1 Structura aplicaț iei

Aplicaț ia est e structurată în două părți :partea de adminis trare și partea de vizualizare.Î n
partea de administrare se pot modifica informațiile ce sunt văzute în partea de vizualizare,î n
partea de administrare putând avea acces doar utilizatorii ce s -au logat in prealabil pe pagina de
logare. În Fig.11 se pot observa acț iuniile pe care administratorul le poate realiza,pentru ca în
Fig.12 să se prezinte acț iuniile ce pot fi realizate de că tre un utilizator.

Fig.11 Acțiuni administrator

9

Fig.12 Acțiuni utilizator

3.2 Baza de date

Baza de date se numeș te “licenta” ,structura ei fiind prezentat ă in Fig.13

Fig.13 Structura bazei de date a aplicației

10

3.2.1 Structura tabelelor bazei de date

3.2.1.1 Tabelul administratori
Tabelul administrator este format din următoarele coloane :
o id_admin – cheie primară
o nume – numele folosit de administ rator pentru a se loga
o parola – parola administratorului

3.2.1.2 Tabelul articole
Tabelul articole este format din următoarele coloane :
o id_articol – cheie primară
o data_ora – data ș i ora la care a fost publicat a rticolul
o titlu – titlul articolului
o categorie – categoria din care face parte articolul
o imagine – imaginea articolului
o post – textul articolului

3.2.1.3 Tabelul categorii
Tabelul categorii este format din următoarele coloane:
o id_categorie – cheie primară
o nume – numele categoriei

3.2.1.4 Tabelul comentarii
Tabelul comentarii este format din următoarele coloane:
o id_comentariu – cheie primară
o data_ora – data ș i ora la care a fost creat comentariul
o nume – numele persoanei care a postat comentariul
o email – emailul persoanei care a postat comentariul
o comentariu – textul comentariului
o status – verifică dacă un coment ariu a fost aprobat sau nu de că tre
administrator
o id_articol – cheie straină – indica id -ul articolului pe care a fost postat
comentariul

11

3.2.1.5 Tabelul echipe
Tabelul echipe este format din urmă toarele coloane:
o id_echipa – cheie primară
o nume – numele echipei
o sigla – sigla echipei
o meciuri – numă rul de meciuri al echipei
o victorii – numă rul de victorii al echipei
o egaluri – numă rul de egaluri al echipei
o infrangeri – număr ul de înfrângeri al echipei
o puncte – numă rul de puncte al echipei
o stadi on – stadionul pe care echipa își dispută meciurile
o locuri – capacitatea stadionului
o antrenor – antrenorul echipei

3.2.1.6 Tabelul jucatori
Tabel ul jucatori este format din urmă toarele coloane:
o id_jucator – cheie primară
o nume – numele jucă torului
o poza – imagine cu chipul jucă torului
o tara – țara în care s -a născut juc ătorul
o pozitie – poziț ia din ter en a jucătorului(Portar,Fundaș,Mijlocaș ,Atacant)
o goluri – numărul de goluri înscrise de către jucă tor
o valoare – prețul aproximativ al juc ătorului
o nr_tricou – numărul de pe tricou al jucă torului

3.2.1.7 Tabelul meciuri
Tabelul meciuri este forma t din urmă toarele coloane:
o id_meci – cheie primar ă
o echipa1 – echipa ce a disputat meciul pe teren propriu (sau echipa gazd ă)
o echipa2 – echipa ce a disputat meciul în deplasare (sau echipa oaspete)
o scor1 – numărul de goluri marcat de echipa gazd ă
o scor2 – numărul de goluri marcat de echipa oaspete
o marcator1 – jucătorii care au marcat pentru echipa gazd ă
o marcator2 – jucătorii care a u marcat pentru echipa oaspete
o etapa – etapa în care a avut loc meciul
o data_ora – data și ora la care a avut loc meciul

12

3.2.2 Creearea bazelor de date
Pentru creearea bazelor de date am folosit programul phpMyAdmin ,în cadrul căruia am
adaugat instrucț iunile SQL necesare .
Toate tabelele bazei de date conț in câte o cheie primară.Cheia primară are rolul de a oferi
unicitate î nregistră riilor din tabel. De asemenea,cu ajutorul opțiunii AUTOINCREMENT,coloana
stabilit ă drept cheie primara își va modifica valoare a in urma adăugării unei noi înregistă ri in
tabel.
Cheia straină are rolul de a face legătura între două tabele ale bazei de date ,ea primind valoarea
unei chei primare din alt tabel. În Fig. 14 si Fig.15 sunt prezentate structuriile tabelelor
“articole”,respectiv “comentarii”,in tab elul “comentarii” fiind prezentă coloana
“id_articol” ,coloană ce referă cheia primară “id_artico l” aflată î n tabelul “articole” .

Fig.14 Structura tabelului “articole”

Fig.15 Structura tabelului “comentarii”

Mai jos este prezentată instrucțiunea SQL folosită pentru a creea tabelul “comentarii”

CREATE TABLE `comentarii` ( `id_comentariu` int(10) NOT NULL
AUTO_INCREMENT,`data_ora` varchar(50) NOT NULL,`nume` varchar(2 00) NOT
NULL,`email` varchar(200) NOT NULL, `comentariu` varchar(500) NOT NULL, `status`

13
varchar(5) NOT NULL,`id_articol` int(10) NOT NULL, PRIMARY KEY
(`id_comentariu`),KEY `id_articol` (`id_articol`), CONSTRAINT `id_articol` FOREIGN KEY
(`id_articol`) REFERENCES `articole` (`id_articol`))

3.3 Variabile superglobale
Variabilele superglobale sunt variabile predefinite ce pot fi folosite în cadrul î ntregului
progr am sau al unei funcții,fără a fi nevoie de declararea lor in prealabil. În cadrul apl icației am
folosit urmatoarele variabile superglobale:
o _SESSION
o _GET
o _POST
o _FILES

3.3.1 Superglobala _SESSION
_SESSION reprezintă o variabil ă cu ajutorul căreia se pot transmite informații de la o
pagină că tre alta.Pentru a declara o variabil ă _SESSION este nevoie de funcț ia
“session_start()”, această funcție trebuiind situată deasupra tuturor liniilor de cod.Valabil itatea
unei variabile _SESSION î ncetează fie când se î nchide fereastra browser ului,fie când este
apelată funcț ia “sessi on_destroy()” .Am folosit această superglobală pentru a afișa mesajele de
eroare ș i pentru logarea utilizatorului î n partea de administare.

3.3.2 Superglobala _ GET
_GET este o superglobală folosit ă pentru a transmite cereri către sever e.Dupa utilizarea
acestei metode,infor mațiile vor apă rea in URL -ul paginii urmă toare ,_GET nefiind recom andată
în cazul în care completă m datele unui formular ,în special un formular ce necesită completarea
datelor personale(CNP,data de naș tere) sau a parolelor.În cadrul aplicaț iei,superglobala _GET a
fost folosită pentru a ș terge/modifica datele din tabelele bazei de date.

3.3.3 Superglobala _POST
_POST este o superglobală similară cu _GET,existând totuși diferenț e între ele .Una dintre
diferente este ca _POST poate transmite un volum mult mai ridicat de date,comparativ cu
_GET.De asemenea,spre deosebire de _GE T,superglobala _POST nu afișează datele introduse î n
formular î n URL -ul paginii,de aceea metoda _POST este recomandată în cazul î n care construim
un formu lar.Metoda _POST a fost folosită pentru a prelua date din formulare ș i pentru a ad ăuga
date in tabelele bazei de date .

14

3.3.4 Superglobala _FILES
Această superglobal ă este folosită pentru î ncarca rea fișierelor pe server. Am folosit această
superglobală pentru a încă rca imaginea unui articol,sigla unei echipe sau chipul unui jucă tor.

3.4 Implementarea aplicaț iei

Implementare a aplicaț iei a fost realizată cu ajutorului programului XAMPP,un ansamblu d e
programe ce conține atât PHP,cât ș i programul phpMyAdmin [8].De asemenea,am folosit
driver ul MySQLi pentru a accesa funcțiile MySQL î n cadrul scripturilor PHP .

3.4.1 Crearea conexiunii că tre baza de date
Pentru a realiza conexiunea că tre baza de date,am folosit funcț ia “mysqli_ connect”,funcț ie
ce conț ine 4 parametrii.Primul paramentru este reprezentat de catre “localhost”,el reprezentâ nd
numele implicit dat computerului și avâ nd valoarea de 127.0.0.1.Al doilea parametru reprezintă
numele utilizatorului ,”root” fiind valoarea implicit ă data de catre phpMyAdmin .Cel de -al treilea
parametru este rezervat parolei bazei de date,î n timp ce ultimul parametr u este reprezentat de
către numele b azei de date cu care am lucrat(î n acest caz – “licenta” ).Acestei funcț ii i se atribuie
o variabilă,variabilă ce poate f i folosită în cadrul altor funcț ii MySQLi.

Fig.16 Secvența de cod folosită pentru conectarea la baza de date

3.4.2 Adă ugarea informaț iilor î n baza de date
Pentru a putea adăuga informații în baza de date este necesară construirea unui element de tip
“form” .În interiorul etichetei “<form>” se specifică pagina pe care este situat formul,î n drepul
atributului “action”.De asemenea,în cazul î n care folosim superglobala _POST, se specifică acest

15
lucru in atributul “method” .Apoi,cu ajutorul etichetei “<fieldset>” se grupează toate câmpurile
de unde se introduc datele,pentru ca mai apoi să apară elementul “<div>”,ce conț ine etichetele
“<label>”, apoi tipul dorit de etichetă (input,textarea),acolo adăugâ ndu-se informația ce trebuie să
fie transmisă către baza de date,î n timp ce eticheta “<label>” descr ie pentru utilizator ce
informaț ie trebuie sa adauge, atributul “for” al labelului având aceeaș i valoare cu atributul “id” al
etichetei alese .Fieldsetul poate conț ine mai multe elemente de acest tip. La finalul ultimului
element “<div>” este adă ugat un buton ,dupa apă sarea acestui buton intro ducâ ndu-se date le în
tabele.

Fig.17 Codul formului pentru adăugare categorie

Fig.18 Rezultatul execuției codului din Fig.17

Pentru a introduce informațiile î n baza de date este nevoie ca atributul “name” al etichetei
din perechea cu eticheta “<label>” sa fie preluat cu superglobala _POST si salvat intr -o
variabilă .Din motive d e securitate est e recomandată folosirea funcț iei
”mysqli_real_escape_string” .
Această funcț ie reduce riscul ca baza de date sa fie compromisă,î n cazul în care un utilizator
rău intenț ionat ar incerca acest lucru.Funcț ia este compusă din doi paramet ri,primul parametru
fiind reprezentat de că tre numele conexiunii bazei de date,î n timp ce al doil ea parametru
reprezintă informaț ia introdusă pentru a fi adaugată in baza de date. În momentul în care butonul
este apăsat,o variabilă preia valoarea a cestei funcții,iar această variabilă este folosită î n cadrul
instrucț iunii SQL “INSERT”. O variabilă preia instrucț iunea SQL,pentru ca mai apoi acea
variabilă sa fie folosită î n cadrul funcți ei “mysqli_query” ,alături de variabila de conexiune.

16

Fig.19 Cod metoda post

Fig.20 Cod inserare în baza de date

3.4.3 Afișarea informaț iilor din baza de date
Pentru afișarea informaț iilor din baza de date este nevoie de utilizarea funcției
“mysqli_fetch_array”,funcț ie ce formează un vector cu toate rezultatele interogă rii SQL ,apoi
aceasta funcție este atribuită unei variabile ce este parcu rsă cu o instrucțiune repetitivă, pentru a
se putea afișa toate înregistră riile.

Fig.21 Cod pentru parcurgerea rezultatelor unei interogări SQL

Fig.22 Cod de afișare al rezultatelor unei interogări SQL

17
3.4.4 Editarea/ ștergerea informaț iilor din baza de date
Pentru editarea informaț iilor din baza de date este nevoie de utilizarea superglobalei _GET .În
exemplul d in Fig.22 se observă faptul ca în legatura că tre scriptul “StergereCategorie.php” se
atribuie id -ul categoriei parametrului “idCategorie” .Acestui parametru i se verifică existența,iar
în cazul în care parametrul există, o variab ilă va prelua valoarea acestuia,pentru ca mai apoi
această variabilă să fie folosită î n cadrul clauzei “WHERE” a interogă rii SQL.

Fig.23 Cod ștergere înregistrări

Fig.24 Cod editare înregistrări

3.4.5 Căutarea informaț iilor din baza de date
Pentru că utarea une i echipe sau a unui articol,jucător sau meci am folosit un element de tip
“form”,element for mat dintr -un input și un buton.Î n momentul în care utilizator ul introduc e o
valoare in input s e returnează ,cu ajutorul operatorului “LIKE” din cla uza “WHERE” a
interogă rii SQL,înregistrările ce conțin această valoare.

Fig.25 Cod sursă pentru form -ul de căutare

18

Fig.26 Cod sursă pentru căutare

3.4.6 Paginaț ia
Paginația reprezinta operaț ia de numerotare a pag iniilor.Pentru realizarea paginaț iei am
stabilit un numă r limită de randuri pentru fiecare pagină,apoi am numărat totalul î nregistrărilor
din tabel .Apoi,am calculat numă rul de pagini,împărțind totalul înregistrăriilor la valoarea
numă rului dorit de rânduri,folosind funcț ia “ceil” (returnează numă rul rotunjit la valoarea cea mai
mare) în cazul î n care numărul de pagini nu este î ntreg. Cu ajutorul superglobalei GET se verifică
existenț a param etrului paginii,apoi o variabilă va primi rezultatul acestui parametru. Această
variabilă este folosită pentru a calcula limita de u nde va începe afișarea inregistă riilor.

Fig.27 Cod sursă paginație

3.4.7 Afișarea mesajelor
În cazul în care anumite câ mpuri sunt completate necorespunză tor de către utilizator,se va
afișa un mesaj de atenționare.Pentru afiș area mesajelor am construit o funcție ce verifică
existenta superglobalei _SESSION,ală turi de variabila “Message”.Î n cazul în care această
variabilă există ,cu ajutorul operatorului de concatenare al PHP se creează o variabil ă ce con ține
mesajul de eroare,situat î n interiorul clasei Bootsrap “alert” .

19

Fig.28 Codul funcției de afișare a mesajelor

3.4.8 Afișare data/ora
Pentru a afla data și ora la care a fost introdusă o informaț ie într-unul dintre tabel ele bazei de
date am construit funcț ia numită “Timp()” .În cadrul acestei funcții se stabileș te fusul or ar
dorit,apoi o variabilă primeș te valoarea funcț iei PHP “time()” (o funcție ce returnează diferenț a
dintre num ărul de secunde de la timpul curent p ână in 1 ianuarie 1970)[ 5].Am folosit func ția
“strftime ” pentru a transforma rezultatul func ției in format de tip text.

Fig.29 Codul funcției Timp

Fig.30 Func ția strftime

3.4.9 Adăugarea comentariilor
Pentru introducerea comentariilor în baza de date am creat un form ular pe pagina
“ArticolInfo.php”. În cazul în care campurile formularului au fost complet ate
corespunzător,comentariul este introdus în baza de date cu status -ul “OFF”,iar utilizator ul va

20
primi un mesaj de informare ce afișează faptul că trebuie să aștepte validarea comentariului de
către administrator.

Fig.31 Codul sursă pentru adăugarea c omentariilor

3.4.10 Aprobarea și afiș area comentariilor
Pentru ca un comentariu să fie afișat este nevoie ca administratorul aplicației să aprobe
comentariul.Un comentariu este aprobat atunci când statusul acestuia este “ON” ,iar în cazul în
care comentariul este aprobat,acesta va fi afișat la finalul articolului .Modificarea statusului se
realizează folosind instrucțiunea “UPDATE” a SQL.

Fig.32 Codul surs ă pentru modificarea statusului

21

Fig.33 Codul sursă pentru afișarea comentariilor

3.4.11 Adăugare administrator
Un administrator poate fi adăugat din partea de administrare a aplicației cu ajutorul unui
formular.În cazul în care condițiile de completare ale formularului lui respectate,administratorul
este adăugat în baza de date “administratori” și poate folosi formularul pentru logare în partea de
admini strare.Din motive de securitate, am folosit funcția „password_hash()” pentru a cripta
parola introdusă în formular [6].

Fig.34 Codul sursă pentru formularul de adăugare administrator

22

Fig.35 Codul sursă pentru adăugare administrator

3.4.12 Logarea în partea de administrare
Fișierul “index.php” conține formularul pentru logare în partea de administrare a
apllicației.În cazul în care ambele câmpuri ale formularului au fost completate se caută nume le
de utilizator introdus în baza de date a administratori ilor.
Dacă există, se verifică dacă parola introdusă de către administrator se potrivește cu
parola criptată a acestuia, cu ajutorul funcției “password_verify” [7].Apoi, dacă cele doua parole
nu se potrivesc,se afișează un mesaj de eroare,în caz contrar,utilizatorul fiind redirecționat către
pagina de start a părții de administrare ,iar variabila _SESSION[„logat”] este inițializată cu
valoarea “true”.Aceast ă variabilă este folosită în cadrul funcției de verificare a logării.

23

Fig.36 Codul sursă pentru formularul de logare

Fig.37 Codul sursă pentru logare

24
3.4.13 Verificare logare
Funcția “VerificareLogare()” are rolul de a stabili dacă un utilizator este sau nu logat în
aplicaț ie.Această funcție verifică existența variabilei _SESSION[“logat”] .În cazul în care această
variabilă nu există,utilizatorul este redirecționat către formularul de logare și i se va afișa un
mesaj corespunzător. Funcția trebuie apelată în cadrul tuturor fișierelor din partea de
administrare.

Fig.38 Codul sursă al funcției “VerificareLogare()”

3.4.14 Delogarea
Procesul de delogare are loc in scriptul “logout.php” ,în cadrul căruia se apelează funcț ia
“session_destroy()” ,funcți e ce are rolul de a stopa valabilitatea tuturor variabilelor de tip
“_SESSION”.După apelul funcției,utiliz atorul este redirecționat către formularul de logare.

Fig.39 Cod sursă “Logout.php”

25
4.Prezentarea și testarea aplicației

Startul aplicației este dat de către formularul de logare. În cazul în care datele introduse nu
se găsesc în baza de date se afișează mesajul “Datele introduse nu sunt corecte”

Fig.40 Formularul de logare

Fig.41 Formular de logare completat cu date incorecte

26
Dacă datele introduse sunt corecte,atunci utilizatorul este redirecționat către partea de
administrare a aplicației.

Fig.42 Partea de administrare a aplicației

Partea de administrare este formată dintr -o bară laterală,restul spațiului fiind rezervat
lucrului cu datele aplicației.În cadrul bării laterale se găsesc următoarele elemente:
o Vizitati site -ul – legătura că tre partea de vizualizare
o Articole – aici se poate modifica,ș terge sau vizualiza un articol
o Adaugare articol – locul de unde se pot adauga articole
o Categorii – locul unde se pot c reea categorii pentru articole
o Echipe – centrul de administrare al echipelor
o Adaugare echipa – locul d e unde se pot adă uga echipe
o Jucatori – centrul de administrare al jucătoriilor
o Adaugare jucator – locul de unde se pot adăuga jucă tori
o Meciuri – centrul de administrare al meciurilor
o Adaugare meci – locul de unde se pot adă uga meciuri
o Comentarii – centru l de administrare al comentariilor
o Administratori – aici s e pot adă uga administratori și vizualiza
administ ratorii existenț i

27

Fig.43 Adăugare articol

La apăsarea butonului,conținutul centrului de administrare al articolelor se va modifica.

Fig.44 Centru administrare articole

28
La apă sarea butonului “Editare” se va deschide un formular ce perm ite editarea datelor
introduse î n articol.

Fig.45 Editare articol

La apăsarea butonului de ștergere,articolul și datele sale vor fi eliminate din baza de date

Fig.46 Centrul de administrare după ștergerea unui articol

29
În partea de Categorii se pot adăuga categorii ce pot fi adăugate articolelor din aplicație.

Fig.47 Pagina “Categorii”

Urmează apoi centrele de administrare pentru echipe,meciuri si jucători,structura lor fiind
similara cu cea a centrului de administrare a articolelor.

Fig.48 Centru administrare echipe

30

Fig.49 Pagina de adăugare a unei echipe

Fig.50 Centru administrare jucători

31

Fig.51 Pagina de adăugare a unui jucător

Fig.52 Centru adăugare meciuri

32

Fig.53 Pagina de adăugare a unui meci

În cazul în care anumite câmpuri sunt completate necorespunzător se va afișa un mesaj
de informare.

Fig.54 Afișare eroare în pagina “Adaugare articol”

33
În pagina “Administratori” se pot adăuga noi administratori și se pot vizualiza
administratorii existenți.

Fig.55 Pagina „Administratori”

Dacă parolele introduse nu coincid,atunci se va afișa un mesaj de eroare.

Fig.56 Afișare mesaj de eroare în cazul în care cele două parole nu au aceeași valoare

34
La apăsarea butonului “Vizitati site-ul”,ad ministratorul este redirecționat către partea de
vizualizare a aplicației. Aceast ă parte poate fi accesată și de către utilizatorii nelogați în partea de
administrare.

Fig.57 Partea de vizualizare

În partea de vizualizare există o bară de na vigare formată din trei
elemente :Stiri,Jucatori,respectiv Echipe. Partea de știri este formată dintr -o pagină de vizualizare
a articolelor,un câmp pentru căutarea titlului sau conținutului unui articol, un panou ce conține
toate categoriile introduse în tabelul “categorii”(pentru căutarea articolelor în funcție de
categorie) si un alt panou ce afișează cele mai recente postate. Partea de jucători este formată
dintr -un câmp ce ajută la căutarea numelui unui jucător și două panouri ce conțin primele 5
înregistrări din tabelul jucători,în funcție de numărul de goluri marcat,respectiv valoarea de piață
a jucătorului. Partea pentru echipe este formată din câmpul de căutare,clasamentele parțiale în
funcție de numă rul de puncte al echipei,respectiv cel al capacității stadioanelor .De asemenea,în
cadrul aceleeași parți se alfă rezultatele meciurilor disputate între echipe.

35

Fig.58 Partea de vizualizare a jucătoriilor

Fig.59 Partea de vizualizare a echipelor

36
În ca zul în care formularul de căutare a fost completat,se vor afișa rezultatele găsite ,iar
utilizatorul va putea accesa informațiile unei echipe sau ale unui jucător executâand click pe
rezultatul găsit. Se vor returna rezultatele ce conțin termenul introdus în form.

Fig.60 Rezultatele căutarii pentru echipe

Fig.61 Afișarea informațiilor unei echipe

37

Fig.62 Căutare a termenului “nis” în partea de jucători

Fig.62 Afișarea informațiilor unui jucător

38

Fig.63 Clasament parțial

Pentru a obține clasamentul complet,utlizatorul va executa click pe “Clasament complet”

Fig.64 Clasament complet

39
În interiorul fiecărui articol există un formular unde utlizatorul poate adăuga
comentarii. În cazul în care câmpurile formularului au fos t completare correct,utilizatorului i se
va afișa un mesaj de așteptare a aprobării comentariului de către administrator.După trimiterea
comentariului de către util izator,administratorul poate vedea comentariul trimis în pagina de
comentarii a părții de administrare,urmând ca el să decidă dacă acel comentariu va fi afișat sau
nu.

Fig.65 Formularul pentru adăugarea comentariilor

Fig.66 Mesaj de informare după introducerea comentariului

40

Fig.67 Partea de administrare a comentariilor

Fig.68 Afișarea comentariului după aprobare

41

5.Concluzii

Această aplicație a fost realizată pe ntru a oferi informații din domeniul
fotbalului,utilizatorii ei putând să afle informații atât despre echipe,cât și despre jucătorii ce le
compun. Utilizatorii aplicației pot vizualiza știri despre fotbal,ei având posibilitatea de a -și
exprima părerea în secțiunea de comentarii.
Aplicația este formată din secțiunea de administrare,de unde administratorul aplicației
poate adăuga,modifica sau elimina informațiile,respectiv partea de vizualizare,de unde vizitatorii
aplicației pot vizualiza informațiile adăugate de către administrator.
Aplicația a fost realizată folosind limbajul de marcare HTML,limbajul CSS3(pentru
stilizarea elementelor aplicației),fr amework -ul Bootstrap(pentru afișarea completă a
elementelor,indifferent de dispozitivul utilizat),limbajul de scripting PHP și sistemul de gestiune
a bazelor de date MySQL.
O posibilitate de îmbunătațire a aplicației ar fi putea fi adăugarea a noi statistici despre
echipe sau jucători .De exemplu,pentru echipe se po t adăuga rezultatele din sezoanele anterioare
ale campionatului,iar pentru jucători se poate adăuga istoricul echipelor la care a activat. O altă
posibilitate de îmbunătățire a aplicației ar putea fi introducerea sondajelor,de unde vizitatorii își
pot exprima opinia în legatură cu cele mai importante eventimente fotbalistice.

42

6.Bibliografie

[1] https://dev.mysql.com/doc/refman/8.0/en/history.html
[2] https://www.w3.org/Style/CSS/Overview.en.html
[3] https://getbootstrap.com/docs/4.1/getting -started/introduction/
[4] http://php.net/manual/en/history.php.php
[5] http:// php.net/manual/ro/function.time.php
[6] http://php.net/manual/ro/function.password -hash.php
[7] http://php.net/manual/ro/function.password -verify.php
[8] https://www.apachefriends.org/ro/index.html
[9] https://getbootstrap.com/ docs/4.0/layout/grid/
[10] https://www.worldatlas.com/articles/what -are-the-most -popular -sports -in-the-
world.html

Similar Posts