DOMENIUL / PROGRAMUL DE STUDIU CALCULATOARE FORMA DE ÎNVĂȚĂMÂNT ZI PROIECT DE DIPLOMĂ CONDUCĂTOR ȘTIINȚIFIC CONF. DR. ING. MIRELA PATER ABSOLVENT… [311343]

UNIVERSITATEA DIN ORADEA

FACULTATEA DE INGINERIE ELECTRICĂ ȘI

TEHNOLOGIA INFORMAȚIEI

DOMENIUL / PROGRAMUL DE STUDIU CALCULATOARE

FORMA DE ÎNVĂȚĂMÂNT ZI

PROIECT DE DIPLOMĂ

CONDUCĂTOR ȘTIINȚIFIC

CONF. DR. ING. MIRELA PATER

ABSOLVENT: [anonimizat]

2015

UNIVERSITATEA DIN ORADEA

FACULTATEA DE INGINERIE ELECTRICĂ ȘI

TEHNOLOGIA INFORMAȚIEI

DOMENIUL / PROGRAMUL DE STUDIU CALCULATOARE

FORMA DE ÎNVĂȚĂMÂNT ZI

Portal Băile Felix

CONDUCĂTOR ȘTIINȚIFIC

CONF. DR. ING. MIRELA PATER

ABSOLVENT: [anonimizat]

2015

UNIVERSITATEA DIN ORADEA

FACULTATEA de Inginerie Electrică și Tehnologia Informației

DEPARTAMENTUL CALCULATOARE ȘI TEHNOLOGIA INFORMAȚIEI

TEMA_________

Proiectul de Finalizare a studiilor a student: [anonimizat]: [anonimizat]

1). Tema proiectului de finalizare a studiilor: Portal Băile Felix

_______________________________________________________________________

2). Termenul pentru predarea proiectului: 06.07.2015

3). Elemente inițiale pentru elaborarea proiectului de finalizare a studiilor:

HTML5, CSS3, JavaScript, jQurey, SQL, PHP, Xampp, Notepad++

_______________________________________________________________________

_______________________________________________________________________

4). Conținutul proiectului de finalizare a studiilor: 1.Inrodurcere, 2.Fundamentare

teoretică, 3.Tehnologii utilizate, 4.Prezentarea aplicației, 5.Concluzii, 6.Bibliografie

_______________________________________________________________________

_______________________________________________________________________

_______________________________________________________________________

5). Material grafic: [anonimizat]

_______________________________________________________________________

_______________________________________________________________________

6). Locul de documentare pentru elaborarea proiectului: universitate, acasă,

bibliotecă

_______________________________________________________________________

_______________________________________________________________________

7). Data emiterii temei: octombrie 2014

_______________________________________________________________________

_______________________________________________________________________

Coordonatori științifici

(titlul științific și numele ),

Cuprins

Introducere

Prezentarea temei

Am ales ca temă pentru lucrarea de diplomă să creez un portal pentru Băile Felix deoarece sunt pasionat de tursim și statiunea Băile Felix reprezintă unul dintre principalele obiective turistice ale județului Bihor.

Este o temă destul de complexă care m-a [anonimizat].

Scopul acestei aplicații este în principal acela de promovare a stațiunii și de informare în legătură cu facilitațile acesteia și cu posibilitățile de cazare. Aplicația a fost creată pentru a fi ușor de utilizat și este destinată oricărui tip de utilizator.

[anonimizat].

[anonimizat] o structură și o complexitate mai mare care poate oferi o [anonimizat] o [anonimizat]-uri. [anonimizat]-uri, [anonimizat], radio online și alte opțiuni. În general structura unui portal web este compus din două elemente: „front-end” interfața cu clienții și utilizatorii și „back-end” interfața cu administrarea tuturor informațiilor oferite prin intermediul portalului.  Un portal calitativ trebuie să conțină: un meniu structurat pe mai multe nivele,  conturi de utilizatori, formulare interactive, motoare de căutare, modul de login  și alte opțiuni.  Se întâlnesc următoarele tipuri de portaluri: [21]

– Portal regional – este un portal ce reprezintă informații din anumite regiuni geografice.  Afișează starea vremii, știrile locale, anunțuri, hărți,  afaceri locale.

– Portal corporativ – este un portal intern pentru o anumită companie. Acest tip de portal poate include  soluții de management al  fluxurilor de lucru, de colaborare între grupuri, de management al relațiilor cu clienții sau alte procese. [21]

– Portal guvernamental – portal ce conține informații despre o anumită instituție guvernamentală, documente, fișe și programe pentru descărcare.

– Portal sportiv  – un portal ce conține informații despre un anumit sport sau poate fi global, conține informații despre competiții și știri sportive

– Alte portaluri specifice pentru un anumit domeniu [21]

Băile Felix

Prezentare

Stațiunea, balneo-climatică Băile Felix este situate la 6 kilometri sud de municipiul Oradea, pe raza comunei Sânmartin. Băile Felix este cea mai mare stațiune balneară permanent din țara noastră și se situează pe locul doi, dupa litoralul Mării Negre, în privința numărului de vizitatori dar și de locuri de cazare. [20]

Cu ajutorul facilităților existente în acest moment în stațiunea Băile Felix, se încearcă tratarea mai multor probleme de sănătate cum ar fi: reumatismul și afecțiunilor neurologice, ginecologice, iar bazele medicale care dispun de instalații pentru metode ca electroterapia, hidroterapia, aerosoli, masaje, împachetări cu parafină și alte operațiuni specifice tratamentelor balneare. Băile Felix permite și efectuarea unui turism de relaxare pentru turiștii din țară dar și din străinătate. [20]

Istoric

Data descoperirii izvoarelor termale din zona Băile Felix nu este una exactă. Dacă unii istorici spun că izvoarele s-au descoperit în jurul anilor 1000, 1200, alții spun că descoperirea s-a făcut în jurul anului 1700. Singurul lucru cert este apariția primelor clădiri în această stațiune între anii 1711-1721. [20]

Punerea în valoare a izvoarelor termale s-a făcut în secolul al XVIII-lea de către călugarul Felix Helcher de la mănăstirea Klosterbruck din Moravia, care a fost și administratorul unei mănăstiri din Sânmartin. Între anii 1711-1721 s-au organizat primele asezăminte pentru tratamente sub numele de „Baia lui Felix”. Felix Helcher a decedat în anul 1737.În anul 1885 a fost găsit un nou izvor termal cu o temperature de 49°C. [20]

Turism

Apa termală din bazine este între 20-49 grade Celsius. Deoarece apa are conținut ridicat de săruri minerale, medicii interniști recomandă pacienților tratamente sau cure cu apă din băi. Potențialul touristic al Felixului este unul foarte mare datorită celor peste 7000 de locuri de cazare oferite dar și datorită bazinelor de înot, ștrandurilor în aer liber sau acoperite. Datorită climei blânde, în lacurile stațiunii se gasesc nuferi subtropicali. Apa termală, principalul factor care stă la baza dezvoltarii Băilor Felix a ajutat la dezvoltarea zonei dar și la dezvoltarea sistemului de cazare de tip privat. [20]

2. Fundamentare teoretică

2.1 Baze de date

O bază de date este o colecție de date bine structurate și organizate. Principalele roluri ale bazelor de date sunt: stocarea sau memorarea datelor și organizarea sau structurarea datelor.

Bazele de date ne permit memorarea unor cantități foarte mari de date, dar și regăsirea datelor cu ajutorul unor criterii de căutare (care sunt legate intr-un mod direct de structurarea datelor), dar și prelucrarea unor volume mari de date (ordonare,agregare și filtrare).

Cel mai regasit tip de baze de date este cel relațional, unde datele sunt retinute în tabele. Pe lânga tabele, o bază de date relațională mai poate conține: indecși, proceduri stocate, declanșatori, utilizatori și grupuri de utilizatori, tipuri de date, mecanisme de securitate și de gestiune a tranzacțiilor. [27]

Bazele de date relaționale sunt un tip de baze de date în care datele, văzute ca și atribute ale entităților reale, sunt socate în tabele și sunt legate între ele prin relații, acestea reprezentând o asociere între două entități. [1]

Deoarece modul de structurare a datelor este bazat pe legăturile între date, bazele de date relaționale permit eliminarea redundanței, astfel încât stocarea și, mai ales, modificarea unei informații se face într-un singur loc, iar, din punct de vedere funcțional, această structură permite regăsirea, filtrarea, ordonarea și agregarea datelor, în mod natural. [25]

MySQL este un sistem de management al bazelor de date relaționale (RDBMS), ce nu conține interfață grafică pentru administrarea sau gestionarea datelor din bazele de date. Utilizatorii pot folosi instrumente de linie de comandă, aplicații desktop sau aplicații web cu care se pot administra și crea baze de date MySQL. [15]

