PROGRAMUL DE STUDIU TEHNOLOGIA INFORMAȚIEI FORMA DE ÎNVĂȚĂMÂNT IF PROIECT DE DIPLOM Ă COORDONATOR ȘTIINȚIFIC PROF . DR. ING. CORNELIA AURORA GYŐRÖDI… [607380]
UNIVERSITATEA DIN ORADEA
FACULTATEA DE INGINERIE ELECTRICĂ ȘI
TEHNOLOGIA INFORMAȚIEI
PROGRAMUL DE STUDIU TEHNOLOGIA INFORMAȚIEI
FORMA DE ÎNVĂȚĂMÂNT IF
PROIECT DE DIPLOM Ă
COORDONATOR ȘTIINȚIFIC
PROF . DR. ING. CORNELIA AURORA GYŐRÖDI
ABSOLVENT: [anonimizat]
2018
UNIVERSITATEA DIN ORADEA
FACULTATEA DE INGINERIE ELECTRICĂ ȘI
TEHNOLOGIA INFORMAȚIEI
PROGRAMUL DE STUDIU TEHNOLOGIA INFORMA ȚIEI
FORMA DE ÎNVĂȚĂMÂNT IF
APLICAȚIE WEB PENTRU
GESTIONAREA MANAGEMENTULUI
UNEI BIBLIOT ECI
COORDONATOR ȘTIINȚIFIC
PROF. DR. ING. CORNELIA AURORA GYŐRÖDI
ABSOLVENT: [anonimizat]
2018
UNIVERSITATEA DIN ORADEA
FACULTATEA DE INGINERIE ELECTRICĂ ȘI TEHNOLOGIA INFORMAȚIEI
DEPARTAMENTUL CALCULATOARE ȘI TEHNOLOGIA INFO RMAȚIEI
TEMA _____
Lucrare de fina lizare a studiilor a student: [anonimizat] : BACTER RĂZVAN – IOAN
1) Tema lucrării de finalizare a studiilor:
APLICAȚIE WEB PENTRU GESTIONAREA MANAGEMENTULUI UNEI BIBLIOTECI
2) Termenul pentru predarea lucrării: 03 iulie 201 8
3) Elemente inițiale pentru elaborarea lucrării de finalizare a studiilor: platforma
DotKernel 1 și framework -ul Zend Framework , limbajul de bază PHP, structurarea conținutului
folosind HTML 5 și stilizarea conținutului utilizând CSS 3.
4) Conținutul lu crării de finalizare a studiilor: Introducere; Tehnologii folosite la
implementarea aplicației – platforma DotKernel 1, PHP (Hypertext Preprocessor) , MySql ,
HTML 5 (HyperText Markup Language) , CSS 3 (Cascading Style Sheets) , JavaScript , jQuery ,
AJAX (Asinc hronous JavaScript and XML) , Formatul JSON (JavaScript Object Notation) ,
Bootstrap și media queries ; Proiectarea aplicației web – Proiectarea bazei de date , Proiectarea
aplicației web – Model, View, Controller; I mplementarea aplicației web – Arhitectura
aplicației , Descrierea interfeței și utilizarea aplicației – Modulul admin , Modulul frontend –
Prima pagină (Home Page) , Pagina “Cărți” (Books Page) , Pagina de logare (Log In Page) ,
Pagina “Împrumuturi” (My Loans Page) ; Concluzii; Bibliografie.
5) Material grafic: schema MVC, schema bazei de date, capturi de ecran .
6) Locul de documentare pentru elaborarea lucrării: Internet, biblioteca universității
7) Data emiterii temei : 02 octombrie 201 7
Coordonator științific
Prof. dr. ing. Cornelia Aurora GYŐRÖDI
1
Cuprins
INTRODUCERE ………………………….. ………………………….. ………………………….. …………………. 2
CAPITOLUL I. TEHNOLOGII FOLOSITE LA IMPLEMENTAREA APLICA ȚIEI .. 4
I.1. PLATFORMA DOTKERNEL 1 ………………………….. ………………………….. ………………… 4
I.2. PHP (Hypertext Preprocessor) ………………………….. ………………………….. ……………………. 7
I.3. MYSQL ………………………….. ………………………….. ………………………….. ………………………. 9
I.4. HTML 5 (HyperText Markup Language) ………………………….. ………………………….. …….. 9
I.5. CSS 3 (Cascading Style Sheets) ………………………….. ………………………….. ……………….. 11
I.6. JAVA SCRIPT ………………………….. ………………………….. ………………………….. ……………. 12
I.7. JQUERY ………………………….. ………………………….. ………………………….. …………………… 13
I.8. AJAX (Asinchronous JavaScript and XML) ………………………….. ………………………….. . 15
I.9. FORMATUL JSON (JavaScript Object Notation) ………………………….. …………………… 16
I.10. BOOTSTRAP ȘI MEDIA QUERIES ………………………….. ………………………….. ………. 16
CAPITOLUL II. PROIECTAREA APLICA ȚIEI WEB ………………………….. ………………. 18
II.1. PROIECTAREA BAZEI DE DATE ………………………….. ………………………….. ………… 18
II.2. PROIECTAREA APLICAȚIEI WEB ………………………….. ………………………….. ………. 21
II.2.1. Model ………………………….. ………………………….. ………………………….. ………………… 22
II.2.2. View ………………………….. ………………………….. ………………………….. ………………….. 23
II.2.3. Controller ………………………….. ………………………….. ………………………….. …………… 24
CAPITOLUL III. IMPLEMENTAREA APLICAȚIEI WEB ………………………….. ………. 26
III.1. ARHITECTURA APLICA ȚIEI ………………………….. ………………………….. ……………… 26
III.2. DESCRIEREA INTERFEȚEI ȘI UTILIZAREA APLICAȚIEI ………………………….. 27
III.2.1 Modulul admin ………………………….. ………………………….. ………………………….. …… 27
III.2.2 Modulul frontend ………………………….. ………………………….. ………………………….. … 31
III.2.2.1 Prima pagină (Home Page) ………………………….. ………………………….. ……………. 32
III.2.2.2 Pagina “Cărți” (Boo ks Page) ………………………….. ………………………….. ………… 33
III.2.2.3 Pagina de logare (Log In Page) ………………………….. ………………………….. ……… 34
III.2.2.4 Pagina “ Împrumuturi ” (My Loans Page) ………………………….. …………………….. 35
CONCLUZII ………………………….. ………………………….. ………………………….. …………………….. 37
BIBLIOGRAFIE ………………………….. ………………………….. ………………………….. ……………….. 38
2
INTRODUCERE
Am ales să realizez proiectarea și implementarea unei platforme informative și de
gestiune a unei biblioteci , din punctul meu de vedere relevantă tuturor bibliotecilor, din dorința
de a afla cum se realizează și ce presupune o platformă de acest tip care există de ja pe internet
și pentru a -mi pune în aplicare cunoștințele acumulate atât de-a lungul celor patru ani de
facultate , cât și de -a lungul experienței mele profesionale.
Aplicația creată este una complexă datorită celor două module implementate: modulul
de f rontend destinat utilizatorilor și modulul de admin destinat administratorului sau
bibliotecarului. În ceea ce privește denumirea aplicației implementate, aceasta este “Bacter’s
Library”, o denumire semnificativ ă și totodată reprezentativă.
Fiind o aplica ție web pentru gestionarea managementului unei biblioteci, aceasta
impune două tipuri de utilizatori: utilizatori specializa ți și utilizatori nespecializați. În ceea ce
privește utilizatorii specializați și anume administratorul aplicației sau bibliotecaru l, aceștia au
permisiunea de a gestiona cu ușurință utilizatorii aplicației, cărțile înregistrate în baza de date
a bibliotecii, precum și împrumuturile aferente. Conform utilizatorilor nespecializați, aceștia
au permisiunea de a vizualiza cărțile înregist rate și disponibilitatea acestora, precum și propriile
împrumuturi dacă există.
Aplicația web va putea fi accesată prin intermediul unui browser, oferind astfel
posibilitatea de a putea fi folosită de pe mai multe dispozitive cum ar fi desktop sau laptop ,
tabletă, telefon mobil , drept urmare aplicația este unitară și își păstrează același design ,
informația fiind regăsită cu ușurință indiferent de rezoluția dispozitivului utilizat. Pentru
compatibilitatea aplicației web cu dispozitivele mobile am folosit a tât elemente de Bootstrap,
cât și elemente de Media Queries ce permit aplicației să afișeze mai multe sau mai puține
informații în funcție de rezoluția dispozitivului de pe care se accesează aplicația web.
În cadrul aplicației , un uti lizator neînregistrat are posibilitatea de a vizualiza cărțile
înregistrate în sistemul bibliotecii și disponibilitatea acestora. În cazul în care utilizatorul are
un cont la bibliotecă, acesta va fi înregistrat în sistem de către bibliotecar și i se va atribui un
username și o parolă prin intermediul cărora se va putea autentifica, drept urmare pe langă
posibilitatea de a putea vizualiza cărțile și disponibilitatea acestora, utilizatorul înregistrat va
putea să își vizualizeze și propriile împrumuturi precum titlul cărții împru mutate, data la care
s-a efectuat împrumutul și data până la care cartea respectiv ă va trebui returnată. În plus, dacă
3
se apropie data la care cartea împrumutată trebuie returnată, utilizatorul va fi înștiințat atât
printr -un e-mail, cât și vizual în cadru l aplicației la secțiunea “My Loans”.
În partea de administrare a aplicației pot exista unul sau mai mulți administratori
(bibliotecari) , acest modul fiind accesat doar prin intermediul u nui username și a unei parole.
Un bibliotecar poate avea acces la detaliile oricărui utilizator înregistrat , detalii precum nume,
prenume, e -mail, sistemul de operare de pe care este accesată aplicația, browse r-ul utilizat,
momentul când acesta s -a înregistrat . De asemenea, bibliotecarul poate înregistra noi
utilizatori, po ate introduce sau șterge din sistem edituri, autori, cărți, poate efectua
împrumuturi, respectiv returnări . Pe lângă acestea, bibliotecarul are permisiunea de a trimite
un e-mail de înștiințare utilizatorilor a căror împrumut urmează să expire.
În ceea ce privește această lucrare pentru proiectul de diplomă, ea este structurată în
trei mari capitole, respectiv partea de concluzii și bibliografie.
În primul capitol al lucrării se prezintă principalele aspecte teoretice ale tehnologiilor
folosite precum: platforma DotKernel 1 ce are la bază framework -ul Zend Framework, PHP
(limbajul de bază utilizat), sistemul relațional de gestiune a bazelor de date MySql, HTML 5 și
CSS 3 în vederea structurării, prezentării și stilizării conținutului web, JavaScript, jQuery și
AJAX pentru a realiza o aplicație cât mai dinamică și plăcută utilizatorilor, Bootstrap și Media
Queries pentru realizarea unei aplicații responsive.
Capitolul al doilea al lucrării prevede modul de proiectare al aplicației web și este
divizat în două subcapitole. În primul subcapitol, intitulat “Proiectarea bazei de date”, se
prezintă baza de date cu tabelele aferente acesteia și relațiile stabilite între tabele, iar cel de -al
doilea subcapitol “Proiectarea aplica ției web ” prezintă pașii de construcție ce s-au urmat în
vederea întocmirii aplicației folosind arhitectura Model – View – Controller.
Cel de -al treilea capitol numit “Implementarea aplica ției web ” prezintă în detaliu
descrierea aplicației dezvoltate : interfa ța cu utilizatorul și modul de utili zare al aplicației.
4
CAPITOLUL I. TEHNOLOGII FOLOSITE LA IMPLEM ENTAREA
APLICA ȚIEI
I.1. PLATFORMA DOTKERNEL 1
DotKernel este o platformă ce utilizează limbajul PHP fiind construit pe baza
framework -ului Zend Framework (ZF) și are la bază 7 ani de experiență a firmei DotBoost
Technologies în ceea ce privește construirea de site -uri și servicii web și reprezintă modalitatea
programatorilor DotBoost Technologies de a readuce comunitatea open source, modalitatea sa
de a "avansa arta PHP". [1]
DotKernel utilizează o arhitectură complexă , dar totusi mai simplificată HMVC
(Hierarchical – Model – View – Controller), ușor de învățat de către programatori i începători
și intermediari. [1]
DotKernel nu este un cadru autonom, utilizând Zend Framework ca o compon entă de
bibliotecă, accesând direct clasele sale. A fost eliminat ă totuși complexitatea ZF utilizând o
abordare diferită a modului în care sunt gestionate cererile web.
DotKernel poate fi folosit ca un I nstrument QuickStart . În mod implicit, a cesta vine c u
cele patru părți esențiale în orice aplicație web și anume: modulul frontend, modulul backend,
modulul mobil e, CLI (linie de comandă), module rss, fiecare modul fiind structurat pe un mo del
MVC (model -view -controller) . Modulul frontend este format din pa gini statice și un formular
de autentificare, iar modulul backend are doar paginile utilizatorilor. [1]
Numele DotKernel combină denumirea "Dot" a companiei mamă, care implică de altfel
și punctul conținut în orice adresă de internet și cuvântul Kernel, ca re sugerează nucleul central
al oricărei aplicații IT, centru esențial al unui sistem de operare pe calculator, nucleul care
furnizează servicii de bază pentru toate celelalte părți ale sistemului de operare. [1]
Structura platformei DotKernel 1 din punct de vedere al folder -elor și a fișierelor este
reprezentată în figura I.1, iar mai jos se prezintă câteva explicații la cele mai importante foldere
și fișiere prevăzute în scheletul DotKernel 1 :
➢ configs – toate variabilele pentru configurare se afl ă aici
➢ controllers – așa cum sugerează și numele folderului, aici se află toate controllere
➢ DotKernel – fișierele pentru Model și View se află aici
➢ externals – poate să conțină și alte API -uri sau librării
➢ images – toate imaginile din cadrul aplicației
5
➢ library – conține librăriile DotKernel
➢ templates – conține fișiere care relaționează cu View
(de tip HTML, CSS sau JavaScript) . [2]
Pe lângă aceste foldere mai există și fișiere specifice
ce stochează informații importante:
➢ application.ini – se stochează variabi le și valori
importante pentru configurare cum ar fi: starea
aplicației (production, staging sau development),
URL -ul aplicației, conexiunea la baz a de date (user și
parole)
➢ resource.xml – include setările modulului cum ar fi
cele legate de controller, ac țiunea implicită a
controller -ului, valori din sesiune
➢ browser.xml – fișier folosit pentru a detecta de pe care
browser a fost accesată aplicația
➢ os.xml – fișier folosit pentru a ști care s istem de
operare rulează pe calculatorul de pe care a fost
accesat ă aplicația
➢ admin/menu.xml – include setări le pentru meniu
corespunz ătoare fiecărui modul (în acest caz pentru
modulul admin)
➢ dotkernel.sql – structura bazei de date și datele din ea
➢ index.php – bootstrapul aplicației . [2]
Fig. I.1 Structura platforme i DotKernel 1
https://www.dotkernel.com/docs/dotkernel -structure/ [2]
Structura DotKernel 1 se bazează pe HMVC ( Hierarchical – Model – View – Controller ).
HMVC este o evoluție a modelu lui M odel – View – Controller. Aceast ă structură face ca MVC –
ul să fie reprezentat printr -o structură arborescentă, accesul la fișiere fiind mult mai ușor și
vizibil. [3]
6
MVC reprezintă un model de design în ingineria software, în special în ceea ce prive ște
domeniul programării interfeței cu utilizatorul. Paradigma MVC este o modalitate de împărțire
a unei aplicații, sau chiar a unei părți din aplicație, în trei părți : model, view și controller. [4]
În figura I.2, se poate observa modul de funcționare al unui MVC, request -urile
realizate de către utilizator sunt trimise către Controller care verifică prin variabila $_POST ce
acțiuni urmează a fi declanșate și apelează mai departe metodele din View și Model pentru a -i
răspunde utilizatorului.
Fig. I. 2 Schema de funcționare a unui MVC
https://www.dotkernel.com/docs/model -view -controller/ [4]
Modelul încapsulează operațiile necesare pentru a obține toate informațiile din baza de
date (d e ex. operații CRUD – Create, Read, Update, Delete). Scopul structurii MVC este de a
face modelul să fie independent de View și de Controller. [4]
Astfel un model este responsabil pentru:
➢ conținul real de informații stocat de obicei într-o bază de date sau într-un fișier XML
➢ trebuie să fie independent, nu poate face referire către view sau control ler
➢ trebuie să conțină metode care manipulează datele .
View redă conținutul modelului. El primește date din model, pe urmă le afișează
utilizatorului. View este responsabil de interfața cu utilizatorul (UI – User Interface). [4]
Așadar, view, răspunde pentru:
➢ orice cod necesar pentru a genera conținut ul ce urmează a fi afișat
➢ obține datele din model și le prezintă utilizatorului
➢ citește datele din model utilizând metodele de interogare furnizate de model
➢ nu ar trebui să modifice starea datelor modelului
7
➢ poate comunica cu modelul, dar comunicarea ar trebui să fie strict pentru citirea
datelor din model
➢ returnează UI, interfața utilizator .
Controller -ul comunică c u view și cu modelul și stabilește legătura dintre cele două
astfel preia datele din model, lucrează asupra datelor primite , iar rezultatul final îl trimite către
view pentru a -l afișa. În orice aplicație web, aceste interacțiuni și acțiuni sunt reprezenta te de
către cererile GET și POST HTTP. [4]
Responsabilitățile controller -ului sunt:
➢ primește cereri de la utilizator, apelează metode le din model care manipulează
datele și view care returnează o nouă pagină cu datele modificate – de obicei, HTML
➢ leagă to ate datele și metodele
➢ instanțiază modelele
➢ trimite acțiuni către model
➢ trimite noile date din model la view
➢ se ocupă și de excepții nu este un mediator între model și view.
I.2. PHP (Hypertext Preprocessor)
PHP este un limbaj de scripting de uz general cu utilizare gratuită , ce reprezint ă un
limbaj de bază utilizat în dezvoltarea de aplicații web și poate fi încorporat în HTML. În locul
unei mulțimi de comenzi HTML (așa cum se utilizează în C sau Pe rl), paginile PHP conțin cod
HTML încorporat care f ace “ceva”. Codul PHP este inclus în tre etichetele <?p hp și ?>. [5]
Limbajul PHP se distinge de limbajul JavaScript prin faptul că tot codul este executat
pe un server și se generează apoi un cod HTML care este trimis în cele din urmă clientului.
Clientul primește rezultatele exec utării acestui script, dar nu știe care a fost codul de bază. [5]
Astfel, fiecare dezvoltator își va configura serverul web pentru a proc esa toate fișierele
HTML cu PHP, în acest mod nu va exista nicio modalitate prin care utilizatori i să poa tă vedea
ce se ascunde în spatele interfeței .
Cea mai bună parte în utilizarea limbajului PHP este simplitatea limbajului, ușurința cu
care se poate învăța de către un începător , dar oferă multe caracteristici avansate și pentru un
programator prof esionist.
PHP este un limbaj de scripting pe partea de server, conceput în primul rând pentru
dezvoltarea aplicațiilor web, dar folosit și ca limbaj de programare cu scop general. Codul PHP
8
este de obicei prelucrat de un interpretor PHP implementat ca modu l în serverul web sau ca
executabil al Interfeței Generale Gateway (CGI). [6]
Serverul web combină rezultatele codului PHP interpretat și executat, care poate
conține orice tip de date, inclusiv imagini, cu pagina web generată. Codul PHP poate fi executat
și cu o interfață în linie de comandă (CLI) și poate fi folosit pentru implementarea aplicațiilor
grafice separate. [6]
Interpretorul standard PHP, pus la dispoziție de către Zend Engine, este open source și
este lansat sub licența PHP. Limbajul PHP a fost portat pe o scară largă și poate fi implementat
pe majoritatea serverelor web , pe aproape toate s istemele de operare și platforme , în mod
gratuit. [6]
Conceptele de baz ă ale programării orientate pe obiecte au fost adăugate în limbajul
PHP începând cu ve rsiunea 3 a acestuia, ele fiind îmbunătățite în versiunea 4. Acest lucru a
permis limbajului să fie mai ușor de folosit la sarcinile mai grele pentru programatorii care erau
deja familiarizați cu aceste concepte.
Această manipulare a obiectelor a fost com plet rescrisă pentru versiunea 5, unde spre
deosebire de versiunea 4 obiectele sunt accesate prin intermediul unui „handle ” și sub formă
de valori ca în versiunile mai vechi.
Începând cu versiunea 5 s -au introdus variabilele și metodele private și protej ate,
împreună cu clasele abstracte, clasele finale, metode abstracte și metode finale. De asemenea,
s-a introdus un mod standard de declarare a constructorilor și a destructorilor, similar cu cel al
altor limbaje orientate pe obiecte, cum ar fi C++, dar și un model standard de tratare a
excepțiilor. Mai mult, PHP 5 a adăugat interfețe și a permis ca mai multe interfețe să fie
implementate.
Versiunea PHP 7 reprezintă singura lansare a acestui limbaj din ultimii 11 ani și înainte
de a fi lansat a stat o per ioada de 2 ani în care a fost dezvoltat. Odata cu PHP7 se schimbă și
versiune a motorului ZEND, astfel va fi de dou ă ori mai rapid în ceea ce privește conver tirea
liniilor de cod în format binar și folos ește mai pu țină memorie pentru acest proces. PHP 7 vin e
cu un suport considerabil pentru platformele ce rulează pe 64 de biți. [7]
În ceea ce privește implementarea aplicației web pentru gestionarea managementului
unei biblioteci, am folosit versiunea 7.1 a acestui limbaj de scripting, această versiune fiind
îmbunătățită față de cele anterioar e unde existau funcții care nu se mai utilizau, nefiind
eficiente. Drept urmare, această versiune mai nouă îndeplinește mai multe standarde și este
actualizată fiind astfel la zi cu toate funcțiile pe care le pune la disp oziție.
9
I.3. M YSQL
MySQL este cel mai popular sistem relațional de gestiune a bazelor de date. Este un
software sp ecializat care permite accesul ș i gesti onarea bazelor de dat e, folosindu -se de
limbajul SQL (Structured Query Language). [8]
Pentru gestio narea bazei de date am folosit programul XAMPP ce are în alcătuire atât
o interfață pe care o oferă “phpMyAdmin”, c ât și un server HTTP “Apache”. Interfața
phpMyAdmin este avantajoasă din punct de vedere al simplității, drept urmare se pot realiza
operații CRUD (Create, Read, Update, Delete) asupra bazei de date direct din această interfață.
Pentru accesarea și manipularea datelor din tabelele bazei de date, am folosit împreună
cu MySQL, limbajul de programare PHP, care rulează pe partea de server a aplic ației.
Am folosit instrucțiunile SELECT, UPDATE și DELETE, cu sintaxa lor specifică, în
structurile și funcțiile aplicației, pentru a accesa informațiile din baza de date sau pentru a le
modifica.
Conexiunea cu baza de date corespunzătoare aplicației web se realizează în fișierul
application.ini după cum urmează:
database.params.host = 127.0.0.1
database.params.dbname = library
database.params.username = root
database.params.password = ''
database.params.profiler = TRUE
Conform parametrilor menționa ți vom selecta adresa de IP a localhost -ului, numele
bazei de date aferent ă aplicației web (“library” în cazul de față ), precum și username -ul și
parola necesară conectării cu interfața phpMyAdmin.
I.4. HTML 5 (HyperText Markup Language)
A fost dezvolt at inițial de Tim Berners -Lee în anul 1990 și reprezintă acronimul pentru
HyperText Markup Language. HTML este folosit pentru a crea documente electronice (pagini
web) care sunt afișate ulterior prin intermediul unui browser . Fiecare pagină conține o serie de
conexiuni la alte pagi ni numite hyperlink -uri. Orice pagină web prezentă pe Internet este scrisă
utilizând o singură versiune a codului HTML . [9]
Construirea de pagini web folosind HTML constă în marcarea conținutului paginii cu
elemente numite „tag” -uri (etichete), de exemplu: <html> și </html> . Pentru semnalarea unui
tip de conținut se utilizază un tag de deschidere și unul de închidere, de exemplu pentru
eviden țierea unui paragraf folosim <p> pentru a marca începutul paragrafului și </p> pentru
10
sfârșitul acestuia . Există și câteva excepții de la această regulă, astfel întâlnim și tag -uri
nepereche precum <img/>. Standardul pentru HTML este păstrat de către W3C (World Wide
Web Co nsortium). [10]
"HyperText" se referă la linkurile care leagă paginile web între ele, fie într -un singur
site web, fie între mai multe site -uri web. Prin încărcarea conținutului pe Internet și stabilirea
legăturilor cu paginile web create de alte persoane se presupune că avem de a face cu un
participant activ în lumea Interne tului (World Wide Web). [11]
HTML reprezintă într -un fel scheletul unei pagini web, fără etichetele acestuia,
browser -ul nu va ști cum să afișeze conținut ul, fie el de tip text, fie multimedia. În aranjarea
elementelor în pagină vine în ajutor limbajul de stilizare CSS, dar în principal fiecare pagină
web are în spate un fișier HTML care îi specifică browser -ului care încarcă aplicația ce tip de
conținut urmează să afișeze. Etichetele nu sunt afișate utilizatorului, ele fiind doar interpretate
de către browser.
Fișierele HTML po t conține secțiuni de cod scrise într -un alt limbaj , cum ar fi limbajul
de scripting JavaScript, care afectează comportamentul paginilor web, dar și cod CSS pentru a
defini aspectul conținutului paginii web. Secțiunile de cod scri se într -un alt limbaj față de
HTML vor fi incluse între tag -uri specifice: <script> și </script> sau <style> și </style>. De
asemenea, pot fi incluse și fișiere CSS sau JavaScript externe , astfel:
<link type="text/css" rel="stylesheet" href="style.css" >
<script type="text/javascript" src="main.js"></script>
Există mai multe versiuni de HTML, cea mai nouă și mai recomandată fiind HTML 5.
Scopul principal al acestei versiuni este de a îmbunătăți consistența de -a lungul tuturor
browser -elor și de a adăuga s uport pentru datele de tip multimedia, furnizând astfel o alternativă
pentru Adobe Flash în redarea de conținut multimedia. D rept urmare au fost introdus e tag-uri
noi, cum ar fi <audio> și </audio>, <video> și </video>, < section > și </section > .
În cadrul acestui proiect, am folosit HTML 5 la construirea fișierelor ce au ca extensie
.tpl. Aceste fișiere reprezintă doar o structură, un șablon care urmează să fie populat cu date de
către celelalte limbaje. În principiu fiecare pagină are câte un fișier tpl s eparat. Unul din
elementele de HTML5 folosit în această aplicație este tag -ul pereche <section > astfel:
<section class = "media-body">
<h4>{BOOK_TITLE}</h4>
<h6>By {BOOK_AUTHORNAME}</h6>
</section>
11
Conținutul prevăzut în tag-ul <section> va fi stilizat cu ajutorul un ei clase “media-
body ”, căr eia îi vor fi aplicate câteva atribute în fișierul style.css . Această secțiune de cod va
afișa titlul cărții, respectiv autorul acesteia. Variabilele {BOOK_TITLE} și
{BOOK_AUTHORNAME} vor fi parsate în partea de View înlocuindu -se astfel cu date
concrete specifice respectivei cărți provenite din baza de dat e.
I.5. CSS 3 (Cascading Style Sheets )
CSS este acronimul pentru Cascading Style Sheets. CSS este o tehnologie utilizată de
majoritatea programatorilor pentru a s tiliza con ținutul paginilor web astfel încât interfața cu
utilizatorul să fie cât mai plăcută și infrmația relevantă să fie găsită cu ușurință . Acesta descrie
modul în care elementele urmează a fi afișate în pagină.
Fișierele CSS sunt folosite în primul râ nd pentru a separa conținutul paginii de aspectul
ei. Prin aspect se poate înțelege poziționarea în pagină, culori, font -uri. Acest lucru poate duce
la o mentenanță mai ușoară a conținutului, poate oferi mai mult control asupra acestuia, poate
permite mai multor pagini HTML să utilizeze aceleași reguli de formatare reducând repetarea
conținutului structural.
Limbajul folosește așa anumiții “selectori” pentru identificarea tag -urilor specifice
HTML. D upă ce elementele sunt identificate se aplică regulile sp ecificate într -un fișier ce are
ca extensie .css pentru selectorul respectiv. Prin “selector” se înțelege fie un atribut
exemplificat printr -un ID (identificator unic în cadrul paginii ) sau printr -o clasă (identificator
ce se poate aplica mai multor tag -uri), fie un tag , de ex. <p>.
În cazul în care apar conflicte de declarare a unor reguli diferite pentru aceleași
componente, aceste conflicte se rezolvă pe baza unui sistem de priorități. În general regula cu
“cel mai specific selector” este aplicată, dar această regulă are câteva excepții cum ar fi
folosirea modificatorului “!important” sau stilizarea inline utilizând tag -ul <style> . Standardul
pentru CSS este menținut de către W3C.
Limbajul CSS este împarțit pe mai multe nivele: CSS1, CSS2, CSS2.1, CSS3, CSS4.
Prima versiune este deja invechită, aceasta fiind urmată de CSS2 și CSS3 care sunt împărțit e
în mai multe module și avansează în procesul de standardizare. Cea mai popular ă versiune
rămâne însă CSS3 . [10]
În vederea stilizării aplicației web am utili zat CSS3. Printe îmbunătățirile pe care le
aduce această versiune se numără: adăugarea de noi selectori ( atribute, pseudo -clase), noi
proprietăți p entru stilizarea fundalului ( background -clip, background -origin, background -size),
12
proprietăți noi pentru for matarea marginilor elementelor (ex. border -radius, border -image), noi
reguli de formatare a coloanelor (column -gap, column -rule-color, column -rule-style). Sunt
adăugate module noi: animații și tranziții.
O componentă importantă în tehnologia CSS o reprezin tă selectorii. Un selector este o
parte dintr -un set de reguli care ne ajută să selectăm conținutul pe care dp să îl stilizăm astfel :
➢ Element type selector – acest tip de selector identifică elementele html din pagină care
au numele indicat [12]
h6 {
margin: 0 0 15px;
font-weight: 500;
color: #5b5b5b;
}
➢ ID selector – poate identifica orice tip de element care are atributul ID de aceeași valoare
ca și selectorul. Atributul ID este un identificator unic în pagina web și se specifică prin
folosire a simbolului “#” [12]
#mainmenu {
position: relative;
}
➢ Class selector – specificare a acestui tip de selector se face prin folosirea simbolului “.”
(punct) și vizează elementele care aparțin aceleași clase , ca cea indicată [12]
.category_icon {
background -color: #ddd;
border-radius: 5px;
color: #ffffff;
position: relative;
transform: rotate(45deg);
}
➢ Pseudo -class – identifică elementele după o posibilă stare î n care pot fi [12]
.category -item:hover {
border-color: #2352c5;
}
I.6. JAVASCRIPT
JavaScript este un limbaj de nivel înalt, dinamic, unic și interpretat. Alături de HTML
și CSS, JavaScript este una dintre cele trei tehnologii de bază ale producției de conținut ce se
află pe World Wide Web.
13
JavaScript rulează pe partea de client a paginii web și este utilizat la programarea
comportamentului paginii la apariția unui eveniment. Executarea codului în browser face ca
răspunsul operațiunilor executate să fie unul foarte rapid. [13]
Mai este considerată o unealtă foarte bună pen tru a controla conținutul paginilor în
funcție de dată, oră, sistem de operare, browser -ul utilizatorilor. Acestea fiind doar câteva din
posibilitățile pe care le oferă acest limbaj. [14]
Script -urile înțelese și efectuate de browser sunt numite scripturi client -side, de aceea
JavaScript este un limbaj de programare orientat pe partea de client. În prezent, pentru
realizarea unor aplicații web dinamice, limbajul JavaScript reprezintă principala metodă
utilizată , drept urmare pentru a face aplicația web cât mai dinamică am ales cu precădere să
folosesc această tehnologie.
Secțiunea de head a paginii este responsabilă cu încărcarea fișierelor JavaScript. Codul
JavaScript se inserează în pagina web prin folosirea tag -urilor specifice <script>…</script>.
Acest tag poate primi ca parametru prin atributul src un fișier, pe care îl încarcă printr -un link
care va accesa fișierul fie de pe internet , fie din sistemul local de fișiere precum în următoarea
secvență de cod:
<head>
<script src="{TEMPLATES_URL}/js/main.js "></script>
<script src="{SITE_URL}/externals/jquery/jquery.min.js"></script>
<script src="{TEMPLATES_URL}/js/vendor/bootstrap.min.js"></script>
<script src="{TEMPLATES_URL}/js/frontend/book -list.js"></script>
</head>
I.7. JQUERY
jQuery est e o bibliote că JavaScript ce se ocupă cu manipularea obiectelor de tip DOM
(Document Object Model) . Acest DOM reprezintă structura arborescentă a tuturor elementelor
oricărei aplicații web .
Librăria a fost proiectată pentru a simplifica modul în care se manipulează c onținutul
paginilor HTML , până la m anipularea evenimentelor și animațiilor din pagină . De exemplu,
jQuery poate fi folosit pentru găsirea unui element în document cu o anumită proprietate (de
exemplu, toate elementele cu o etichetă <p> sau toate etichetele ce au un anumit id sau clasă ),
modificarea unuia sau mai multor atribute ( de exemplu culoare, vizibilitate) sau răspunsul la
un eveniment (de exemplu un click de mouse). De asemenea, librăria mai oferă o var ietate
foarte vastă de animații.
14
Librăria poate fi folosită împreuna cu Ajax sau cu alte limbaje de programare cum ar fi
PHP sau ASP pent ru a accesa informații stocate în bazele de date. Unul dintre avantajele
utilizării acesteia , constă în faptul că rulează pe partea de client a aplicației , astfel per mite
actual izarea informați ilor în pagină fără ca aceasta să necesite o reîncărcare. [15]
Sintaxa general ă a unui cod jQuery este:
$(selector).action() unde:
$ – semn ce define ște/acces ează biblioteca jQuery
selector – pentru a găsi elementele HTML
action – acțiune care va fi executată asupra selectorilor . [16]
În elaborarea aplicației web din cadrul acestei lucrări de diplomă am utilizat biblioteca
jQuery pentru a manipula obiectele de tip DOM și a request -urilor Ajax. Conform secvenței de
cod de mai jos am implementat o funcție ce va avertiza vizual utilizatorul a cărui împrumut
urmează să expire în două zile, pentru ca acesta să returneze cartea la timp și să nu fie nevoit
să plătească o amendă.
$.each($("[deadline]"), function(index, element){
var bookDeadline = $(element).attr('deadline');
var endDate = new Date(bookDeadline);
var currentDate = new Date();
var timeDiff = Math.abs(currentDate.getTime() – endDate.getTime());
var diffDays = Math.ceil(timeDiff / (1000*3600*24));
if((diffDays < 4 && currentDate < endDate) || (currentDate > endDate))
{
$(element).css({"color": "red", "font -weight": "bold"});
}
});
În cazul în care un utilizator are două împrumuturi active, pentru fiecare atribut
“[deadline]” se verific ă dacă diferența dintre data curentă (variabila currentDate ) și termenul
de returnare al cărții (variabila endDate ) este de două zile , dar încă împrum utul este valabil,
sau dacă împrumutul deja a expirat astfel data curentă este mai mare decât data la care trebuia
returnată cartea . În urma îndreplinirii celor două condiții, elementul din pagina web ce are ca
atribut “[deadline]” va fi stilizat altfel și anume textul va fi de culoare roșu și va fi îngroșat
pentru a avertiza vizual utilizatorul cu privire la termenul de returnare al cărții împrumutate.
15
I.8. AJAX (Asinchronous JavaScript and XML)
Această tehnologie permite aplicațiilor web să comunice c u serverul fără a fi nevoie să
reîncarce pagina. Acest lucru este posibil folosind obiectul XMLHttpRequest care face legătura
între browser și server, pentru a face schimb de informații. [17]
Cererile AJAX sunt gestionate prin cod JavaScript. Acesta face o cerere de date la
server, iar când informația este recepționată se declanșează o funcție care gestionează
răspunsul primit de la server. Aceste cereri se efectuează în mod asincron, astfel că în timp ce
cererea se procesează, restul codului rulează fără a fi influențat de aceasta. [17]
Fiecare browser implementează AP I-ul Ajax în mod diferit, aș a că dezvoltatorii de
aplicații web trebuie să se asigure că implementarea lor funcționează pe toate platformele.
Posibilitatea de a folosi Ajax împreună cu jQuer y, face ca acest lucru să nu mai fie o problemă,
întrucât jQuery oferă metode de implementare a tehnologiei Ajax în mod unic pentru toate
platformele, de exemplu : $.ajax(), $.get(), $.getScript(), $.getJSON(), $.post(), $().load().
Marea majoritate a apli cațiilor jQuery nu mai folosesc XML, pentru transportul datelor,
ci acestea sunt transferate folosind formatul JSON .
În aplicația web elaborată, am utilizat tehnologia AJAX în vederea încărcării treptate a
listei de cărți prin sistemul de infinite scroll fără a mai avea un sistem de paginare care să
reîncarce pagina pentru a afișa următoarele cărți înregistrate în baza de date . Inițial se vor
încărca primele 5 cărți, iar pe măsură ce utilizatorul va traversa lista cărților utilizând scroll -ul
mouse -ului se vor încărca următoarele 3 cărți. În cele ce urmează, prezint o secvență de cod
care realizează încărcarea următoarelor cărți înregistrate în sistem:
function loadMorePosts(){
var currentPostId = $( "#list > div.book -item" ).last().attr("book -id");
var postsToLoad = 3;
getNextBooks(currentPostId, postsToLoad);
}
function getNextBooks(currentPostId, count) {
dataToSend = {
currentPostId: currentPostId,
search: listing_search_term,
currentPostsLoaded: $("#list > div.book -item").length,
postsToLoad: count };
var request = $.post(url, dataToSend, function(data, status) {
jsonData = jQuery.parseJSON(data);
if(jsonData.success == true) {
populateData(jsonData.bookList);}
});
}
16
I.9. FORMATUL JSON (JavaScript Object Notation)
JSON este un format standardizat folosit pentru reprezentarea structurilor de date, sub
forma unui obiect JavaScript. Acesta este folosit pentru reprezentarea și transmi terea datelor în
aplicațiile web. JSON folosește sintaxa JavaScript, dar cu toate acestea poate fi folosit
independent în diverse medii de programare, acestea având posibilitatea de a citi și genera
JSON. [18]
Se folosește tipul de dată obiect, pentru a ci ti JSON, iar pentru a trimite informații prin
rețea, se folosește tipul string de date (șir de caractere ). Pentru a converti între cele două tipuri
de date, se folosește obiectul global JSON, care pune la dispoziția programatorilor metode care
să facilitez e aceste operații. [18]
JSON se bazează pe doua structuri de date importante: obiect (object) și mulțime
(array). Un obiect în JSON reprezintă un ansamblu de nume: valoare.
Un tip de dată mulțime reprezintă o colecție ordonata de valori. Acestea se încad rează
intre caracterele “[ ]” și sunt separate prin caracterul “ , ”.
Acest tip de format l -am folosit pentru căutarea cărților în bara de search. În cazul în
care utilizatorul va căuta cartea după titlu, se va realiza auto -completarea posibilului titlu. Pe
măsură ce bibliotecarul efectuează operații de creare, ștergere sau modificare a cărților, se va
genera automat un fișier results.json ce va conține titlurile cărților din baza de date necesare
pentru funcția de auto -completare în momentul căutării une i cărți. Secvența de cod care
realizează generarea fișierului results.json și conținutul fișierului rezultat :
public function generateJsonList() {
$select = $this ->db->select() ->from('book', ['title']);
$result = $this ->db->fetchAll($select);
$finalResu lt = array();
foreach ($result as $key => $value) {
$finalResult['book'] = $result;
}
$fp = fopen('results.json', 'w');
fwrite($fp, json_encode($finalResult));
fclose($fp);
}
{"book":[{"title":"Amintiri din copilarie"},{"title":"Poezii"} ]}
I.10. BOOTSTRAP ȘI MEDIA QUERIES
Boot strap este cel mai popular framework HTML, CSS și J avaScript pentru dezvoltarea
aplicațiilor web, făcându -le compatibile cu dispozitivele mobile. Bootstrap folosește trei fișiere
17
principale: bootstrap.cs s, bootstrap.js, glyphicons. Bootstrap include și un sistem de grid, astfel
dimensiunea ecranului este concepută ca un rând alcătuit din 12 coloane. Pe măsură ce
dimensiunea ecranului se diminuează, aceste coloane se comută una sub cealaltă menținând
același design. Bootstrap include cl ase predefinite frecvent utilizate pentru aranjarea ușoară a
conținutului. [19]
Pentru a funcționa, bootstrap are nevoie de librăria jQuery. Cele doua fișiere menționate
mai sus, pot fi incluse în proiect, local sau printr -un serviciu CDN (Content Delivery Network).
Am utilizat tehnologia bootstrap în toate fișierele .tpl astfel încât conținutul paginilor
web să dețină capacitatea de a se adapta conform dispozitivelor utilizate. Secvența de cod
prezentat ă mai jos eviden țiază clasele predefinite ale tehnolog iei Bootstrap (class = “row”) ,
precum și sistemul de grid al acestei tehnologii (class = “col -xs-12 col -md-4”):
<div class= "container ">
<div class=row" id="list">
<div class="col -xs-12 col-md-4 book-item" book -id="{BOOK_ID}">
<img style="wid th: 153px; height: 258px;"
src="{SITE_URL}/uploads/images/460/{BOOK_IMAGE}.png" class="media -object"
alt="" />
</div>
<div class="media -body">
<h4>{BOOK_TITLE}</h4>
<h6>By {BOOK_AUTHORNAME}</h6>
</div>
</div>
</div>
Media quer ies reprezintă interogările media prin care se definesc anumite reguli ce
permit adaptarea conținutul unei pagini web la rezoluția dispozitivului de pe care este accesată,
fără a schimba conținutul în sine. [20]
Astfel, la o interogare media se poate speci fica un interval de valori ale rezoluțiilor
dispozitivelor de pe care un utilizator poate accesa aplicația. În aplicația implementat ă am
folosit aceste interogări media pentru ca un slide show să dispară dacă dimensiunea ecranului
este redusă la 990 px. M ai jos este prezentată implementarea acestui cod:
@media only screen and (min -width: 768px) and (max -width: 991px) {
.cardslider {
display: none ;
}
}
18
CAPITOLUL II . PROIECTAREA APLICA ȚIEI WEB
În acest capitol prezint arhitectura aplicaț iei și anume modul de proiectare al bazei de
date cu tabelele aferente acesteia și ralațiile stabilite între tabele, precum și pașii ce s -au urmat
în vederea proiectării aplicației folosind arhitectura MVC (Model – View – Controller).
II.1. PROIECTAREA BAZEI DE DATE
Primul pas în proiectarea acestei aplicații const ă în realizarea structurii bazei de date,
crearea tabelelor necesare implementării aplicației și stabilirea relațiilor dintre tabele, acest pas
ajuntând la implementarea cât mai ușoară a pagi nilor. Inițial, structura bazei de date a fost
schițată sugestiv pe o hârtie , după care a fost realizată în interfață pusă la dispoziție de către
programul XAMPP, și anume phpMyAdmin.
Schema bazei de date aferente aplicației “Bacter’s Library” este ilustr ată în figura II. 1:
Fig. II.1 Reprezentarea grafică a bazei de date și relațiile dintre tabele
19
În cele ce urmează prezint pe scurt fiecare tabel ă din baza de date , ce rol are aceasta în
aplicația web implementată și câmpurile reprezentative din cadrul a cestora. Fiecare tabelă
conține o coloană care reprezintă identificatorul unic (ID) al fiecărei înregistrări, fiind urmată
de restul coloanelor specifice fiecărei tabele în parte, astfel :
➢ Tabela user – conține informații le relevante unui utilizator care va fi înregistrat în sistem
de către bibliotecar , precum username, parol ă, e-mail, nume, prenume, data când a fost
creat contul și disponibilitatea contului, astfel încât un utilizator a cărui permis de
bibliotecă a expirat, va avea contul dezactivat urmând să fie șters în cazul în care
utilizatorul nu își prelungește permisul la bibliotecă .
➢ Tabela userlogin – conține date referitoare tot la utilizator , însă doar cele relevante
pentru momentul în care acesta este conectat în cadrul aplicației și se leagă de tabela
user prin cheia extern ă (foreign key) userI d. Aceste date sunt vizibile doar pentru
administrator.
➢ Tabela admin – conține, precum în cazul tabelei user, datele relevante ale unui
administrator sau bibliotecar.
➢ Tabela admin login – precum în cazul tabelei userlogin, reține datele unui administrator
sau bibliotecar când acesta este conectat și face legătura cu tabela admin prin cheia
externă adminId .
➢ Tabela statisticvisit – este alcătuită din câmpuri ce conțin informații relavante în ceea
ce priv ește autentificarea utilizatorilor, astfel aceste câmpuri vor reține adresa de IP a
utilizatorilor, browser -ul folosit în vederea accesării aplicației web, sistemul de operare
utilizat, țara de unde s -a accesat aplicația.
➢ Tabela statisticvisitmobile – conține, precum în cazul tabelei statisticvisit , date
importante în ceea ce privește autentificarea utilizatorilor, accesând aplicația web prin
intermediul unui dispozitiv mobil. Tabela conține un câmp visitId prin intermediul
căruia se stabilește legătura c u tabela statisticvisit. Câmpul visitId reprezintă cheia
externă a acestei tabele.
20
➢ Tabela setting – este o tabelă relevantă pentru a stabili anumite setări ale platformei
DotKernel 1, precum resultatele afișate pe o pagină, formatul datei.
➢ Tabela book – utilizată pentru a reține informațiile cărților înregistrate în baza de date
de către bibliotecar, precum titlul c ărții, numele autorului și a editurii respective i cărți,
anul în care a fost publicată cartea, o imagine relevantă a cărții, numărul total de
exemplare din cartea respectivă, cât și detalii referitoare la genul sau tipul cărții (de
exemplu poezie, proză, IT) . Numele autorului, a editurii și a tipului cărții vor fi luate
din tabelele aferente acestora. Acest lucru este posibil datorită celor trei chei externe
(foreign key) authorId, publisherId, typeId.
➢ Tabela author – reține informați ile cu privire la numele autorilor, care prin cheia
externă authorId din tabela book vor fi atribuite cărților înregistrate în sistem.
➢ Tabela publisher – conți ne informații referitoare la numele editurilor, care prin cheia
externă publisherId din tabela book vor fi atribuite cărților înregistrate în sistem .
➢ Tabela type – conține informații cu privire la genul sau tipul cărții (de exemplu poezie,
proză, IT), ca re prin cheia externă typeId din tabela book vor fi atribuite cărților
înregistrate în baza de date.
➢ Tabela loan – este utilizată în cazul în care un utilizator va împrumuta o anumită carte,
astfel încât va conține detaliile cărții împrumutate, detalii cu privire la persoana care a
împrumutat cartea, precum și data la care s -a efectuat împrumutul. Această tabelă
stabilește legătura cu tabela book prin cheia externă bookId, dar și cu tabela user prin
intermediul cheii extern e userId.
Toate datele din aces te tabele vor fi manipulate mai departe cu ajutorul instrucțiunilor
SQL scrise în partea de backend, mai exact în Model , cel care se ocupă cu manipularea datelor
din baza de date și realizarea operațiilor CRUD (Create, Read, Update, Delete) pe aceste date .
Pentru crearea unei conexiuni la baza de date și pentru a executa acele instrucțiuni scrise în
Model am folosit programul XAMPP, iar pentru realizarea propriu -zisă a bazei de date,
phpMyAdmin.
21
Detaliile conexiunii cu baza de date sunt prezente în fișier ul application.ini după cum
am menționat și în primul capitol când am descris sistemul relațional de gestiune a bazelor de
date MySQL, astfel avem următoarea secvență :
database.params.host = 127.0.0.1
database.params.dbname = library
database.params. username = root
database.params.password = ''
database.params.profiler = TRUE
Conform parametrilor specificați necesari conexiunii cu baza de date vom selecta
adresa de IP a localhost -ului, numele bazei de date aferentă aplicației web (“library” în cazul
de față), precum și username -ul și parola necesară conectării cu interfața phpMyAdmin .
II.2. PROIECTAREA APLICAȚIEI WEB
Aplicația web implementată este construită după modelul MVC (Model – View –
Controller) pe scheletul framework -ului DotKernel 1. Această arhitectură de proiectare
presupune împărțirea logicii aplicației în trei părți distinct e, așa cum a fost explicat în pr imul
capit ol la prezentarea platformei DotKernel 1 . Prin această arhitectură de proiectare se obține
o mai bună modularizare, o m ai ușoara colaborare între procesul de dezvoltare și reutilizarea
codului. Cele trei părți, luate separat tratează aspecte diferite și specifice din logica aplicației.
”Model” , modelul aplicației definește care sunt datele pe care le conține aplicația. D aca
starea acestor date va fi modificată , modelul va semnala acest lucru interfeței care este
reprezentată prin ”View” . Aceasta la rândul ei va fi actualizată în conformitate cu noua stare a
datelor din model.
”View” , reprezintă partea de interfață a apli cației. Acesta este responsabil cu încărcarea
fișierel or care compun design -ul aplicației , dar și cu setarea variabilelor și parsarea blocurilor
funcționale prezente în fișierele care au ca extensie .tpl . Aceste fișiere sunt implementate sub
formă de templ ate-uri și sunt încărcate în aplicației în funcție de datele care sunt furnizate de
model.
”Controller” , este partea care conține logica prin care se vor actualiza datele din model
și cele din view. Datele de intrare care sunt folosite în controller, vin direct de la utilizator prin
intermediul formularelor sau a elementelor de interacțiune, care sunt puse la îndemâna
utilizatorilor aplicației.
Mai multe informații cu privire la responsabilitățile acestor trei componen te au fost
prezentate mai sus, când s-a descris platforma DotKernel 1 .
22
În cele ce urmează voi detalia totuși MVC -ul ce conține strict datele din cadrul aplicației
prezentate, și voi da astfel și un exemplu de MVC pentru o mai bună înțelegere a acestui
concept atât de des folosit în lumea a plicațiilor web și nu numai.
II.2.1 . Model
Locația fișier elor ce intră în alcătuirea modelului este în folderul DotKernel în modulul
admin și frontend . Există câte un model pentru fiecare modul , deoarece unele infomarții care
sunt prezente în partea d e admin vor lipsi în frontend . În aplicație fișierele care compun modelul
au rolul de a instanția, de a prelucra în mod direct datele provenite din tabelele bazei de date și
de a verifica anumite informații deja existente în cadrul acesteia. Funcțiile din model au rol
specific în procesarea datelor. Sunt prezente funcții care manipulează informați ile despre
utilizatori, cărți, autori, împrumuturile efectuate . Aceste funcții se vor concretiza toate într -un
singur obiect, acesta fiind instanțiat în controller , având apoi acces prin intermediul lui la toate
aceste metode.
Secvența de cod de mai jos realizează o interogare cu baza de date, astfel ia informații
din tabela “book” ce vor fi transmise pentru controller pentru a le prelucra . Deoarece tabela
“book ” are în componență câmpuri ce reprezintă chei externe pentru alte tabele, se va realiza
legătura cu acestea prin funcția joinLeft care va prelua câmpurile necesare pentru afișarea
informațiilor necesare fiecarei cărți.
public function getBookList ByAuthor($id, $page = 1) {
$select = $this ->db->select()
->from('book')
-> where('authorId = ?', $id)
-> joinLeft('author','book.authorId=author.id',['authorId'=>
'author.id', 'authorName'=>'author.name'])
-> joinLeft('publisher','book.publisherId = publisher.id',
['publisherId' => 'publisher.id', 'publisherName' =>
'publisher.name' ])
-> joinLeft('type','book.typeId = type.id',['typeId' =>
'type.id', 'typeName' => 'type.name' ]) ;
$dotPaginator = new Dot_Paginator($select, $page, $this ->settings
-> resultsPerPage);
return $dotPaginator ->getData();
}
Rezultatul va fi returnat prin intermediul variabilei $dotPaginator care este o instanță a
clasei Dot_Paginator , deoarece acest rezultat poate fi constituit din mai multe cărți înregistrate
în sistem de către bibliotecar , fiind astfel necesare mai multe pagini. Dot_Paginator este o
funcți e responsabilă de paginația conținutului.
23
Modul în care am apelat mai departe funcția în controller este ilustrat în următoarea
linie de cod :
$bookList = $bookModel ->getBookListByAuthor($authorId, $page);
Astfel, coloana pe care o caută este “author Id” din tabela “book ”, iar authorId -ul va
primi valoarea id -ului autorului cărții respective obținut din regiștri de sesiune. Toate datele
din sesi une sunt stocate într -un obiect $registry astfel se va verifica dacă id -ul autorului există
în sesiune, daca există atunci variabila $authorId va lua valoarea corespunzătoare, altfel
variabila va fi goala. Următoarea linie de cod exemplifică modul în care se ia din regiștri id-ul
autorului:
$authorId = (isset($registry ->request['author'])) ?
$registry ->request['author'] : '';
Printre alte funcții prezente în Model se numără și cele care realizează efectiv operațiile
CRUD pe baza de da te: public function insert Book ($book ), funcție care va insera o nouă carte
în baza de date , public function delete Book ($id), aceasta va șterge o anumită carte primind ca
parametru id -ul respectivei cărți , public function update Book ($id, $ book ), funcție car e va
actualiza informațiile unei anumite cărți.
II.2.2 . View
În partea de view sunt organizate fișierele responsabile pentru crearea interfeței cu
utilizatorul . Aceste fișiere sunt salvate în format .tpl și conțin de fapt cod HTML. Locația
acestor fiși ere se regăsește în folderul Templates care este structura t pentru cele două module:
admin și frontend . Aceste fișiere conțin doar structura paginii reprezentată prin tag -uri HTML
și variabile tpl sau blocuri funcționale care urmează a fi parsate în View prin limbajul PHP.
Pentru a evidenția mai bine un astfel de fișier tpl, prezint în cele ce urmează fișierul
responsabil pentru afișarea paginii de ștergere a unei cărți din sistem :
<form action="{SITE_URL}/admin/book/delete/id/{BOOK_ID}" method="post" >
<input type="hidden" name="userToken" value="{USERTOKEN}">
<div class="rounded -corners box -shadow" style="width: 600px">
<div class="box_header round -left-right-top">
Delete book: {BOOK_TITLE} </div>
<ul class="form delete">
<li class="clearfix" >
<p>Are you sure you want to delete this book?</p>
</li>
<li>
<input type="checkbox" name="confirm">
<label>Confirm deletion</label>
24
<input type="submit" class="button" value="YES" style="float:
left; margin -right:10px;">
<input type ="button" onclick="window.location =
'{SITE_URL}/admin/book/list'" class="button" value="Cancel">
</li>
</ul>
</div>
</form>
Pagina responsabilă pentru ștergerea unei cărți este reprezentată sub forma unui
formular, iar datele din acesta vor fi procesate cu ajutorul limbajului PHP. Variabilele tpl vor
fi de asemeanea parsate în View . Funcția care realizează acest lucru este:
public function displayPage($tplFile, $data = array()) {
$this->tpl->setFile('tpl_main', 'book/' . $tplFile . '.tpl') ;
foreach ($data as $key => $value) {
$this->tpl->setVar(strtoupper('BOOK_' . $key), $value);}
}
}
Funcția primește ca parametri numele paginii tpl ce urmează a fi afișată , în acest caz
numele fișierului este delete și un array care conține informații le unei cărți. Prima dată va fi
setat fișierul dat ca paramentru , tpl_main care reprezintă conținutul paginii , book , folderul în
care se află fișierul parametru și tplFile, pagina în sine. Valorile vor fi parcurse apoi printr -un
foreach și se vor parsa varibilele tpl , în acest caz {BOOK_TITLE} , înlocuindu -le cu conținutul
din baza de date . Funcția este apelată în controller în felul următor:
$bookView ->displayPage('delete', $data);
II.2.3 . Controller
Controller -ul include totalitatea fișierel or care co nțin logica de prelucrare a datelor
primite de la client, în urma interacțiunii utilizatorului cu interfața. În aplicație aceste fișiere
primesc prin metodele $_GET sau $_ POST informații de la utilizatori, prin intermediul
formularelor sau a altor element e de interacțiune. Informații le primite sunt mai apoi procesate,
iar dacă este necesar se interacționează cu modelul și apoi se actualizează interfața în mod
corespunzător apelând funcții din View.
În orice controller din această aplicație trebuie să se i nițializeze la început o instanță a
clasei View și una a clasei Model pentru a stabili legătura atât cu funcțiile ce operează pe baza
de date, cât și cu funcțiile ce parsează elementele din fișierele tpl pentru interfața cu utilizatorul.
Există câte un c ontroller separate pentru fiecare modul: c ărți, autori, edituri,
împrumuturi. În fiecare controller va fi prezent un switch case care va lua datele din $_POST,
25
aflând astfel ce acțiune urmează să îndeplinească. Un exemplu de acest fel este prezentat în
secvența de cod următoare :
switch($registry ->requestAction) {
case 'list':
$bookList = $bookModel->getBookList($page);
$bookView->listBook('list', $ bookList);
break;
case 'add':
…
}
Secvența de cod ilustrat ă mai sus va duce la sfârșit afișarea tuturor cărților înregistrate
în sistem , având nevoie de toate datele din baza de date, pe care le obține cu ajutorul funcției
din model getBookList și cu ajutorul metodei din view listBook , unde se vor parsa și înlocui
cu conținutul re al toate variabilele tpl.
26
CAPITOLUL III. IMPLEMENTAREA APLICAȚIEI WEB
III.1. ARHITECTURA APLICA ȚIEI
Aplica ția web implementată pentru gestionarea managementului unei biblioteci
“Bacter’s Library” este o aplica ție complexă din punct de vedere al arhitecturii, drept urmare
dispune de două module esențiale pentru buna organizare din cadrul unei biblioteci, astfel
întâlnim :
➢ modulul frontend
➢ modulul admin
În partea de frontend, după cum am mai precizat, un utilizator poate fi fie neînre gistrat,
fie înregistrat. În primul caz, utilizatorul va putea vizualiza doar cărțile înregistrate în sistem,
iar în cel de -al doilea caz, utilizatorul va putea să vizualizeze și propriile împrumuturi.
Reprezentarea grafică a arhitecturii modulului fronten d este reprezentată în figura III. 1.
Fig. III. 1 Reprezentarea grafică a arhitecturii modulului frontend
În modulul admin au acces doar anumite persoane, fie administratorul bibliotecii, fie
bibliotecarul care are îndatorirea de a se ocupa de administra rea conținutului din modulul
frontend pe care orice utilizator îl poate vedea, astfel acesta are dreptul de a înregistra noi
utilizatori, de a introduce cărți în sistem și de a ține evidența împrumuturilor, precum persoana
care a împrumutat, cartea împrumu tată, data la care s -a efectuat împrumutul și data la care
cartea respectivă va trebui returnată.
27
Conform modulului admin, un bibliotecar va avea acces la urmăroarele informații
prevăzute în figura III. 2 care evidențiază reprezentarea grafică a arhitectu rii modulului admin.
Fig. III.2 Reprezentarea grafică a arhitecturii modulului admin
III.2. DESCRIEREA INTERFEȚEI ȘI UTILIZAREA APLICAȚIEI
Pentru a descrie interfața cu utilizatorul și utilizarea aplicației web “Bacter’s Library” ,
în cele ce urmează prezint pe rând cele două module: modulul admin și modulul frontend . Cele
două module enunțate comunică între ele astfel încăt informațiile înregistrate în sistem de către
bibliotecar pe partea de admin, vor fi regăsite și afișate utilizatorului în modulul responsabil de
frontend.
III.2.1 Modulul admin
În ceea ce privește bibliotecarul, acesta va avea un username și o parolă pentru
înregistrare, astfel încât odată autentificat bibliotecarul va putea înregistra, edita sau șterge din
sistem utilizatori, cărți, autori, edituri, genuri, precum și atribuirea de împrumuturi sau
restituirea cărților. Pentru a se conecta, bibliotecarul trebuie să completeze un formular cu
username -ul și parola aferentă acestuia. Pagina de conectare este ilustrată în figura III. 3.
Fig. III. 3 Pagina de conectare admin
Odată ce s-a conectat, bibliotecarul este redirecționat către pagina “Dashboard”, prima
pagin ă a acestui modul admin. Această pagină conține informații generale cu privire la
versiunea de PHP și MySQL folosită, v ersiunea framework -ului Zend Framework. Pe lângă
28
aceste detalii , în pagina “Dashboard” sunt evidențiate prin grafice și anumite statistici în ceea
ce privește utilizatorii care s -au înregistrat , figura III.4 .
Fig. III.4 Grafic statistic ă utilizatori
Din cadrul meniului “User – Logins”, bibliotecarul poate vizualiza și informații precum
persoanele care s -au conectat într -o anumită zi, ce browser au utilizat în vederea conectării la
aplicația web implementată, ce sistem de operare are dispozitivul de pe ca re s-au conectat, dar
și adresa de IP corespunzătoare. În imaginea de mai jos, figura III.5, sunt prezentați doi
utilizatori diferiți conectați .
Fig. III.5 Detaliile de conectare a doi utilizatori
De asemenea, bibliotecarul poate realiza operații de adă ugare, editate sau ștergere a
unei cărți din baza de date utilizând interfața. Pentru a se adăuga o nouă carte în baza de date,
trebuie mai întâi să existe în sistem autorul cărții, editura și tipul sau genul acesteia. În cazul
în care nu există, se vor a dauga pe rând completând formularul aferent. Dacă toate acestea deja
există, atunci bibliotecarul poate să introducă noua carte în sistem completând astfel titlul,
autorul, editura, tipul, anul publicării, numărul total de exemplare, dar și selectarea unei imagini
adecvate pentru coperta cărții respective , precum în formularul din figura III.6.
29
Fig. III.6 Formular pentru inserarea unei noi cărți
Odată ce cărțile sunt introduse în sistem, bibliotecarul poate să vizualizeze lista acestora
accesând meniu “B ook – List” . Tot în cadrul acestei pagini, are diverse acțiuni în ceea ce
privește o anumită carte, astfel poate șterge cartea în cazul în care nu există împrumuturi active,
poate modifica numărul de exemplare și poate realiza împrumutul cărții respective. Dacă o
carte este deja împrumutată, atunci se va modifica în mod automat și disponibilitatea acestora.
Figura III.7 prezintă lista cărților și posibilele acțiuni asupra lor. Pentru a căuta o anumită carte,
bibliotecarul are le dispoziție un search bar prin care poate găsi cartea dorită după titlu.
Fig. III.7 Lista cărților și posibilele acțiuni asupra acestora
În cazul în care s -a efectuat un împrumut, bibliotecarul va putea gestiona aceste
împrumuturi accesând din meniu pagina “Loan – List” care conțin e username -ul celui care a
împrumutat cartea, titlul cărții împrumutate, data la care s -a efectuat împrumutul și data pană
la care cartea ar trebui returnată. Pe langă acestea, bibliotecarul are dreptul și de a șterge un
împrumut în momentul în care persoa na vine să restituie cartea, dar și de a modifica data
împrumutului.
30
Dacă data împrumutului a expirat, adică cartea nu s -a returnat la timp, atunci în
momentul în care se va încerca ștergerea împrumutului, bibliotecarul va fi înștiințat că
respectiva pers oană va avea de plătit o amendă (figura III.8) .
Fig. III.8 Ștergerea unui împrumut care a expirat
În plus, dacă data împrumutului se apropie cu două zile de data la care trebuie returnată
cartea, atunci bibliotecarul are opțiunea de a trimite un e-mail de înștiințare persoanei care a
împrumutat cartea. Acest e -mail va fi completat automat conform următoarei secvențe de cod :
$mail = new Message();
$mail->addTo($loanDeadline ['userEmail']);
$mail->setFrom( 'bacterslibrary@gmail.com ', "Bacter's L ibrary");
$mail->setSubject('Book Loan');
$mail->setBody(
'The "' . $loanDeadline ['bookTitle'] .
'" book loan will expire on ' .
$loanDeadline ['endDate'] .
'. Please come to Bacter \'s Library to return the book , or to
extend the loan term. Thank you!'
);
$transport = new Smtp();
$options = new SmtpOptions([
'host' => 'smtp.gmail.com',
'port' => 587,
'connection_class' => 'login',
'connection_co nfig' => [
'username' => 'bacterslibrary@gmail.com',
'password' => 'blibrary2018 ',
'ssl' => 'tls'
]
]);
$transport ->setOptions($options);
$transport ->send($mail);
Conform secven ței de cod enunțate mai sus, pentru a trimite un e -mail am folosit clasa
“Message” din biblioteca Zend Framework. Conform acestei clase trebuie specificați anumiți
parametri ce fac posibilă expedierea cu succes a e-mail-ului.
31
Se va stabili destinatarul și exped itorul e -mail-ului atribuind funcției “addTo”, respectiv
“setFrom” adresa de e -mail necesar ă celor două entități. Subiectul și conținutul e -mail-ului va
fi stabilit conform celor două funcții “setSubject” și “setBody”. Pentru ca respectivul e -mail de
înștiințare al utilizatorului să fie trimis, trebuie să îi specific și un protocol specific deseori în
trimiterea de e -mail-uri și anume SMTP.
În aplicația implementată am folosit server -ul celor de la Google, astfel în ceea ce
privește opțiunile protocolului SMTP am utilizat adresa de host și portul lor, iar pentru
conectare am avut nevoie de o adresă de gmail însoțită de parolă și de protoco lul criptografic
care permit e comunica rea sigur ă pe Internet “TLS” .
III.2.2 Modulul frontend
Acest modul este dedicat utilizatorilor aplicației web “Bacter’s Library”. Ace ști
utilizatori, după cum am mai specificat, pot accesa aplicație fie pentru un scop informativ cu
privire la cărțile înregistrate și disponibilitatea acestora neavând astfel un cont de înregistrare,
fie au un cont de înregistrare și urmăresc starea eventualelor împrumuturi, precum cartea
împrumutata, data la care s -a realizat împrumutul, dar și data la care respectiva carte va trebui
returnată bibliotecii.
Modulul frontend reprezintă de fapt o interfață prietenoasă cu utilizatorul, astfel datele
introduse în baza de date de către bibliotecar prin modulul de admin, vor fi regăsite și în acest
modul într -o manieră plăcută utilizatorilor.
Fig. III.9 Aplicație web responsive
32
Într-o aplicație web este impor tant ca utilizatorul să găsească cu ușurință informația
căutată indiferent de dispozitivul pe care îl folosește în vederea accesării aplicației. Drept
urmare pentru ca acest fapt să fie posibil am implementat un design responsive plăcut , conform
imaginii d in figura III.9, utilizând elemente de bootstrap și media queries, descrise și în primul
capitol intitulat “Tehnologii folosite la implementarea aplica ției”.
Pentru a descrie mult mai bine interfața aplicației și modul de utilizare a acesteia din
perspect iva acestui modul, prezint în cele ce urmează paginile aferente modulului frontend.
III.2.2.1 Prima pagină (Home Page)
Înainte de a pătrunde în universul cărților și al lecturii am ales să implementez o primă
pagină mai mult informativă cu privire la bi blioteca “Bacter’s Library”.
Conform acestei pagini am prezentat c âteva detalii bine de știut de către utilizatori,
precum deviza acestei biblioteci, avantajele oferite celor care au un permis de bibliotecă,
informații cu privire la gama largă de cărți ș i de exemplare ale acestora acoperind o varietate
de domenii.
De asemenea, în subsolul paginii se regăsesc informații cu privire la locația fizică a
bibliotecii , dar și informații de contact precum adresă de e -mail, adresa de facebook, număr de
telefon, d etalii cu privire la programul de funcționare al bibliotecii.
Încă din această pagină am oferit utilizatorilor posibilitatea de a căuta cartea dorită după
titlu, implementând astfel un search bar . Pe măsură ce utilizatorul va introduce titlul, acesta va
acorda o sugestie penru autocompletare în funcție de caracterele introduse până atunci de
utilizator.
Fig. III. 10 Prima pagină (Home Page)
33
III.2.2.2 Pagina “Cărți” (Books Page)
În această pagină se v or afișa to ate cărțile introduse în sistem de către b ibliotecar. Legat
de acestea, utilizatorul va putea vizualiza detaliile de interes precum titlul, autorul, editura,
tipul sau genul, anul publicării, dar și disponibilitatea momentană a acesto ra.
Această pagina este accesată de orice utilizator, fie dacă e ste conectat, fie în caz contrar.
La fel ca în cazul primei pagini, utilizatorul are posibilitatea de a căuta o carte după titlul,
oferindu -i-se sugestii de autocompletare în momentul în care introduce caractere în bara de
search.
Un alt avantaj al aceste i aplicații este acela de a sorta cărțile în funcție de autor, editură
sau gen. Această implementare este benefică în cazul în care utilizatorul nu cunoaște titlul cărții
de interes, dar totuși cunoaște autorul acesteia.
În ceea ce privește afișarea tuturo r cărților înregistrate în baza de date, am folosit, după
cele precizate și în primul capitol, tehnologia AJAX pentru a evita paginarea sau reîncărcarea
paginii. Lista cărților să se înc ărca treptat pe măsură ce utilizatorul va traversa lista utilizând
scoll-ul mouse -ului sau bara de scroll pusă la dispoziție de către browser -ul utilizat. Inițial se
vor încărca primele 5 cărți, urmând să se încarce în aceeași pagină următoarele 3 cărți.
Imaginiea din figura III.11 prezintă această pagină responsabilă cu af ișarea cărților din
sistem, precum și posibilitatea de a sorta cărțile după autor. De remarcat este faptul că din
exemplarele primei cărți mai sunt disponibile doar 4 în vederea fie a lecturării lor la bibliotecă ,
fie a împrumutării , două fiind deja împru mutate.
Fig. III.11 Pagina “Cărți” (Books Page)
34
III.2.2.3 Pagina de logare (Log In Page )
Dacă o persoană are un abonament la bibliotecă, atunci acesteia i se va atribui de către
bibliotecar un cont de înregistrare format dintr -un username și o parolă. Un utilizator înregistrat
va avea mai multe drepturi în aplicația web, astfel încât are permisiunea de a vizualiza pe lânga
lista cărților din sistem și eventualele împrumuturi, precum și detalii despre propriul cont .
Pentru a se conecta, utilizatorul va a vea de completat următorul formular prezentat în
figura III.12 . Dacă datele introduse sunt valide, atunci utilizatorul va fi conectat având acces și
la pagina “My Loans” care va afișa informații cu privire la eventuala carte împrumutată. În
cazul în care, datele introduse nu sunt valide, utilizatorul va fi informat prin mesaje de eroare,
conform figurii III.13.
Fig. III.12 Formular de logare Fig. III.13 Formular date nevalide
Validarea datelor se face cu ajutorul unor func ții oferite de către framework -ul Zend
Framework, astfel se asigură că fiecare câmp este completat corespunzător cu datele necesare.
În ceea ce privește parola , aceasta este encriptată conform algoritmului md5, astfel, nici măcar
cel care administrează apl icația nu va ști parola proprie a ficărui utilizator. Cripatarea este
procesul de ascundere a informației pentru a proteja datelor. Limbajul de scripting PHP vine
cu funcția de criptare md5 astfel că procesul este mai rapid.
În cele ce urmează , prezint pri ntr-o secvență de cod, funcția ce realizează validarea
username -ului:
public function isValid() {
if(array_key_exists('username', $values)){
$validatorChain = new Zend_Validate();
$validatorChain ->addValidator(new Zend_Validate_Alnum())
->addValidator(
new Zend_Validate_StringLength(
$this->option->validate ->details ->lengthMin,
$this->option->validate ->details ->lengthMax)
);
$this->_callFilter($validatorChain, $values['username']);
}
}
35
Conform a cestei funcții de validare a username -ului, se verifică dacă sunt introdu se
caractere alfa -numerice, precum și dacă se respectă lungimea minimă și maximă a întregului
șir de caractere Lungimea maximă și cea minimă a șirului de caractere precum și mesajele de
eroare afișate, se regăsesc într -un fișier xml situat în folderul “confings – dots” .
III.2.2. 4 Pagina “Împrumuturi ” (My Loans Page )
După cum am mai specificat de -a lungul acestei lucrări, în cazul în care o persoană are
permis de bibliotecă va fi înre gistrată în sistem de către bibliotecar și i se va atribui un username
și o parolă pentru a putea să se conecteze pe aplicația web “Bacter’ s Library ”.
Odată conectată, persoana respectivă pe lângă vizualizarea tuturor cărților înregistrate
și disponibilit atea acesto ra, va putea vizualiza și pr opriile împrumuturi, în cazul în care aceastea
există. Pentru vizualizarea acestora, utilizatorul va accesa din meniu pagina “My Loans” .
Fig. III.14 Pagina “Împrumuturi” (My Loans Page )
În figura III.14 afișată mai sus, se poate observa că utilizatorul înregistrat are la activ
două cărți împrumutate. În momentul în care termenul de împrumut al unei cărți se apropie cu
două zile de data la care ar trebui returnată bibliotecii, atunci utilizatorul va fi avertizat vizu al
prin schimbarea culorii datei de returnare, dar și printr -o notificare sub formă de e -mail care va
avea ca subiect o avertizare cum că respectiva carte va trebui returnată sau va trebui să se
prelungească respectivul împrumut pentru ca persoana respecti vă să nu fie penalizată.
Imaginea din figura III. 15 arată forma finală a unui e -mail primit de către utilizatorul a
cărui împrumut se apropie cu două zile de termenul limită conform căruia cartea ar trebui
returnată bibliotecii . Acest e -mail va fi trimis d e către bibliotecar, utilizând modulul admin, iar
36
conținutul acestuia este completat automat, numele cărții respective și data returnării fiind
accesate din baza de date aferentă tabelei “loan” . Mai multe inform ații cu privire la
implementarea acestui avan taj sunt prezentate la finele subcapitolului III.2.1 intitulat “Modulul
admin ”.
Fig. III.15 E -mail avertizare utilizator
37
CONCLUZII
În ziua de astăzi totul este transpus în format digital, astfel vechile cataloage sau registre
ce au ca scop înregistrarea manuală a anumitor parametri, sunt înlocuite cu noile tehnici ce
aduc un plus utilizatorilor aflați în cauză, drept urmare este mult mai ușor să gestionăm lucruri
în format digital. Luând în calcul aplicația elaborată, este mult mai eficient atât din punct de
vedere al timpului, cât și din punct de vedere al realizării unor rapoarte cu privire la activitatea
desfășurată, să gestionăm cărțile din cadrul unei biblioteci și să ținem evidența împrumuturilor
aferente.
Drept urmare, aplica ția web “Bacter’s Library” a fost implementat ă ca un plus atât
pentru bibliotecari gestionând mai ușor utilizatorii, cărțile și împrumuturile, cât și pentru
utilizatori având posibilitatea de a vizualiza cărțile existente în bibliotec ă, precum și
disponibi litatea acestora în funcție de eventualele împrumuturi anterioare. În plus, utilizatorii
care au efectuat un împrumut, vor avea dreptul de a vizualiza starea acestora fiind avertizați
atât vizual, cât și printr -un e-mail în cazul în care vor trebui sa rest ituie cartea.
În ceea ce privește avantajele acestei aplicații, în primul rând oferă simplitate și ușurință
în navigare, astfel datorită design -ului responsive plăcut, utilizatorii vor găsi imediat informația
căutată, indiferent de dispozitivul fie el te lefon mobil, fie tabletă, laptop sau desktop. În cel de –
al doilea rând, un alt avantaj este reprezentat de faptul că indiferent daca utilizatorul este sau
nu conectat, acesta va primi un e -mail de avert izare cu privire la expirarea împrumutului, astfel
acesta va avea timp să returneze cartea sau să prelungească termenul împrumutului.
Într-o altă ordine de idei , ca viitoare dezvoltări, aplicați a web pentru gestionarea
managementului unei biblioteci va putea suferi modificări pentru a spori performanțele.
Conform acestor dezvoltări viitoare, aplicația va putea fi îmbunătățită prin implementarea unui
sistem de QR Code Reader, astfel bibliotecarul va avea o muncă și mai ușoară în ceea ce
privește căutarea sau înregistrarea unei cărți în baza de date, scanând do ar codul inscripționat
pe carte. De asemenea, în ceea ce privește trimiterea de e -mail-uri, aceasta va putea fi
automatizată folosind task -uri programabile Cron Jobs.
În concluzie, pentru elaborarea aplicației web pentru gestionarea managementului unei
biblioteci ce poartă ca nume “Bacter’s Library”, am aplicat cunoștințele mele dobândite de -a
lungul celor 4 ani de facultate, precum și cele dobândite în urma experienței mele profesionale.
Prin realizarea acestei aplicații mi -am însușit mult mai bine cunoș tințele și de asemenea m -am
familiarizat și cu tehnologiile pe care le -am utilizat mai puțin sau chiar deloc.
38
BIBLIOGRAFIE
[1] https://www.dotkernel.com/docs/what -is-dotkernel , Consultat la 14.06.2018
[2] https://www.dotkernel.com/docs/dotkernel -structure , Consultat la 14.06.2018
[3] https://www.dotkernel.com/docs/h mvc-structure , Consultat la 14.06.2018
[4] https://www.dotkernel.com/docs/model -view -controller , Consultat la 14.06.2018
[5] http://php.net/manual/en/intro -whatis.php , Consultat la 1 5.06.2018
[6] David Sklar, “Learning PHP ”, Editura : O’Reilly Media, 2016, ISBN 978-1-4919 -3356 -5,
Consultat la 15.06.2018
[7] https://web.ceiti.md/le sson.php?id=7 , Consultat la 15.06.2018
[8] W. Jason Gilmore, “Beginning PHP and MySQL: From Novice to Professional, Fourth
Edition” , Editura: Apress, 2010, ISBN 978-1-4302 -3115 -8, Consultat la
[9] https://www.computerhope.com/jargon/h/html.htm , Consultat la 1 5.06.2018
[10] Jon Duckett , “HTML & CSS Design and build Websites” , Editura: John Wiley & Sons ,
2011, ISBN 978-1-118-00818 -8, Consultat la
[11] https://developer.mozilla.org/en -US/docs/Web/HTML , Consultat la 1 5.06.2018
[12] https://www.sitepoint.com/css -selectors , Consultat la 1 5.06.2018
[13] https://developer.mozilla.org/en -US/docs/Web/JavaScript/About_JavaScript , Consultat la
16.06.2018
[14] https://www.scribd .com/doc/98859880/Tutorial -JavaScript , Consultat la 1 6.06.2018
[15] https://techterms.com/definition/jquery , Consultat la 1 6.06.2018
[16] https://www.w3schools.com/jquery/jquery_syntax.asp , Consultat la 1 6.06.2018
[17] https://www.tutorialspoint.com/ajax/index.htm , Consultat la 1 7.06.2018
[18] https://developer.mozilla.org/en -US/docs/Learn/JavaScript/Objects/JSON , Consultat la
19.06.2018
[19] https://getbootstrap.com/docs/3.3/css , Consultat la 1 9.06.2018
[20] https://developer.mozilla.org/en -US/docs/Web/CSS/Media_Queries , Consultat la
19.06.2018
DECLARAȚIE DE AUTENTICITATE A
LUCRĂRII DE FINALIZARE A STUDIILOR
Titlul lucrării: Aplicație web pentru gestionarea ma nagementului unei biblioteci
Autorul lucrării: Bacter Răzvan – Ioan
Lucrarea de finalizare a studiilor este elaborată în vederea susținerii
examenului de finalizare a studiilor organizat de către Facultatea de Inginerie
Electrică și Tehnologia Informație i din cadrul Universității din Oradea, sesiunea
iulie a anului universitar 2017-2018.
Prin prezenta, subse mnat ul Bacter Răzvan – Ioan, CNP: 1950120055086 ,
declar pe proprie răspundere că această lucrare a fost scrisă de către mine, fără
nici un ajutor neau torizat și că nici o parte a lucrării nu conține aplicații sau studii
de caz publicate de alți autori.
Declar, de asemenea, că în lucrare nu există idei, tabele, grafice, hărți sau
alte surse folosite fără respectarea legii române și a convențiilor interna ționale
privind drepturile de autor.
Oradea,
03.07.201 8 Semnătura
Copyright Notice
© Licențiada.org respectă drepturile de proprietate intelectuală și așteaptă ca toți utilizatorii să facă același lucru. Dacă consideri că un conținut de pe site încalcă drepturile tale de autor, te rugăm să trimiți o notificare DMCA.
Acest articol: PROGRAMUL DE STUDIU TEHNOLOGIA INFORMAȚIEI FORMA DE ÎNVĂȚĂMÂNT IF PROIECT DE DIPLOM Ă COORDONATOR ȘTIINȚIFIC PROF . DR. ING. CORNELIA AURORA GYŐRÖDI… [607380] (ID: 607380)
Dacă considerați că acest conținut vă încalcă drepturile de autor, vă rugăm să depuneți o cerere pe pagina noastră Copyright Takedown.