În limbajul de programare PHP există funcții pentru toate operațiile care se pot executa asupra bazelor de date MySQL.

Administrarea MySQL se poate face în două moduri: din linie de comandă sau folosind browserul și accesând aplicația numită PHPMyAdmin scrisă în PHP. [18]

MySQL este componentă integrată a platformelor XAMPP. A fost lansat inițial în anul 1996, iar denumirea este dată după numele fiicei autorului și co-fondatorului Michael Widenius, My și SQL (Structured Query Language). MySQL poate fi rulat pe multe dintre platformele software existente: AIX, FreeBSD, GNU/Linux, Mac OS X, NetBSD, Solaris, SunOS, Windows 9x/NT/2000/XP/Vista. [2]

Cele mai utilizate operații cu bazele de date sunt:

[18]

Utilizatorii unei baze de date pot efectua mai multe operații asupra datelor:

Inserarea de date (insert)

Ștergerea de date (delete)

Modificarea datelor (update)

Citirea bazei de date (query) pentru a extrage anumite date

Bazele de date relaționale sunt de departe cel mai folosit tip de baze de date. Acestea au o bază teoretică solidă în algebra relațională.

2.1.1 Tipuri de date în MySQL

În limbajul MySQL întâlnim mai multe tipuri de date:

[15]

2.1.2 Crearea unei tabele în baza de date

Mai înainte de a face vreo operațiune cu baza de date, trebuie să creăm o tabelă. O tabelă reprezintă o secțiune a bazei de date pentru stocarea unor informații structurate. Într-o tabelă vom defini diferite câmpuri care vor fi folosite în acea tabelă. [15]

2.1.3 Inserarea datelor în baza de date

Înainte de a putea face o mulțime de lucruri cu baza de date trebuie să stocăm niște date în ea. Acest lucru se face de obicei cu instrucțiunea INSERT.

Fiecare linie din tabelă descrie de obicei un obiect sau o relație din lumea reală, iar valorile din coloane pentru acea linie stochează informații despre obiectul din lumea reală. [15]

2.1.4 Modificarea tabelelor

În afară de actualizarea liniilor, este posibil să se modifice și structura tabelelor din baza de date. În acest scop se folosește instrucțiunea ALTER TABLE.

Dacă este specificată clauza IGNORE și încercăm să efectuăm o modificare în urma căreia vor apărea chei primare identice, prima va fi trecută în tabela modificată, iar restul vor fi șterse. [15]

2.1.5 Ștergerea de înregistrări din baza de date

Ștergerea de linii dintr-o bază de date este o operațiune foarte simplă. Pentu această operație se folosește comanda DELETE. [15]

2.1.6 Eliminarea unor tabele din baza de date

Uneori se dorește să se șteargă o întreagă tabelă. Acest lucru se poate face cu instrucțiunea DROP TABLE.

Această instrucțiune va șterge toate liniile din tabelă și va șterge chiar și tabela, deci trebuie utilizată cu mare atenție. [15]

2.1.7 Ștergerea unei baze de date

Pentru eliminarea întregii baze de date există instrucțiunea DROP DATABASE.

Această instrucțiune va șterge toate liniile, toate tabelele, toate indexurile și baza de date, deci trebuie folosită cu multă atenție!

MySQL poate fi rulat pe multe dintre platformele software existente: AIX, FreeBSD, GNU/Linux, Mac OS X, NetBSD, Solaris, SunOS, Windows 9x/NT/2000/XP/Vista. [15]

În realizarea aplicației de față s-a folosit phpMyAdmin, reprezentând un amplu sistem de gestiune a bazelor de date relaționale MySQL.

2.2 Aplicații web

Interconectarea rețelelor de comunicație la nivelul întregului glob nu a reprezentat numai o realizare tehnică deosebită, care a impulsionat dezvoltarea puternică a industriei IT și a industriei telecomunicațiilor, ci și redefinirea conceptului de comunicare interumană. Astăzi “răsfoim” ziarele, facem cumpărături sau urmăm un curs de instruire stând comod în fața calculatorului de acasa și n-au trecut decât 20 de ani de când aceste lucruri existau doar în literatura științifico-fantastică. [19]

Cel mai popular serviciu oferit de rețeaua Internet este, fără îndoială, spațiul World Wide Web (WWW sau 3W), o uriașă rețea de informații care permite stocarea și accesarea documentelor hipertext, utilizând protocolul de transfer al fișierelor hipertext (HyperText Transfer Protocol). [19]

12 septembrie 1990 este considerată ziua oficială de naștere a spațiului WWW, odată cu apariția primei aplicații grafice capabile să acceseze documentele hipertext. [19]

Primul navigator ce permitea afișarea elementelor grafice a fost NCSA Mosaic, urmat la scurtă vreme de celebrul Netscape Navigator. Odată cu mărirea exponențială a numărului de servere din spațiul WWW și cu orientarea software-ului către aplicațiile cu interfață grafică, au fost dezvoltate numeroase navigatoare. În momentul de față, cele mai utilizate navigatoare sunt: Google Chrome, Mozilla FireFox, Internet Explorer și Opera. [19]

Web-ul nu ar trebuie să fie confundat cu Internetul. Web-ul este doar o colecție uriașă de informație interdependentă, distribuită în calculatoare gazdă din întreaga lume, care formează un sistem standardizat global de distribuție a informațiilor hipermedia. [19]

Web-ul beneficiază de infrastructura rețelei Internet, de conceptele si protocoalele de transmitere a datelor care fac Internetul să funcționeze: modelul client-server și familia de protocoale TCP/IP. [19]

Întreaga istorie a spațiului WWW este strâns legată de evoluția conceptului de hypertext de la stadiul de simplă tipăritură electonică care diferită prea puțin de tipăriturile clasice, la stadiul de hipermedia, cel care permite înglobarea în cadrul unui document a mai multor medii de stocare și transmitere a informației. [19]

Navigatorul (browserul) este o aplicație cu ajutorul căreia traversarea unui sistem hypertext sau hypermedia este posibilă. Navigatorul este o aplicație client, care executată de pe un calculator personal, negociază transferal datelor cu aplicația de tip server, care se execută pe un calculator gazdă (host).

Documentul hipermedia este din punct de vedere practic un ansamblu compus din:

Fișiere text, ce conțin informația de tip text a documentului precum și informațiile privind scopul, structura documentului și informații de legătură cu fișierele multimedia. Se utilizează un sistem de marcare, asemănător sistemului folosit în tipografii, numit limbajul HTML – Hypertext Markup Language. [19]

Fișiere ce conțin imagini statice, sunete, video sau aplicații. Memorarea datelor este realizată în funcție de tipul mediului folosit, existând diverse formate de stocare gratuite sau proprietare. Ca și exemple putem aminti formatele cele mai populare pentru memorarea graficii precum JPEG, GIF și PNG, iar pentru sunet WAV, MP3, VMA, MIDI. Limbajele de marcare nu sunt limbaje de programare în sensul uzual, deci nu utilizează formulări imperative – instrucțiuni – în stocarea și accesarea informației. Limbajele de marcare utilizează etichete (labels) sau marcaje (tags), care definesc:

structura unui document, prin delimitarea secțiunilor documentului și a relațiilor

dintre acestea;

modul de prezentare a secțiunilor documentului. [19]

O aplicație web este un program care rulează într-un browser web și este creata într-un limbaj de programare interpretabil de către browser (cum ar fi o combinație de JavaScript, HTML și CSS), și se bazează pe un browser web pentru interacțiune. Aplicațiile Web sunt populare din cauza omniprezenței browserelor web și comoditatea de a folosi un browser web ca și client. Capacitatea de a actualiza și menține aplicații web fără distribuirea și instalarea software-ului pe potențial de mii de calculatoare client este un motiv cheie pentru popularitatea lor. O alta mare calitate a aplicaților web o reprezinta faptul ca sunt imune la schimbarea sistemelor de operare (Windows/Linux/Machintos, etc.). Aplicații web comune includ webmail, vânzare on-line cu amănuntul, licitații online, wiki-uri și multe alte funcții. Aplicațiile web sunt disponibile oricând, 24/7 de la orice terminal conectat la internet, oferind astfel o accesibilitate de ne-egalat. [22]

Un exemplu de aplicatie online este webmailul sau de ce nu, programul de facturare, CMS-ul, sau aplicatia de Newsletter. [23]

Prin intermediul unei aplicatii online se pot stoca, gestiona, modifica, trimite, primi si procesa informatia folosind conectivitatea internerului, folosind mai multi utilizatori, mai multe statii de lucru si mai multe procese in acelasi timp. Deoarecere aplicatia este bazata pe internet nu exista incompatibilitati hardware, virusi, aplicatia si informatia fiind stocate pe un server securizat. [23]

3. Tehnologii utilizate

3.1 HTML5

HTML5 este un limbaj pentru structurarea și prezentarea conținutului pentru World Wide Web, fiind cea de-a 5-a revizuire a limbajului HTML(creat in 1990 și standardizat în 1997 ca HTML4) și este în curs de dezvoltare încă din octombrie 2011. [26]

Ceea ce cunoaștem astăzi sub numele de HTML5: un ansamblu de tehnologii care constituie web-ul modern si fac posibile crearea de conținuturi multimedia, animații și aplicații tot mai sofisticate. Pentru cei mai neinițiați, acest termen reprezintă tot ceea ce se poate face cu tehnologiile web moderne, chiar dacă uneori “trucul” respectiv se datorează mai mult CSS3, de exemplu. [28]

Standardul HTML5 a fost publicat de către W3C ca Working Draft în anul 2008, un nou stadiu de „Recomandare W3C” fiind așteptat în anul 2014. WHATWG continuă să lucreze la HTML, dar renunță la versionare. În acest mod, specificațiile pentru HTML sunt considerate un „standard viu”, limbajul HTML5 rămânând doar un instantaneu al evoluției sale.[28]

Creatorii standardului și-au propus să păstreze lucrurile cât mai simple cu putință, ușurând munca dezvoltatorilor: [28]

un document HTML5, pentru a putea fi valid are nevoie de un doctype foarte simplificat față de HTML 4 sau chiar XHTML (<!DOCTYPE html>)

unele atribute acum nu mai sunt obligatorii, simplificând și mai mult codul necesar, de exemplu, type pentru <script> sau <link rel="stylesheet">

de asemenea au fost adoptate și unele elemente noi urmărind practicile uzuale precum <header>, <footer>, <nav>

regulile de conformitate nu mai sunt atât de stricte, autorii fiind mai liberi, putând chiar să omită împrejmuirea atributelor cu ghilimele, de exemplu (atâta vreme cât acestea nu conțin spații).[28]

HTML5 a fost conceput pentru a fi compatibil și cu versiunile anterioare, ca urmare, orice document care este valid pentru HTML 4 sau XHTML este valid și pentru HTML5, atâta timp cât folosește doctype-ul nou. Acest lucru este convenabil deoarece înseamnă că nu trebuie să o luăm de la capăt și să uităm tot ce știm despre HTML.

3.1.1 Nivelul de suport

HTML5 nu este implementat de niciun browser în totalitate deoarece nu este finalizat nici ca instantaneu. Chiar și în aceste condiții, toate browserele moderne oferă suport pentru anumite funcționalități și chiar dacă implementările diferă câteodată, multe pot fi folosite chiar și astăzi. Site-uri precum Modernizr, care este o bibliotecă JavaScript, detectează funcționalitățile HTML5 și CSS3 suportate de browserul vizitatorului, oferind astfel dezvoltatorului posibilitatea de a furniza soluții de rezervă  în cazurile în care suportul lipsește. [28]

3.1.2 Structură și semantică

Odată cu apariția CSS-ului rolul HTML a fost limitat la a defini structura unui document, nu și aspectul său vizual. HTML5 pune și mai mult accent pe semantică, introducând noi elemente care dau posibilitatea autorilor de a defini mai specific părți ale documentului. În acest fel, el va putea fi înțeles și procesat mai bine de către terți, ca motoarele de căutare sau programele care asistă persoanele cu lipsuri de vedere.[28]

3.1.3 Aplicații cache offline

Aplicațiile HTML5 pot fi pornite pentru a rula offline. HTML5 oferă funcția de stocare offline, numit un cache al cererii pentru stocarea de fișiere. Deci, dacă utilizatorul este offline, browser-ul încă mai are acces la fișierele necesare. Acesta poate fi HTML, CSS, Javascript, sau oricare alte resurse necesare pentru a vizualiza pagina de web. [3]

3.1.4 Drag and Drop

HTML5 include o funcție Drag and Drop, care permite dezvoltarea de aplicații interactive. Cu Drag & Drop avem posibilitatea să mutăm orice element în locul dorit. [3]

3.1.5 Geolocation

Geolocation API în HTML5, ne permite să partajam locația cu site-uri de încredere, confidențialitatea fiind importantă în funcția de geolocalizare. Browser-ele nu au nevoie să trimită informații despre locație la site-uri web, fără permisiunea utilizatorului. Browser-ul va cere permisiunea, dacă utilizatorul dorește să împărtășească locația lui, iar dacă utilizatorul consimte, Firefox va aduna informații despre punctele de acces fără fir din apropiere și adresa IP a computerului vizitatorilor și va trimite aceste informații în Google Location Services, care este un serviciu de geolocalizare Firefox implicit, altfel, nu va împărtăși locația. [3]

3.1.6 Audio și video

În prezent, există facilități HTML necesare pentru punerea în aplicare a fișierelor multimedia. De aceea, fișierele media se includ în HTML folosind diferite plugin-uri, dar cu HTML5, acest lucru poate fi făcut foarte ușor, cu ajutorul elementelor audio și video, fără utilizarea de plugin-uri. [3]

3.1.7 Formulare de introducere

HTML5 introduce multe elemente noi de intrare, cum ar fi selectoare de culori, pop-up calendare și multe altele. Cu aceste funcții de intrare se poate crea o formă eficientă, cu un control mai bun al intrării și verificării. [3]

Toate aceste funcții fiind utile în realizarea aplicației web. La realizarea aplicației web, am utilizat numeroase elemente HTML cu scopul de a realiza o interfață cât mai aspectuoasa, elemente pentru editarea și structurarea formei, mărimii și culorilor de text. Pentru marcarea unor titluri și subtitluri, existente în codul HTML, am utilizat etichetele <h1>,<h2>,<h3>, grosimea fontului am stabilit-o utilizând eticheta <strong>, însă pentru a da textului culoare, mărime, sau un tip de font, am folosit stiluri CSS .

3.2 CSS3

CSS este un acronim, acesta provenind de la Cascading Style Sheets, iar CSS3 este cel mai nou standard CSS. Acesta a fost împărțit în “module”. Specificațiile vechi au fost separate în părți mai mici, iar noile specificații au fost de asemenea adaugate. [4]

Cele mai importante module CSS3 sunt:

Selectoarele (Selectors)

Model casetă (Box Model)

Fundaluri și Borduri (Backgrounds and Borders)

Efecte Text (Text Effects)

Transformări 2D/3D (2D/3D Transformations)

Animații (Animations)

Aspect Multi-Coloană (Multiple Column Layout)

Interfața Utilizator (User Interface) [5]

Deși au apărut unele deficiente de compatibilitate intre browsere, majoritatea proprietăților CSS3 au fost implementate cu succes in variantele browserelor noi.

Avantajele CSS:
– controlul layoutului documentelor dintr-o singura pagina de stiluri,
– controlul mai exact al layoutului,
– aplicare de layouturi diferite pentru tipuri media diferite (ecran, printare, etc),
– tehnici numeroase si sofisticate. [5]

Un lucru foarte important de știut înainte de a începe utilizarea acestor proprietăți, este faptul că nu toate browser-ele web suportă aceste stiluri, iar de cele mai multe ori, vom fi nevoiți să apelăm la prefixarea acestora, în funcție de suportul în diferite browsere.

Prefixele pe care le vom apela în funcție de browser sunt:

-webkit- Specific browser-elor Webkit (Google Chrome, Safari și, în curând, Opera);

-moz-  Specific browser-ului Mozilla Firefox;

-ms- Specific browser-ului Internet Explorer;

-o- Specific browser-ului Opera. [6]

CSS (Cascading Style Sheets), în traducere "foi de stil în cascadă" se ocupă în general cu aspectul și controlul grafic al elementelor din pagină, cum ar fi: textul, imaginile, fondul, culorile și așezarea acestora în cadrul ferestrei paginii. CSS folosește stiluri, acestea înglobează, sub un anumit nume, atribute de formatare care se aplică asupra unui element individual din pagină, asupra unui grup de elemente sau la nivelul întregului document.
Funcționează cu HTML, însă nu este HTML. El extinde funcționalitățile HTML, permițând redefinirea etichetelor HTML existente.

Un dezavantaj ar fi că unele browsere web nu sunt compatibile cu CSS, astfel că documentele HTML sunt afișate ca și cum CSS n-ar exista, dar cele mai cunoscute și utilizate browsere, cum ar fi: Mozilla Firefox, Google Chrome, Opera, și altele, sunt compatibile CSS. [7]

În cazul aplicației realizate, am folosit un fișier inclus extern cu extensia .css, acest lucru a reprezentat un element important în facilitatea muncii, folosind proprietăți pentru toate elementele din cadrul aplicației într-un singur fișier. Am folosit elemente CSS pentru stilizarea conținutului, cum ar fi: width (determinarea lungimii elementelor HTML), heigth (determinarea lățimii elementelor HTML), margin: 0 auto (pentru centrarea elementelor în mijlocul div-ului din care fac parte acestea) dar și margin-left/right, margin-top/bottom, padding-left/right, padding-top/bottom la toate acestea atribuindu-le valori în em (unitate de măsură recomandată de W3C).

3.3 SQL

Limbajul SQL (Structured Query Language) este în prezent unul din cele mai puternice limbaje structurate pentru interogarea bazelor de date relaționale. Este un limbaj neprocedural și declarativ deoarece utilizatorul descrie ce date vrea să obțină, fără a fi nevoie să stabilească modalitățile de a ajunge la datele respective. [8]

Este un limbaj de programare specific manipulării datelor în sistemele de manipulare a bazelor de date relaționale (RDBMS). La origine este un limbaj bazat pe algebra relațională. Acesta are ca scop inserarea datelor, interogații, actualizare și ștergere, modificarea și crearea schemelor, precum și controlul accesului la date. [8]

Instrucțiunile SQL pot fi grupate în:

instrucțiuni de definire a datelor, care permit descrierea structurii BD

instrucțiuni de manipulatea datelor: adaugă, șterge, modifică înregistrări

instrucțiuni de selecție a datelor, care permit consultarea BD

instrucțiuni de procesarea tranzacțiilor

instrucțiuni de control al cursorului

instrucțiuni pivind controlul accesului la date

A devenit un standard în domeniu (standardizat ANSI- ISO), fiind cel mai popular limbaj utilizat pentru crearea, modificarea, regăsirea și manipularea datelor de către sistemele de gestiune a bazelor de date relaționale. Pe lângă versiunile standardizate ale limbajului, există o mulțime de dialecte și variante, astfel sistemele de gestiune a bazelor de date sunt prevăzute cu diverse extensii. [8]

SQL permite atât accesul la conținutul bazelor de date, cât și la structura acestora.

Există 3 metode de bază privind implementarea limbajului SQL:

Apelare directă (Direct Invocation): instrucțiunile sunt introduse direct de la prompter

Modulară (Modul Language): folosește proceduri apelate de programele aplicației

Incapsulată (Embedded SQL): conține instrucțiuni încapsulate în codul de program

La aplicația realizată am folosit atât metoda încapsulată de apelare a instrucțiunilor SQL pentru manipularea datelor, cât și apelarea directă pentru executarea instrucțiunilor de creare a bazei de date împreună cu constrângerile definite pentru aceasta.

3.4 JavaScript

JavaScript este un limbaj de programare orientat pe obiecte bazându-se pe conceptul prototipurilor. Este folosit mai ales pentru introducerea unor funcționalități în paginile web, codul Javascript din aceste pagini fiind rulat de către browser. [9]

Limbajul este binecunoscut pentru folosirea sa în construirea paginilor de internet, fiind folosit și pentru accesul la obiecte încadrate (embedded objects) în alte aplicații. A fost dezvoltat inițial de către Brendan Eich de la Netscape Communications Corporation sub numele de Mocha, apoi LiveScript, și denumit în final JavaScript. [9]

Pentru a insera JavaScript într-un document HTML deja existent, este necesară introducerea în fișier a etichetelor <script> și </script> . Această etichetă necesită aributul " type ", sau atributul " language " ( acesta d in urmă este depreciat î n standardul XHTML) care va specifica browserului limbajul folosit pentru interpretarea codului inclus.

JavaScript organizează toate elementele unei pagini web într-o ierarhie. Toate elementele sunt văzute ca obiecte, și fiecare obiect are anumite proprietăți și metode. Cu JavaScript putem manipula ușor obiectele.Pentru aceasta, este importantă întelegerea ierarhiei obiectelor HTML.JavaScript intelege fereastra browser-ului ca pe un obiect “window”;acesta conține anumite elemente, cum ar fi de exemplu “bara de stare”.În fereastra browser-ului, putem încărca/afișa un document HTML.Pagina din interiorul browser-ului este un obiect document. [10]

Chiar dacă se aseamănă din punct de vedere al sintaxei și al numelui, în afara unor similarității, între JavaScript și limbajul Java nu există nici o legătură. Asemeni Java, JavaScript are o sintaxă asemănătoare cu cea a limbajului C, dar are mai multe lucruri în comun cu limbajul Self decât cu Java. [10]

JavaScript se folosește pentru scriptarea paginilor HTML, adică introducerea unor scripturi, cum ar fi: verificarea datelor introduse de utilizator, efecte de animație etc. [10]

La realizarea acestei aplicații am folosit JavaScript pentru slideshow-ul care este poziționat sub meniu și la calendarul de pe prima pagina, atât în mod utilizator cât și pentru administrator.

3.5 JQuery

jQuery este o librărie Javascript ca și mootools, prototype, script.aculo.us etc.

jQuery e centrat pe lucrul si manipularea elementelor HTML si CSS in pagina web. Are de asemenea utilitati Ajax pentru transmitere de date la server, functii pt. lucru cu obiecte, array si evenimente.

Aproape toate scripturile facute cu jQuery functioneaza la fel in principalele navigatoare web.

Includere jQuery

Ca să lucrați cu jQuery trebuie mai intâi să includeti librăria de funcții jQuery în pagina HTML, ca orice fișier cu cod JavaScript.

Puteți găsi și descărca ultima versiune de la pagina http://jquery.com/. Salvați librăria jQuery pe server, într-un fișier cu extensia ".js", apoi includeți-l în documentul HTML, folosind următoarea sintaxă (in sectiunea HEAD): <script type="text/javascript" src="jquery_file.js"></script>

Sau, în loc de a avea fișierul cu jQuery pe serverul dumneavoastră, o metodă alternativă de a include librăria jQuery este prin Google:

<scripttype="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> [11]

jQuery are o documentație bine elaborată, bine structurată și ușor de înțeles, așa încât să se poată introduce repede cod pe pagina de web. În plus, are o promovare foarte mare, unde se pot găsi tutoriale, cod gata făcut, plugin-uri, la tot pasul.

jQuery se poate folosi pentru a rezolva numeroase probleme specifice programării web din care amintim următoarele:

– selecții de elemente în arborele DOM folosind propriul motor de selecții open source Sizzle, un proiect născut din jQuery

– parcurgere și modificarea arborelui DOM (incluzând suport pentru selectori CSS 3 și XPath simpli)

– înregistrarea și modificarea evenimentelor din browser

– manipularea elementelor CSS

– efecte și animații

– cereri tip AJAX

– extensii

– utilităti – versiunea browser-ului, funcția each. [12]

Extensii

Unele dintre cele mai interesante aspecte ale jQuery sunt plugin-urile sau extensiile. Datorită arhitecturii jQuery programatorii au posibilitatea de a dezvolta subaplicații bazate în biblioteca principală care extind funcțiile principale jQuery cu funcții specifice plugin-urilor. Datorită acestui lucru biblioteca principală poate ocupa un spatiu foarte mic, iar extensiile necesare la anumite pagini web pot fi încărcate la cerere, doar în cazul în care este nevoie de ele. jQuery oferă utilizatorilor un set de extensii de bază pentru interactivitate, mai multe efecte dar și mai complexe decât cele din biblioteca de bază dar și teme de culori. Principalul avantaj al jQuery fată de alte extensii este acela că dezvoltarea dar și testarea acestor componente se face în paralel cu dezvoltarea bibliotecii principale, astfel minimizându-se riscul de incompatibilitate.

Orice programator poate crea o extensie și jQuery oferă publicare în catalogul de pe pagina proiectului în diversele categorii disponibile. [12]

De preferat ar fi să se descarce scriptul și să fie amplasat pe server pentru a evita anumite complicații sau alte neclarități. Link-urile de mai sus reprezintă calea către ultima versiune a librăriei.

3.6 PHP

PHP este limbajul de programare ideal pentru construirea de pagini web dinamice, fiind ușor de învățat, software liber, oferă posibilitatea conectării la mai multe tipuri de baze de date și poate fi rulat pe mai multe platforme. Cel mai important aspect al acestui limbaj este însă posibilitatea de a fi combinat cu cod HTML. Astfel putem crea pagini HTML statice și din loc în loc, acolo unde avem nevoie, să introducem dinamism cu ajutorul PHP. [13]

Limbajul PHP a aparut în 1994, din nevoia lui Rasmus Lerdorf de a afla de câte persoane îi este vizitat CV-ul online. El a denumit setul de scripturi create PHP, acronimul pentru Personal Home Page, dar în următorii trei ani limbajul a evoluat, iar adevăratul succes a început să îl cunoască de când Zeev Suraski și Andi Gutmans au rescris motorul PHP de la cap la coadă, motor care poartă din versiunea 4 a PHP-ului numele Zend. [13]

Fiind open-source, PHP beneficiază de un suport activ din partea comunității online, acesta fiind probabil și motivul creșterii explozive a numărului site-urilor bazate pe PHP. [13]

Interpretorul PHP este cel mai cunoscut limbaj de scripting folosit în acest moment pentru crearea site-urilor Web interactive. Denumirea este un "acronim recursiv" pentru Hypertext PreProcessor. Diferența esențială față de alte limbaje de scripting (gen JavaScript) este faptul că PHP este un interpretor server-side Pentru a putea testa pagini PHP aveți nevoie de un server de web (Apache) și de pachetul PHP instalat. [13]

Popularitatea de care se bucură acest limbaj de programare se datorează următoarelor caracteristici :

Familiaritatea

Simplitatea

Eficiența

Securitatea

Flexibilitatea

Gratuitatea

Dezvoltarea PHP-ului sub licența open-source a determinat adaptarea rapidă a PHP-ului la nevoile web-ului, eficientizarea și securizarea codului. [14]

Când accesăm o pagină HTML serverul care o găzduiește trimite pagina HTML către browser spre afișare. În cazul unei pagini PHP serverul citește codul PHP, îl interpretează și generează dinamic pagina HTML care este trimisă browserului spre afișare. Acesta este motivul pentru care unii utilizatori folosesc PHP și pentru construirea unor pagini cu conținut dinamic. [10]

Fișierele PHP au extensia php. Fișierele pot fi scrise cu orice editor de texte. Este preferat Notepad++ datorită faptului că pune în evidență sintaxa limbajului. Există și editoare ce oferă mai multe facilități (help interactiv, apel debugger, etc) cum ar fi eclipse php sau cele oferite de Zend. Când PHP – ul parcurge un fișier de fapt "citește" textul până când întâlnește una din etichetele speciale care-i spun să înceapă să interpreteze textul ca pe cod PHP. Se executată codul până când este întâlnită eticheta de închidere. Apoi se "citește" din nou textul mai departe. Acesta este motivul pentru care se poate adaugă cod PHP în interiorul HTML-ului. [10]

Câteva reguli de sintaxă:

– închiderea unui rând se face obligatoriu cu caracterul“;”

– numele funcțiilor NU sunt Case Sensitive (nu se face diferență între utilizarea literelor mari sau mici)

– numele variabilelor SUNT Case Sensitive (se face diferență între utilizarea literelor mari sau mici).

Codul PHP este delimitat de unul din urmatoarele seturi de etichete de deschidere și închidere:<?php ?> etichete recomandate <script language="php"?> </script> [10]

3.7 XAMPP

Este cel mai popular mediu de dezvoltare PHP, o distribuție Apache, total gratuit, ușor de instalat și conține MySQL, PHP și Perl. XAMPP a fost creat pentru a fi ușor de instalat și folosit, fiind configurat cu toate facilitătile active. În present există distribuții pentru Windows, Linux și OS X. [16]

XAMPP este o compilație gratuită de "software" (comparabilă cu o distribuție de Linux), este gratuit și este permisă copierea în conformitate cu termenii GNU General Public Licence. Dar numai compilația XAMPP este publicată sub licenta GPL. [16]

Instalarea XAMPP:

De la adresa http://www.apachefriends.org/en/xampp-windows.html, se descarcă pachetul xampp-win32-1.6.6a.exe (executabil 7Zip). Se dezarhivează intr-un director.

In cazul nostru, am despachetat conținutul in 'D:\Program Files', unde vom găsi directorul XAMPP (D:\Program Files\XAMPP). Apoi,deschidem directorul XAMPP și rulăm fișierul 'setup-xampp.bat'.

Toate căile din configurație vor fi reactualizate automat.De acum, trebuie doar să pornim serverele Apache și MySQL.Acest lucru se face din Panoul de Control XAMPP. Acesta poate fi apelat ruland D:\Program Files\XAMPP\xampp-control.exe

Figura 3.1

Securitatea în XAMPP:

XAMPP nu a fost intenționat pentru producție, ci doar pentru dezvoltare, pentru a crea un mediu care să faciliteze dezvoltarea. XAMPP este, in mod implicit, configurat să fie cat mai deschis și mai putin restrictiv posibil, să permită dezvoltatorului să facă orice are nevoie.

O listă cu câteva dintre lipsurile de securitate ale XAMPP:

● Administratorul MySQL (root) nu are parolă

● Daemonul MySQL este accesibil prin rețea

● phpMyAdmin este accesibil prin rețea

● Exemplele sunt accesibile prin rețea

● Userii pentru Mercury (serverul de mail) si FileZilla (serverul de FTP) sunt cunoscuți

Este recomandată securizarea XAMPP inainte de a publica orice online. Un firewall sau un router extern nu sunt de ajuns, ci doar furnizează un nivel scăzut de securitate. Pentru mai multă securitate, se poate rula Consola de Securitate XAMPP, si acolo se pot asocia parole.[17]

Cu acest program mi-am pornit serverul Apache de care dispune, pentru a putea vedea modificările și funcționarea site-ului, și MySQL pentru lucrul cu baza de date.

3.8 Notepad++

Notepad++ este un editor de text oferit gratuit de către Microsoft Windows și care este găzduit la Sourceforge. Acest editor de text permite editarea codului sursă specific mai multor limbaje de programare cum ar fi: C, C++, Pascal, C#, HTML, PHP.

Principalele facilități ale acestui editor sunt:

Colorare sintactică pentru 48 de limbaje de programare ( care se pot modifica de către utilizator);

Posibilitatea tipăriri color a codului sursă (WYSIWYG);

Autocompletare = deducerea și întregirea automată a cuvântului de cod din biblioteca utilizată;

Interfață cu mai multe ferestre (utilizează tab-uri);

Suport pentru căutări/înlocuiri cu expresii regulate PERL;

Suport pentru macroinstrucțiuni. [24]

Editorul de text Notepad++ se bazează pe motorul Scintilla, și este programat în C++ și utilizând Win32 API și biblioteca STL, astfel se asigură un timp de execuție rapid dar și un consum redus de resurse.

Cu acest program mi-am creat aplicația.Tot codul html, html5, css3, JavaScript, jQuery și PHP le-am scris în acest editor.

4. Prezentarea aplicației

4.1 Structura website-ului

Aplicația web realizată se adresează oricarui tip de utilizator avand un meniu simplu, o interfață usor de folosit și nu abundă în informații. Este o aplicație utilă atât pentru localnici care doresc să fie la curent cu cele mai noi știri cât și pentru turiștii care vor să afle mai multe despre stațiune, obiective turistice, ștranduri, tratamente sau care doresc să se cazeze la hoteluri, pensiuni sau vile.

Conține atât informații generale despre stațiune cât și informații mai complexe cu privire la obiectivele turistice, hoteluri, pensiuni, vile, ștanduri, prețuri, dotari șa.

Scopul implementării acestui site este promovarea stațiunii Băile Felix. Este un site cu caracter informativ dar care oferă și posibilitatea cazării la hoteluri, pensiuni, sau vile.

Site-ul conține atât partea de front-end care reprezintă interfața pentru utilizatori cât și o parte de back-end pentru managementul conținutului, interfața pentru administratori. Structura webstite-ului este aproximativ aceeași atât pentru utilizatori cât și pentru administrator. Administratorii au și posibilitatea logării. În momentul în care sunt logați aceștia vor avea și posibilitatea inserării, ștergerii si actualizării informațiilor pe pagini.

Figura 4.1 Harta site-ului

4.2 Administrarea aplicației

Administrarea este un aspect important pentru o aplicație web și a fost implementată în cadrul aplicației doar pentru administratori, doar acestia au posibilitatea modificării conținutului paginilor cu condiția să fie logați. Cu toate că această aplicație este concepută în principal pentru prezentare și informare, partea de administrare poate fi benefică deoarece o aplicație web actualizată poate convinge vizitatorii și să le confere încredere.

Un alt motiv care încurajează administrarea este acela că internetul este un mediu în permanentă schimbare. Astfel pentru a menține vizitatorii interesați este nevoie de actualizarea textului, fotografiilor, evenimentelor și a ofertelor. Acest lucru se poate realiza și în aplicația mea după cum a fost menționat anterior, din interiorul site-ului, de către administratori dar și prin modificarea sau adăugarea în baza de date și în codul sursă.

Deoarece principalul scop al unui portal este acela de a informa utilizatorii cu privire la noutațile care apar în viața de zi cu zi, administrarea acestui portal trebuie să se facă zilnic. Administratorul website-ului administrează paginile statice dar și cele dinamice de pe acest site. Paginile dinamice sunt mult mai ușor de administrat deoarece sunt actualizate din baza de date. Acest site a fost realizat în mare parte din pagini dinamice pentru ca administararea lui să se facă mai repede.

4.3 Baza de date

Aplicația web utilizează o baza de date creată cu ajutorul sistemului de gestiune a datelor phpMyAdmin versiunea 3.2.1. Numele bazei de date este „turism” și conține 14 tabele, baza de date fiind ilustrată în Figura 4.2

În figura 4.2 sunt doar enumerate tabelele incluse în baza de date sub forma unei liste ordonate în ordine alfabetică, ordinea default din phpMyAdmin. Acest mod de vizualizare a bazei de date se face dând click pe numele bazei de date dorite aflate în partea dreaptă pe pagina principală a phpMyAdmin. Având selectată baza de date dorită putem vizualiza atât structura cât și înregistrările tabelelor conținute și putem efectua o serie de operații pe acestea.

Figura 4.2 Baza de date a aplicației web

Baza de date este structurată în 14 tabele iar legăturile sunt reprezentate cu ajutorul secțiunii Designer din phpMyAdmin. În figura 4.3 se poate observa structura tabelară a bazei de date precum și câmpurile celor 14 tabele.

Figura 4.3 Structura tabelelor și legăturile dintre acestea

Din cele 14 tabele, 3 tabele sunt independente, nu au legături cu alte tabele din baza de date. Aceste tabele sunt galerie, admini și știri. Am să încep descrierea tabelelor din baza de date cu acestea.

Tabelul de admini conține 3 câmpuri id_admin, user și parola. Câmpul id_admin conține codul unic al aministratorilor în timp ce câmpurile user și parolă conțin numele aministatorului respectiv parola cu care se autentifică pe site.

Câmpurile user și parola sunt obligatorii la autentificare, dacă unul dintre acestea nu este completat se va afișa mesajul „Nu ați completat câmpurile obligatorii” iar dacă ambele câmpuri sunt completate, se verifică dacă user-ul și parola sunt valide. În cazul în care sunt valide, pe fiecare pagină vor fi afișate și câmpurile pentru administratori iar în cazul în care nu sunt valide se va afișa mesajul „Nu sunteți admin”. În figura 4.4 este prezentată structura acestui tabel.

Figura 4.4 Structura tabelei de admini

În figura 4.5 este prezentat conținutul tabelului de admini care deocamdată conține doar o înregistrare.

Figura 4.5 Conținutul tabelei admini

Tabelul știri conține de asemenea 3 câmpuri id, titlu și descriere. Titlu conține tipul informației afișate știri, evenimente sau tratamente în timp ce descrierea conține textul integral.În momentul de fața în tabel sunt 6 înregistrări care corespund celor 6 pagini. În figura 4.6 este prezentată structura acestui tabel.

Figura 4.6 Structura tabelei știri

În figura 4.7 este prezentat conținutul tabelului de știri care conține 6 înregistrări la care pot fi adăugate unele noi și din cadrul aplicației.

Figura 4.7 Conținutul tabelei știri

Tabelul galerie este alcătuit din id-ul pozei care reprezintă numărul de ordine din interiorul galeriei foto, numele pozei și calea pozei care reprezintă locația acesteia pe hard-disk. În figura 4.8 este prezentată structura acestui table și în figura 4.9 o parte din conținut.

Figura 4.8 Structura tabelei galerie

Figura 4.9 Conținutul tabelei galerie

Continuăm cu descrierea tabelelor care au legături între ele și sunt puțin mai complicat de gestionat decât cele independente.

Tabelele ștranduri și poze_ștranduri sunt legate prin foreign_key-ul ștrand_id după cum se poate observa în figura 4.3, astfel fiecărei poze îi corespunde id-ul ștrandului de care aparține. Tabelul ștranduri conține de asemena câmpurile nume_ștrand,descriere_scurtă, descriere_ștrand care este o descriere mai detaliată a ștrandului, tarife, dotări precum și orar-ul. Tabelul poze_ștranduri, asemeni tabelei galerie, conține un câmp cu numărul de ordine a pozei reprezentat de id_poză_ștrand și câmpul cale_poză care coține locația acesteia pe hard-disk. Tabelul poze_ștranduri mai conține și câmpul poză_principală care este ”1” dacă aceasta va fi poza care va apărea pe pagina principală și ”0” dacă va fi considerată poză secundară și va apărea doar pe pagina de detalii. Doar o poză principală se poate atribui fiecărui ștrand. În figurile 4.10 și 4.12 sunt prezentate structurile acestor tabele iar în figurile 4.11 respectiv 4.13 o parte din conținuturi.

Figura 4.10 Structura tabelei ștranduri

Figura 4.11 Conținutul tabelei ștranduri

Figura 4.12 Structura tabelei poze_ștranduri

Figura 4.13 Conținutul tabelei poze_ștranduri

Tabelele obiective și poze_obiective sunt legate prin foreign_key-ul obiectiv_id după cum se poate observa în figura 4.3, astfel fiecărei poze îi corespunde id-ul obiectivului de care aparține. Tabelul obiective conține de asemena câmpurile nume_obiective și descriere. Tabelul poze_obiective, asemeni tabelei galerie, conține un câmp cu numărul de ordine a pozei reprezentat de id și câmpul cale_poză care coține locația acesteia pe hard-disk. Tabelul poze_obiective mai conține și câmpul poză_principală care este ”1” dacă aceasta va fi poza care va apărea pe pagina principală. În figurile 4.14 și 4.16 sunt prezentate structurile acestor tabele iar în figurile 4.15 respectiv 4.17 o parte din conținuturi.

Figura 4.14 Structura tabelei obiective

Figura 4.15 Conținutul tabelei obiective

Figura 4.16 Structura tabelei poze_obiective

Figura 4.17 Conținutul tabelei poze_obiective

În cele ce urmează vom continua cu prezentarea tabelelor care sunt folosite pentru realizarea funcției de cazare la hoteluri, pensiuni sau vile.

Deoarece avem 3 tipuri de cazări am creat un tabel cu acestea intitulat tip_cazare în care fiecărui tip de cazare îi corespunde un id unic. Acest lucru se poate observa foarte bine și în următoarele 2 figuri, figura 4.18 cu structura tabelei și figura 4.19 în care este afișat conținutul.

Figura 4.18 Structura tabelei tip_cazare

Figura 4.19 Conținutul tabelei tip_cazare

Tabelul în care sunt reținute informațiile despre hoteluri, pensiuni și vile se numește cazare. Acesta are structura din figura 4.20.

Figura 4.20 Structura tabelei cazare

Fiecare hotel, pensiune sau vilă are un id unic care este auto_increment și un tip_cazare_id care reprezintă tipul cazării și care este totodată și foreign_key-ul care face legătura cu tabelul tip_cazare după cum se vede și în figura 4.3. Restul câmpurilor din tabel țin de descriere: nume, descriere_scurtă afișată pe pagina de cazare, descriere, care conține descrierea mai detaliată și care este afișată pe pagina de rezervări, coloana dotări în care sunt prezentate dotările camerelor, coloana structură în care sunt prezentate tipurile de camere diponibile (de exemplu camere de 1, 2 sau 3 persoane) precum și prețul pe noapte și nu în ultimul rând coloana nr_max_camere în care se salvează capacitatea maximă a fiecărui hotel, pensiune sau vile.

În figura 4.21 se prezintă conținutul tabelei de cazare pentru a fi mai ușor de înțeles.

Figura 4.21 Conținutul tabelei cazare

Tabelul poze conține toate pozele hotelurilor, a pensiunilor și a vilelor și se bazează pe același principiu ca și tabelele poze_ștrandruri și poze_obiective. Câmpul cazare_id repezintă legătura cu hotelurile, pensiunile și vilele de care aparțin după cum se poate observa în figura 4.3. Câmpul cu numărul de ordine a pozei este reprezentat de id și câmpul cale_poză care coține locația acesteia pe hard-disk. Tabelul poze mai conține și câmpul poză_principală care este ”1” dacă aceasta va fi poza care va apărea pe pagina principală și ”0” dacă va fi considerată poză secundară și va apărea doar pe pagina de detalii(pagina de rezervări).

Figura 4.22 Structura tabelei poze

Figura 4.23 Conținutul tabelei poze

Tablela camere conține informații mai detaliate despre fiecare cameră din hoteluri, pensiuni și vile. Pentru a ști fiecare cameră de care hotel, pensiune sau vilă aparține acestea se leagă de tabela cazare prin cameră_id care reprezintă id-ul unic din tabela cazare după cum apare și în figura 4.3. Tabelul camere mai conține și câmpurile nr_cameră care reprezintă id-ul unic în cadrul fiecărui hotel, în cadrul fierărei pensiuni sau al fiecărei vile, câmpurile preț_noapte și capacitate. În figurile 4.23 și 4.24 sunt ilustrate sturctura, respectiv o parte din conținutul tabelei camere.

Figura 4.23 Structura tabelei camere

Figura 4.24 Conținutul tabelei camere

Următoarele 3 tabele rezervări, rezervări_anulate și clienți sunt strict legate de rezervarea camerelor la hoteluri, pensiuni sau vile. În momentul în care un client dorește să facă o rezervare acesta va completa formularul de rezervare aflat pe pagina de rezervări. Informațiile sunt inserate în tabelul clienți în câmpurile corespunzătoare, fiecare client primind un id unic. Acest id se va regăsi și în tabelul rezervări alături de id-ul camerei rezervate, facând astfel legătura între clienți și locurile disponibile pentru rezervare. Aceste legături sunt ilustrate foarte bine în figura 4.3. În următoarele figuri se vor prezenta structurile și conținuturile celor 3 tabele în discuție.

Figura 4.25 Structura tabelei clienți

Figura 4.26 Conținutul tabelei clienți

Figura 4.27 Structura tabelei rezervări

Figura 4.28 Conținutul tabelei rezervări

Figura 4.29 Structura tabelei rezervări_anulate

În tablela rezervări_anulate se vor salva informațiile legate clinlții care și-au anulat rezervarea cu cel puțin 24 de ore înainte de data sosirii. Informațiile acestor clienți vor fi apoi șterse din tabela de clienți și rezervarea din tabela de rezervări.

4.4 Interfața aplicației web

Această aplicație a fost concepută în principal pentru informare, pentru a prezenta vizitatorilor cele mai frumoase atracții turistice din Băile Felix, a facilitaților acestei stațiuni dar și a posibilitățile de cazare.

Vizitatorii site-ului au parte de o multitudine de informații adunate în aceasta aplicatie. Ei pot afla de pe această aplicație de cele mai bune locuri de cazare dar și informații utile despre obiectivele turistice și ștranduri.

Portalul vine ca o completare la nevoile cetățenilor dar și a turiștilor. Datorită dezvoltării internetului, portalurile au devenit unele dintre cele mai importante mijloace de informare ale secolului curent.

Aplicația a fost creată pentru a fi ușor de utilizat și este destinată oricărui tip de utilizator. Aceasta conține atât o parte de front-end cât și o parte de back-end pentru managementul conținutului, interfața pentru administatori.

În următoarele 2 subcapitole vom prezenta cele 2 tipuri de interfețe ale aplicației:

Interfața utilizator

Interfața de administrare

4.4.1 Interfața utilizator

Interfața utilizator sau front-end-ul reprezintă partea vizibilă a aplicației, aceasta este partea în care vizitatorii au acces la conținutul și funcționalitatea site-ului Web, în funcție de drepturile de acces aferente care au fost stabilite în partea de administrare (în acest caz doar de vizualizare și cazare).

Aplicația web permite vizitatorilor navigarea cu ușurință între pagini, astfel și un utilizator cu cunoștințe minime în domeniul calculoatoarelor se poate descurca și poate să găsească ceea ce caută odată ce a accesat website-ul.

Portalul de prezentare are în structura sa atât pagini statice cât și pagini dinamice.

Paginile statice ale acestei aplicații sunt paginile: prezentarea stațiunii la istoria stațiunii, și pagina de contact. Pagina care conține istoria stațiunii dar și pagina de contact, au fost realizate ca pagini statice deoarece istoria staținuii și datele de contact nu se schimbă atât de des.

Celelate pagini sunt toate dinamice. Paginile dinamice prezintă avantajul că își extrag anumite date din alte aplicații utilizând anumite funcții din PHP.

În figura 4.30 este afișată pagina principală a aplicației. Aceasta conține un meniu simplu drop-down care permite navigarea ușoară pe celelalte pagini, un calendar care afișează data curentă, un widget meteo pentru afișarea actualizată a vremii și partea de știri, evenimente și tratamente, fiecare pe câte o pagină. Pentru a trece de la o știre la alta sau la afișarea evenimentelor sau a tratamentelor se face click pe unul din numerele care reprezintă numărul de pagină.

Pagina principală mai conține de asemenea un slideshow cu imagini care se modifică automat la fiecare 5 secunde, un logo, un moto și un formular de logare pentru administrator care permite trecerea la partea de administrare. Acestea se repetă pe fiecare pagină cu excepția paginii de galerie foto.

Figura 4.30 Pagina principală

Următoarea pagină este pagina de cazare care ne oferă 3 opțiuni :

Hoteluri

Pensiuni

Vile

Figura 4.31 Meniu – cazare

Alegând categoria hoteluri pagina afișată va fi cea di figura 4.32 care va conține lista cu hoteluri la care un utilizator se poate caza. Pagina afișează numele hotelurilor, poza principală și o descriere scurtă a acestora. Același lucru este valabil și dacă se aleg categoriile pensiuni sau vile.

Figura 4.32 Pagina de cazare – hoteluri

În momentul în care se face click pe detalii utilizatorul este dus pe pagina de rezervări unde se prezintă detaliat hotelul selectat precum și facilitățile și serviciile oferite împreună cu formularul de rezervare și o galerie de 6 poze. Pagina este prezentată în figurile 4.33 și 4.34.

Figura 4.33 Pagina de rezervări – Hotel International

Figura 4.34 Pagina de rezervări – Hotel International

În figura 4.35 este afișată pagina de galeria foto care conține 16 poze din diferite locații ale stațiunii. Când se face click pe una din poze, aceasta se deschide într-o nouă pagină după cum se poate observa în figura 4.36.

Figura 4.35 Pagina de galerie_foto

Figura 4.36 Pagina de poze

Următoarea pagină este pagina de prezentare a stațiunii care oferă și aceasta 3 opțiuni:

Istorie

Obiective turistice

Ștranduri

Figura 4.37 Meniu – prezentare stațiune

Alegând opțiunea istorie pagina afișată va fi cea din figura 4.38 care va conține o scurtă prezentare a stațiunii, a istoriei și a turismului acesteia.

Figura 4.38 Pagina de istorie

Alegând opțiunea obiective turistice pagina afișată va fi cea din figura 4.39 care va conține o listă scurtă în care sunt prezentate principalele obiective turistice ale stațiunii.

Figura 4.39 Pagina de obiective turistice

Alegând opțiunea ștranduri se va afișată pagina va din figura 4.40 care va conține lista cu cele mai importante 3 ștranduri ale stațiunii Băile Felix împreună cu o scurtă descriere. Cele 3 ștranduri sunt: Felix, Apollo și Padiș.

Figura 4.40 Pagina de ștranduri

În momentul în care se face click pe detalii utilizatorul este dus pe pagina de detalii unde se prezintă detaliat ștrandul selectat precum și facilitățile, dotările și serviciile oferite împreună cu prețurile aferente și o galerie de 6 poze. Pagina este prezentată în figura 4.41.

Figura 4.41 Pagina de ștranduri_detalii

Ultima pagină este pagina de contact prezentată în figura 4.42. Aici sunt afișate datele de contact precum și orele de lucru ale primăriei din Sînmartin de care aparține și stațiunea Băile Felix.

Figura 4.42 Pagina de contact

4.4.2 Interfața de administrare

Interfața de administrare sau back-end-ul aplicației este accesibil administratorului prin intermediul căruia se realizează managementul conținutului și gestionarea funcționalităților de cazare. Administratorul are drepturi depline asupra aplicației, putând astfel administra orice conținut din aplicație.

Accesul pe interfața de administrare se face printr-un formular de autentificare, pe baza numelui de utilizator și pe baza unei parole. Administratorul poate adăuga, șterge și modifica/actualiza datele din interiorul aplicației.

Interfața de administrare cu toate facilitățile sale este accesibilă doar în momentul în care autentificarea se face cu succes. Dacă nu sunt completate toate câmpurile sau nu sunt completate corect se vor afișa mesajele de eroare corespunzătoare. Acestea vor dispărea automat după 5 secunde. De asemenea dacă user-ul sau parola introduse nu sunt găsite în tabelul de admini din baza de date a aplicației se va afișa mesjul „Nu sunteți admin”. În momentul în care autentificarea se face cu succes în colțul din dreapta sus formularul de autentificare va fi înlocuit cu buton de delogare încadrat de mesajul „Logat” și va fi creată o sesiune nouă pentru acel adiministrator, sesiune care va fi distrusă în momentul delogării.

Paginile sunt aceleași ca și în interfața utilizator, în plus apar opțiunile de adăugare, ștergere sau actualizare a datelor din interiorul aplicației.

În figurile 4.43 și 4.44 este afișată pagina principala așa cum apare în momentul în care administratorul se autentifică cu succes.

Figura 4.43 Pagina principala – pentru administrator

După cum se poate observa în figura 4.43 sub meniu apar în plus opțiunile de inserare știre și ștergere știre. În figura 4.44 se observă că se continuă cu afișarea informațiilor la fel ca și în interfața utilizator pentru a putea fi vizualizate mai ușor modificările aduse aplicației. Sub acestea apar posibilităților de actualizare atât a titlului cât și a conținutului știrii.

Figura 4.44 Pagina principala – pentru administrator

Același principiu și aceeași structură se folosește și în celelalte pagini, în plus fața de ce apare în interfața utilizator se adaugă opțiunile specifice administratorilor.

Figura 4.45 Pagina de cazare – pentru administrator

Figura 4.45 reprezintă zona din pagina de cazare pentru administrator unde se poate adăuga un nou hotel în baza de date a aplcației, câmp cu câmp. Acesta poate să adauge și noi camere hotelurilor deja existente.

Figura 4.46 Pagina de cazare – pentru administrator

Figura 4.46 reprezintă zona de unde administratorul poate să șteargă un hotel în funcție de id-ul unic pe care acesta îl are în tabelul de cazare sau poate să acutalizeze numele hotelului adăugând noul nume în chenar și apăsând butonul actualizare.

Pentru acutalizarea descrierii scurte a hotelului se procedează la fel, după cum se poate observa în figura 4.47 avem aceeași structură.

Figura 4.47 Pagina de cazare – pentru administrator

Actualizarea celorlalte câmpuri se poate face de pe pagina de rezervare unde ajungem dacă dăm click pe detalii. Pentru acutalizarea descrierii sau a restul câmpurilor se procedează la fel ca și în cazul numelui sau a descrierii scurte. În figurile 4.48 și 4.49 se va ilustra și pagina de rezervare.

Figura 4.48 Pagina de rezervare – pentru administrator

Figura 4.49 Pagina de rezervare – pentru administrator

Pe pagina de rezervare administratorul are posibilitatea de a vedea și cazările hotelul a cărui pagină a fost selectată.

Același principiu se folosește și pentru obiectivele tiristice și ștrandruri și acceași structură de pagină: inserare, ștergere și după afișarea fiecărui câmp posibilitatea de a-l actualiza.

La pagina de galerie foto administratorul are doar posibilitatea de a adăuga sau șterge o poză după cum reiese și din figura 4.50.

Figura 4.50 Pagina de galerie_foto – pentru administrator

După cum a fost menționat și la începutul acestui subcapitol, în momentul în care administratorul se deloghează, adică apasă butonul de delogare, sesiunea acestuia este încheiată. Când sesiunea este încheiată aplicația revine la interfața utilizator, câmpurile pentru adăugarea, ștergerea sau actualizarea datelor nu mai sunt afișate devenind inaccesibile. De asemenea reapare formularul de logare facând astfel posibile viitoare logări.

5. Concluzii

Aplicația prezentată este una utilă și contribuie cu succes la informarea vizitatorilor. Este o aplicatie simplă care se adresează atât localnicilor cât și turistilor fiind un mijloc important de informare din punct de vedere turisic și nu numai.

Aplicația curentă este compatibilă cu toate browserele de pe piață. Principalele caracteristici ale acestei aplicații web sunt simplitatea, utilitatea și accesabilitatea.

Simplitatea reiese din modul foarte ușor de utilizat a aplicației de către orice persoană, indiferent de nivelul cunoștintelor din punct de vedere informațional deoarece site-ul este foarte bine structurat pentru ca fiecare vizitator să găsească în cel mai scurt timp informatia de care are nevoie.

Este utilă deoarece pune la dispoziția vizitatorilor informații legate de tratamente, evenimente, locuri de cazare, oferind și posibilitatea cazării efective la unele dintre hotelurile, pensiunile sau vilele din stațiune, prezintă facilitățile, dotările, serviciile precum și prețurile celor mai importante ștranduri, iar pentru cei pasionați de cultură sau călătorii site-ul conține și o pagină cu istoria stațiunii și cele mai frumoase obiective turistice din zonă.

Este accesibilă deoarece este compatibilă cu toate browserele și poate fi folosită de orice tip de utilizator.

Simplitatea, utilitatea dar și complexitatea aplicației îi oferă un mare avantaj față de alte aplicații prezente în acest moment pe piață.

Aplicația și-a atins scopul principal, acela de a promova cu succes stațiunea Băile Felix, unul din principalele obiective turistice ale județului Bihor.

Aplicația a fost structurată în așa fel încât o eventuală extindere să fie cât mai accesibilă în viitor. Baza de date poate să fie și ea îmbunătățită și completată relativ ușor.

Principalele devoltări viitoare ar cuprinde adăugarea unui sistem de chat prin intermediul căruia să se faciliteze comunicarea cu utilizatorii, introducerea posibilității de logare a utilizatorilor, extinderea site-ului prin adăugarea de noi hoteluri, pensiuni, vile, galerii sau obiective.

6. Bibliografie

[1] Cornelia Gyorodi. Baze de date relaționale, teorie și aplicații. Editura TREIRA, Oradea, 2000.

[2] Cristian Darie, Mihai Bucică. PHP5 și MySQL pentru comerț electronic. Editura Teora, București, 2006.

[3] http://ciobanu.cich.md/lectii_view.php?id=5 consultat la data de 27.06.2015

[4] http://tutorialeprogramare.com/tutoriale-css/ consultat la data de 27.06.2015

[5] http://tuwer.eu/introducere-in-css/ consultat la data de 27.06.2015

[6] http://ctrl-d.ro/development/resurse-development/introducere-in-css3-proprietati/ consultat la data de 27.06.2015

[7] http://www.marplo.net/curs_css/introducere.html consultat la data de 27.06.2015

[8] http://vega.unitbv.ro/~cataron/Courses/BD/BD_Cap_5.pdf consultat la data de 27.06.2015

[9] http://ro.wikipedia.org/wiki/JavaScript consultat la data de 27.06.2015

[10] http://informatica.hyperion.ro/wp-content/uploads/2015/05/Tehnologii-Web.pdf

consultat la data de 27.06.2015

[11] http://www.marplo.net/javascript/jquery-elemente-baza-js consultat la data de 27.06.2015

[12] http://ro.wikipedia.org/wiki/JQuery consultat la data de 27.06.2015

[13] etutoriale.ro/articles/16/1/Despre-PHP/ consultat la data de 27.06.2015

[14] http://ciobanu.cich.md/lectii_view.php?id=7 consultat la data de 27.06.2015

[15] www.seap.usv.ro/~valeriul/lupu/mysql.doc consultat la data de 27.06.2015

[16] https://www.apachefriends.org/ro/index.html consultat la data de 27.06.2015

[17] http://www.google.ro/url?sa=t&rct=j&q=&esrc=s&source=web&cd=5&ved=0CDkQFjAE&url=http%3A%2F%2Fpui-project.googlecode.com%2Fsvn%2Ftrunk%2Fpui-project%2Fdoc%2FDocumentatie.pdf&ei=U-NyVcOwOcjhywO-nIHwAQ&usg=AFQjCNGfyiKudeVPl_WGbnA-9DKCB0QGng&sig2=ngwylw-P9gdXIaddEMZqrA&bvm=bv.95039771,d.bGQ&cad=rja,

consultat la data de 27.06.2015

[18] http://www.drogoreanu.ro/tutorials/mysql.php consultat la data de 27.06.2015

[19] http://www.runceanu.ro/adrian/wp-content/cursuri/tw2014/Laborator1%282014%29.pdf

consultat la data de 27.06.2015

[20] http://cronicaromana.net/2015/05/04/baile-felix-cea-mai-mare-statiune-balneara-din-romania/

consultat la data de 27.06.2015

[21] http://webbanneronline.com/design-web/design-site/item/129-ce-sunt-portalurile-web

consultat la data de 27.06.2015

[22] http://ro.wikipedia.org/wiki/Aplica%C8%9Bie_web consultat la data de 27.06.2015

[23] http://www.prologue.ro/servicii/aplicatii-online/ consultat la data de 27.06.2015

[24] http://ro.wikipedia.org/wiki/Notepad%2B%2B consultat la data de 27.06.2015

[25] http://www.techit.ro/baza-de-date-relationala.php consultat la data de 27.06.2015

[26] http://ro.wikipedia.org/wiki/HTML5 consultat la data de 27.06.2015

[27] https://ro.wikipedia.org/wiki/Baz%C4%83_de_date consultat la 21.03.2015.

[28] http://ctrl-d.ro/development/resurse-development/introducere-in-html5-partea-i/

consultat la data de 27.06.2015

DECLARAȚIE DE AUTENTICITATE

A

LUCRĂRII DE FINALIZARE A STUDIILOR

Titlul lucrării ________________________________________________________

__________________________________________________________________

__________________________________________________________________

Autorul lucrării ___________________________________________

Lucrarea de finalizare a studiilor este elaborată în vederea susținerii examenului de finalizare a studiilor organizat de către Facultatea _________________________________________ din cadrul Universității din Oradea, sesiunea_______________________ a anului universitar ______________.

Prin prezenta, subsemnatul (nume, prenume, CNP)_____________________

__________________________________________________________________

___________________________________________________________________,

declar pe proprie răspundere că această lucrare a fost scrisă de către mine, fără nici un ajutor neautorizat ș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,

Data Semnătura