Aplicatie Web Haidumusic

Aplicatie web-haidumusic

CUPRINS

INTRODUCERE

Capitolul 1. TEHNOLOGII UTILIZATE ÎN REALIZAREA APLICAȚIEI

1. HTML

1.1.HTML notiuni generale

1.1.2. HTML5

1.1.3. Diferente HTML5 față de HTML4

1.2.CSS

1.2.1 Notiuni generale

1.2.2 Sintaxa limbajului

1.3 ExtJS

1.4 PHP

1.4.1 Noțiuni generale

1.4.2 Crearea scripturilor PHP

1.5 Serverul HTTP Apache

1.6.1 Baze de date

1.6.2MySQL

Capitolul 2. Despre Site-ul de prezentare Web:Haidu Music

2.1. Interfața sitelui de prezentare Haidu Muzic

2.2. Partea de administrare a sitului Haidu Music

Cap.3. Proiectarea aplicației

3.1. Structura bazei de date

3.2. Descrierea procedurilor și codurile sursă

3.3. Dezvoltări ulterioare

CONCLUZII

BIBLIOGRAFIE

INTRODUCERE

Deoarece trăim intr-o lume a vitezei ,cea ce denotă că timpul este enorm de prețios nevoia de a fi punctual este indinspesabilă fiecarui om.Pentru a obține rezultate maxime in această era a vitezei si a informațiilor internetul joacă un rol major sau mai bine zis essențial.Internet care este in plină dezvoltare .Internetul este o rețea de întindere mondiala care cuprinde o multitudine de informații si resurse disponibile prin intermediul calculatorului.Actualmente peste 3 miliarde de oameni folosesc Internetul.acesta fiind sa devină infrastructura de bază a societații moderne.

Comertul electronic este cheia competitivitații firmelor in contextual dezvoltării noii economii datorita capacitați de a depasi granițtele de timp și de spațiu.Se preconizează că Internetul va avea un rol din ce în ce mai important, punându-și amprenta asupra întregii vieți economice, sociale și culturale a omenirii și va guverna practic toată lumea modernă.Magazinele virtuale folosesc în plus actualizări permanente ale bazei lor de date monitorizând totodată și accesul diferitelor tipuri de utilizatori. Integrarea aplicațiilor internet conduce la dezvoltarea din aproape în aproape a societății informaționale prin creșterea gradului de satisfacere a cerințelor utilizatorului public. Internet-ul reprezintă o sursa de informare, dar în același timp și locul unde el se poate prezenta, autopromova, astfel încât sa devină cunoscut. Anul acesta rețeaua Internet a împlinit treisprezece ani, dar este departe de a fi un concept finalizat, mai ales din punct de vedere al implicațiilor sociale sau culturale. Deși nimeni nu a tăiat panglica la nașterea sa și artificiile nu și-au făcut apariția pe cerul înstelat, Internet-ul si-a câștigat un loc bine meritat pe piață și continuă să facă parte integrantă din viata noastră, pentru unii devenind un adevărat stil de viață și unicul prieten.Am ales sa creez această aplicație deoarece o muțime de oameni care din anumite considerente sunt interesați de muzică.

Această aplicație este un site de prezentare a casei de discuri Haidu Music care prezintă artiști albumele dânșilor informațtii despre aceastea .Vizitatori sitului au posibilitatea sa voteze artistul preferat si asculte melodiile din albumele artișilor.

Aceasta aplicație ușurează munca administratorilor sitului deoarece situl are are o parte de administrare prin care se poate administra tot conținutul sitului .

Odata ce ai intrat pe acest site poți sa vizualizezi liste cu albumele artiștilor ,fotografii si vizitatorul poate sa aibă parte de o audiție placută a muzicii.

Această aplicație este folosită de catre toți oameni care sunt pasiontați de muzică având postate mai multe genuri muzicale pentru o gamă largă de utilizatori.

Scopul acestei aplicații este este de a promova casa se discuri Haidu Music și a artiștilor care colaborează cu casa de discuri.

TEHNOLOGII UTILIZATE ÎN REALIZAREA APLICAȚIEI

1. HTML

1.1.HTML notiuni generale

Unul din primele elemente fundamentale ale WWW ( World Wide Web ) este HTML ( Hypertext Markup Language ), care descrie formatul primar în care documentele sunt distribuite și vazute pe Web. Multe din trăsăturile lui, cum ar fi independența față de platformă, structurarea formatării și legăturile hypertext, fac din el un foarte bun format pentru documentele Internet și Web.

Primele specificații de baza ale Web-ului au fost HTML, HTTP și URL.
HTML a fost dezvoltat inițial de Tim Berners-Lee in 1989. HTML a fost văzut ca o posibilitate pentru fizicienii care utilizează computere diferite să schimbe între ei informație utilizând Internetul. Erau prin urmare necesare câteva trăsături : independența de platformă, posibilități hypertext și structurarea documentelor. Independența de platformă înseamnă că un document poate fi afișat în mod asemănător de computere diferite ( deci cu fonturi, grafica și culori diferite ), lucru vital pentru o audienta atât de variată.

Hypertext înseamnă că orice cuvânt, frază, imagine sau alt element al documentului văzut de un utilizator ( client ), care poate face referință la un alt document, ceea ce face mult mai ușoară navigarea între multiple documente sau chiar în interiorul unui aceluiași document. Structurarea riguroasă a documentelor permite convertirea acestora dintr-un format în altul precum și interogarea unor baze de date formate din aceste documente.

Paginile HTML sunt formate din etichete sau tag-uri și au extensia .html sau .htm. În marea lor majoritate aceste etichete sunt pereche, una de deschidere <eticheta> și alta de închidere </eticheta>. Browserul interpretează aceste etichete afișând rezultatul pe ecran. HTML-ul nu este un limbaj case sensitiv (nu face deosebirea intre litere mici și mari).

Pagina principală a unui domeniu este fișierul index.html. Această pagină este setată a fi afișată automat la vizitarea unui domeniu.De exemplu la vizitarea domeniului “www.nume.ro” este afișată pagina „www.nume.ro/index.html”. Unele etichete permit utilizarea de atribute care pot avea anumite valori:

<eticheta atribut="valoare"> … </eticheta>

Componența unui document HTML este:

1. versiunea HTML a documentului

2. zona head cu etichetele <head></head>

3. zona body cu etichetele <body></body> sau <frameset></frameset>

Toate paginile HTML încep și se termină cu etichetele <html> și </html>.
În interiorul acestor etichete găsim perechile <head>, </head> și <body>, </body>.

Head conține titlul paginii intre etichetele <title> și </title>, descrieri de tip <meta>, stiluri pentru formatarea textului, scripturi și linkuri către fișiere externe (de exemplu scripturi, fișiere de tip CSS sau favicon).

Etichetele de tip meta conțin cuvinte cheie, descrierea paginii, date despre autor, informații utile motoarelor de căutare și au următorul format:
<META NAME="nume" CONTENT="conținut">

Exemplu: link către un fisier extern CSS:
<link rel="stylesheet" type="text/css" href="css.css">

Body găzduiește practic toate etichetele afișate de browser pe ecran.

Exemplu de cod : – o pagină HTML cu titlul Titlu iar conținutul Conținut pagina

1.1.2. HTML5

HTML5 este un limbaj pentru structurarea și prezentarea conținutului pentru WORLD WIDE WEB, o tehnologie nucleu pentru Internet propusă inițial pentru software-ul Opera. Este a 5-a revizuire a standardului HTML (creat în 1990 și standardizat ca HTML4 din 1997) și din octombrie 2011 este în curs de dezvoltare. Obiectivele sale principale au fost acelea de a îmbunătăți limbajul cu un suport pentru cele mai recente apariții multimedia în același timp menținându-l ușor de citit pentru oameni și bineînțeles de computere și device-uri (browsere web, analizoare de text, etc.). HTML5 își propune să însumeze nu numai HTML4, dar și XHTML1 și DOM2HTML ( îndeosebi JavaScript).

Urmărind predecesorii săi imediați HTML 4.01 și XHTML 1.1, HTML5 este un răspuns la observația că HTML și XHTML utilizate în comun pe World Wide Web sunt un amestec de caracteristici introduse de specificații diferite, împreună cu acestea mai sunt și caracteristicile diferite aduse de software, de browsere, și multe erori de sintaxă în documentele web existente. Astfel, HTML5 devine o încercare de a defini un singur limbaj de marcare (markup language) care poate fi scris în oricare dintre sintaxele HTML sau/și XHTML. Acesta include modele detaliate de prelucrare pentru a încuraja mai multe implementări interoperabile; extinde, îmbunătățește și raționalizează disponibilitățile pentru documentele web și introduce marcarea și aplicații API pentru aplicații web complexe.[1]

Din aceste motive, HTML5 este un posibil candidat pentru aplicațiile de platforme mobile. Multe caracteristici ale HTML5 au fost create pe considerentul că va trebui să devină capabil să ruleze pe dispozitive cum ar fi smart-phonurile sau tabletele.

În special, HTML5 aduce multe noi caracteristici sintactice. Acestea cuprind elemente ca <video>, <audio>, <header> și <canvas>  elemente HTML, precum și integrarea conținutului SVG care înlocuiește utilizarea tag-ului generic <object>. Aceste noutăți sunt proiectate pentru a facilita includerea și manipularea în web a conținuturilor multimedia și grafice fără a fi nevoie să se recurgă la proprietățile de plugin și API. Alte noi elemente ca <section>, <article>, <header>, și <nav> sunt proiectate să îmbunătățească conținutul

semantic al documentelor. Noi atribute au fost introduse în același scop, în același timp unele elemente și atribute au fost îndepărtate. Unele elemente ca <a>, <cite> și <menu> au fost schimbate, redefinite și standardizate. API-urile și DOM-urile (document object model) sunt certitudini și sunt părți fundamentale în specificațiile HTML5. HTML5, de asemenea, definește în câteva detalii prelucrările necesare pentru documentele invalide, astfel încât sintaxa erorilor va fi tratată uniform de toate browserele cunoscute. [2][3]

1.1.3. Diferente HTML5 față de HTML4

Elementele pe care le vom arăta mai jos au înțeles puțin modificat în HTML5 pentru a reflecta mai bine utilizarea lor în web sau a puncta despre cum pot deveni cât mai folositoare.

Elementul a folosit fără atribut ‚href’ reprezintă un loc gol în care ar putea fi plasat un link, de asemenea poate conține mai degrabă un flux de conținut decât de a fi restricționat la o frază.

Elementul address este folosit cu scopul unui nou concept pentru secționare.

Elementul b acum reprezintă un text span pentru a-i atașa un stil decalat față de situația normală, fără nici o importanță sau cum ar fi evidențierea cuvintelor cheie sau a numelor unor produse Într-o recenzie sau alte texte a căror prezentare tipică tipografică este boldită.

Elementul cite acum reprezintă doar titlul unei lucrări (a unei cărți, lucrări, eseu, poem, cântec, script, film, un program TV, un joc, o sculptura, o pictura, o piesa de teatru, o opera, un show musical, o expoziție, un raport legal) Specificațiile din HTML 4 în care este utilizat pentru a marca numele unei persoane nu mai sunt considerate.

Elementul hr reprezintă acum o pauză tematicăîntr-un paragraf

Elementul i reprezintă un span de text în alternanță după voce și stare, sau altfel, o alta abordare de la scopul normal, de exemplu o denumire taxonomica, un termen ethnic, o frază idiomatică din alta limbă, un nume de vas, sau alt scop în care prezentarea tipică tipografică este oblic scrisa. Folosirea ei diferă în funcție de limba.

De la elementul label, browserul nu mai trebuie să-și mute focusul de la label la control doar daca un astfel de comportament este standard pentru platforma de interacțiune cu userul.

Elementul meniu este redefinit pentru a fi utilizat de toolbars sau meniu de context.

Elementul small acum reprezintă o afișare mică ( pentru comentarii și afișări legale)

Elementul strong reprezintă importanță,  decât accentul pus pe boldire.

Elementul head nu mai permite elementul obiect ca subelement.

Următoarele atribute sunt permise dar autorii nu mai încurajează utilizarea lor, ei preferă folosirea soluțiilor alternative. [4]

atributul border la img – este obligatoriu să avem valoarea 0 când este prezent. Se poate folosi CSS pentru a înlocui acest atribut.

Atributul language în elementul script. Este necesar a avea el de comportament este standard pentru platforma de interacțiune cu userul.

Elementul meniu este redefinit pentru a fi utilizat de toolbars sau meniu de context.

Elementul small acum reprezintă o afișare mică ( pentru comentarii și afișări legale)

Elementul strong reprezintă importanță,  decât accentul pus pe boldire.

Elementul head nu mai permite elementul obiect ca subelement.

Următoarele atribute sunt permise dar autorii nu mai încurajează utilizarea lor, ei preferă folosirea soluțiilor alternative. [4]

atributul border la img – este obligatoriu să avem valoarea 0 când este prezent. Se poate folosi CSS pentru a înlocui acest atribut.

Atributul language în elementul script. Este necesar a avea valoarea „javascript” (case-insensitive) când este prezent elementul script și intră în conflict cu atributul„type”. Autorii îl pot omite pur și simplu.

Atributul name al elementului a. Autorii pot folosi atributul id în schimb.

Atributul summary al unui tabel. HTML5 definește câteva soluții alternative. [5]

1.2.CSS

1.2.1 Notiuni generale

CSS sau (Cascading Style Sheets – foi de stil în cascadă) este un limbaj de programare ce se află în stransă legătura cu HTML. CSS se utilizează pentru a crea designul unui website, webmasterii din toata lumea utilizând acest limbaj de programare robust pentru a crea site-uri

tot mai atrăgătoare cu ajutorul noilor versiuni de CSS3.

Fig. 1 Cod de bază CSS [6]

Limbajul a fost complet dezvoltat pe parcursul mai multor ani. Confuziile pot apărea cel mai adesea din cauza înțelegerii greșite a codului, dar și încurcarea unor taguri. De asemenea CSS aduce o mulțime de noi concepte.[7]

CSS ajută la afișarea elementelor de HTML în funcție de instrucțiunile pe care browser-erele le găsesc în locurile indicate. Se pot defini, în patru locuri diferite stilurile pe care le vor respecta elementele de HTML ale unei pagini și exact ca în programarea orientata pe obiect, se moștenesc și se pot suprascrie.

Primul nivel este cel ar browser-ului, care totodată este și stilul implicit.

Pe nivelul doi se găsește stilul declarat într-un fișier extern, salvat cu extensia .css.

Stilul declarat în interiorul paginii, în cadrul elementului <head> estepe nivelul 3.

Iar ultimul nivel, nivelul 4, cel care este cel mai aproape de elementul HTML de afișat, este cel definit chiar în cadrul elementului în cauză.

1.2.2 Sintaxa limbajului

Sintaxa limbajului CSS este foarte simplă, fiind formată dintr-un grup de trei elemente: selector, proprietate și valoare. De exemplu: selector {proprietate: valoare}. Iată cum arată câteva elemente HTML cărora le vom atribui câte un stil:

h1 {color: green}

– dacă un atribut are spații pentru valoare sa, trebuie să punem ghilimele:

p {color:black ; font-family=”new times roman” ; backgroundcolor:red}

– atunci când vrem să punem mai multe atribute le putem pune pe mai multe linii pentru o mai bună percepere:

p {

color:black ;

font-family=arial ;

background-color:red

}

− folosirea unuia sau mai multor stiluri pentru același element HTML (clasa.identificator) – clasa reprezintă numele elementului HTML :

h1.green {color:green}

h1.red {color:red}

<h1 class=”green”>Hello</h1>

<h1 class=”red”>Hello!<h1>

Stilul h1 definit mai sus va fi folosit pentru toate header-ele h1 în care nu se specifică un atribut “class”. Dacă specificăm class=”green” atunci se va folosi stilul definit pt h1: “green” , și anume “h1.green”

− se pot defini stiluri nu neapărat pentru un anumit element HTML ci pentru mai multe și atunci vom renunța la clasă (elementul HTML din definitie)

.left {text:align: left}

<p class=”left”> Hello world </p>− comentariile in cadrul unui stil se pot adăuga astfel:

/* comentariu */

.left {

text:align: left

/* comentariu…. */

}

Stilul de pe nivelul unu este stilul implicit al browserului și nu putem modifica nimic acolo, dar putem specifica cele pe nivelele 2,3 si 4. Cel de pe nivelul 2, stilul definit într-un fișier extern, cu extensia .css poate fi adăugat astfel:

<head>

<link rel="stylesheet" type="text/css" href="un_stil_definit.css" />

</head>

Pentru nivelul 3:

<head>

<style type="text/css">

h1 {color: red}

p {font-family=arial }

</style>

</head>

Nivelul 4:

<p style="color: red; font-family=arial">

Hello world

</p>

Fișierele sau stilurile pentru o pagină web se pot defini folosind orice editor text, dar exista și tool-uri integrate în orice platforma mare pentru dezvoltat situri web. Depinde foarte mult de dezvoltator dacă va folosi css-uri sau nu. Siturile dezvoltate împreună cu css vor suporta mult mai ușor orice îmbunătățire sau modificare din punctul de vedere al aspectului.[8]

Fișierul CSS va permite separarea conținutului (X)HTML de stilul de afișare în pagină. Ca de obicei, utilizați codul (X)HTML pentru aranjarea conținutului în pagină, însă toată prezentarea (fonturi, culori, fundaluri, borduri, etc.) se realizează din fișierul CSS. In acest moment, puteți folosi CSS-urile în doua moduri, și anume interne sau externe.

1.2.3 Stilurile interne si externe

Metoda stilurilor interne implica faptul ca se va plasa codul CSS in interiorul fiecărei pagini html pe care doriți sa folosiți stilurile respective, intre tagurile <head></head> .Acest lucru se face ca in exemplul ce urmează:

<head>

<title>titlu pagina</title>

<style type="text/css">

Aici se definesc stilurile CSS

</style>

</head>

Folosind aceasta metoda (stilurile interne), fiecare fișier (X)HTML va conține codul CSS folosit la stilizare. Asta înseamnă ca atunci când doriți sa faceți o schimbare de stil (mărimea fontului, culoare, etc.) va trebui sa operați modificarea in toate paginile ce conțin acel stil. Metoda descrisa pana acum este buna atunci când avem de stilizat doua, trei pagini, însă când avem de a face cu site-uri de zeci sau sute de pagini este destul de neplăcut să modificăm toate paginile.

Un fișier CSS extern poate fi realizat cu orice editor simplu de text (Notepad, Wordpad, etc) sau cu editoare avansate gen Dreamweaver. Fișierul CSS nu conține sub nici o forma cod (X)HTML, ci doar cod CSS. Fișierul trebuie salvat cu extensia .css. Inserarea fișierului extern in paginile (X)HTML se face foarte ușor, prin plasarea unui link (legatura) în secțiunea <head></head> a fiecărei pagini pe care dorim sa folosim stilul respectiv. Iată un exemplu de inserare a unui fișier extern .css intr-o pagina (X)HTML:

<link rel="stylesheet" type="text/css" href="Calea catre fisierul.css" />

sau puteti folosi metoda de import dupa cum urmeaza:

<style type="text/css">@import url( Calea catre fisierul.css )</style>

Oricare dintre metode este buna si se obtine plasand unul dintre codurile de mai sus in sectiunea <head></head> a paginii, dupa cum exemplificam mai jos:

<head>

<title> titlu pagina </title>

<link rel="stylesheet" type="text/css" href="stil.css" />

</head>

sau

<head>

<title> titlu pagina </title>

<style type="text/css"> @import url( Calea catre fisierul.css ) </style>

</head>

Folosind metoda fișierelor CSS externe, toate paginile (X)HTML vor folosi același fișier de stil. Asta înseamnă ca dacă doriți sa faceți o schimbare care sa aibă efect in toate paginile, este de ajuns sa modificați un singur fișier, si anume cel de stil (.css), si efectul se va observa pe toate paginile (X)HTML ce folosesc acel fișier. Astfel faceți schimbări în tot site-ul, indiferent de câte pagini are, fără efort și mai ales foarte repede.

Iată câteva motive pentru care aceasta metodă este mai bună.[8]

Întreținere mai ușoara

Dimensiuni reduse ale paginilor

Economie de banda internet

Flexibilitate

Folosirea CSS-urilor în dezvoltarea siturilor ajuta atât dezvoltătorii cât și designerii la obținerea unor rezultate rapide si eficiente.

O noua versiune, CSS3 începe sa facă primii pași în lumea web-ului și să sperăm că în numai câțiva ani să o utilizăm la potențialul ei adevărat. CSS 3 ne va permite să ne detașăm și mai mult de JavaScript făcând CSS-ul un limbaj mai individual, lucru dorit de orice webmaster.

1.3 ExtJS

ExtJS, este de asemenea cunoscut ca și EXT, fiind o librărie JavaScript. Acesta constă într-o gamă largă de widget-uri, un model de componentă extensibila și un set easy-to-use API pentru a crea o bază solidă pentru aplicații web bazate pe JavaScript, folosind tehnici cum ar fi AJAX, DHTML și DOM scripting [11]

Inițial fiind creat ca o colecție de extensii pentru librăriile add-on (YUI) Yahoo User Interface sub numele de YUI-ext, inițiatorul fiind Jack Slocum, ExtJS fiind interoperabil cu jQuyery and Prototype nefiind însă dependent de ele.[12]

Datorită complexității și popularității în creștere, aceasta s-a dezvoltat într-o bibliotecă independentă Ext JS.9

ExtJS oferă programatorilor web un set de clase care pot fi instanțiate direct pentru a obține o interfață grafică interactivă. Deși este bazat pe un limbaj de scripting, această librărie implementează modelul MVC(Model view controller) și oferă programatorilor obișnuiți cu construcția de interfețe pentru aplicații desktop un mediu de lucru foarte apropiat de ceea ce ei deja cunosc. Pentru cei care au mai lucrat la interfețe grafice pentru aplicatii desktop, ExtJS este aparent doar un limbaj cu sintaxa puțin diferită față de ceea ce sunt ei obișnuiți.

ExtJS nu este doar o librărie JavaScript care modifică aspectul deja existent al paginii web, el oferă o multitudine de obiecte care să fie introduse în pagina web, acestea fiind inspirate din cele existente pentru aplicațiile desktop. Câteva exemple ar putea fi obiectele de tip combo-box, tree control, panel, bara de meniu, layout , input-text-field și window. Bineînțeles că, fiind în special o librărie pentru web, toate acestea au luat și din aspectul web, astfel obiecte cum ar fi combo-box, input-text-field sunt conținute în clasa Ext.Form.

Sencha sau ExtJS 4 este următoarea etapă majoră în cadrul JavaScript. Cu o funcționalitate extinsă, diagrame plugin-free, precum și o nouă arhitectură MCV1 acesta devine cea mai bună platformă Ext JS de dezvoltare a aplicațiilor web

Fig.2 logo Sencha[13]

Ext JS 4 este un important pas înainte pentru dezvoltarea de aplicații web. Bazându-se pe Ext JS 3.3, ultima versiune a noastră adaugă peste 350 de noi API-uri, 50 de noi clase, și documentație cu 65% mai multă. Ext JS 4 aduce, de asemenea, un nou pachet complet de date, care permite dezvoltatorilor să utilizeze o arhitectură Model-View-Controller în timpul construirii app-urilor. Noul MVC permite aplicațiilor o grilă pentru a construi un nivel cu totul nou de interactivitate pentru a aplicații web.[13]

Fig.3 Arhitectura Model-View-Controller .[14]

În ExtJS 4 s-a introdus un sistem grafic avansat pentru chart, imagini vectoriale SVG și VML, care-l ajută mult pe dezvoltator la scurtarea timpului de programare și prezentarea foarte atractivă a datelor.

Ext JS suportă toate browserele importante, incluse în web:

Internet Explorer 6 +

Firefox 3.6 + (PC, Mac)

Safari 4 +

Chrome 10 +

Opera 11 + (PC, Mac)

1.4 PHP

1.4.1 Noțiuni generale

PHP "PHP: Hypertext Preprocessor" este un limbaj de scripting de uz general, utilizat pe scară largă, care este potrivit în special pentru dezvoltarea aplicațiilor Web. Sintaxa sa provine din C, Java și Perl. Scopul principal al limbajului este acela de a permite programatorilor web să creeze rapid pagini web generate dinamic. [15]

PHP este limbajul ideal pentru construirea de pagini web dinamice. Este ușor de învățat, open-source, poate fi rulat pe mai multe platforme și se poate conecta la mai multe tipuri de baze de date. Cel mai important aspect al limbajului este însă posibilitatea de a fi imbricat cu cod HTML. Putem astfel crea pagini HTML statice și din loc în loc, acolo unde este nevoie, să introducem dinamism cu ajutorul PHP.

Fiind open-source, PHP beneficiază de suport activ din partea comunității online, acesta fiind și motivul creșterii explozive a numărului site-urilor bazate pe PHP.
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țiala fata de alte limbaje de scripting (gen JavaScript) este faptul ca PHP este un interpretor server-side (operatiile sunt executate de către server si nu pe calculatorul utilizatorului). Pentru a putea testa pagini PHP aveti nevoie de un server de web (Apache) si de pachetul PHP instalat.

PHP permite folosirea unor elemente specifice limbajelor de programare. Ieșirea standard a script-ului PHP devine intrarea standard pentru programul de navigare care vizualizează pagina. Așadar, la ieșirea standard poate fi scris (de exemplu, prin intermediul comenzii echo) orice tip de cod HTML, acesta fiind interpretat de către browser.

Pe lângă manipularea conținutului paginilor de web, PHP poate trimite headere HTTP pentru autentificare, seta cookie-uri sau redirecționa utilizatorii. Mai mult, cu ajutorul bibliotecilor externe de funcții poate parsa fișiere XML, crea și manipula imagini, animații Shokwave Flash, PDF-uri sau se poate conecta la un server de mail, iar acestea sunt doar câteva din funcțiile pe care le poate îndeplini.

Fig.4 Interpretorul-PHP [15]

Interpretorul PHP parcurge documentul accesat până în momentul în care întâlnește un marcaj de deschidere care indica faptul că textul care urmează trebuie interpretat ca fiind cod PHP. în continuare, textul este interpretat ca fiind cod PHP până în momentul în care este întâlnit marcajul de închidere. Întreg textul care nu este interpretat ca fiind cod PHP este furnizat la ieșire în forma în care a fost primit ca intrare de către interpretor. Exista mai multe marcaje care indica începerea unei secvențe de cod PHP, dar doar doua dintre ele sunt folosite de obicei. Daca dorim ca documentul să respecte specificațiile XML, atunci singura posibilitate de inserare a codului PHP este folosirea unei secvențe de tipul:

Cea de-a doua posibilitate este utilizarea marcajului <SCRIPT> într-o manieră asemănătoare celei folosite pentru includerea de script-uri JavaScript. Sintaxa este următoarea:

Este permisă "iesirea" și "intrarea" în "modul PHP" de oricâte ori este necesar în pagină.Aceasta este util când se lucrează cu texte de mari dimensiuni.Pentru ca instrucțiunile PHP să fie interpretate corect, acestea trebuie separate prin caracterul ';’. [16]

1.4.2 Crearea scripturilor PHP

Pentru crearea scripturilor PHP este necesar un editor de texte obșnuit, deși există și editoare specializate. Totuși, dacă folosiți un instrument diferit de Notepad, trebuie să luați măsuri pentru a salva scriptul dumneavoastră sub formă de document text, în caz contrar, fișierul script conține informații de formatare care vor deruta serverul PHP. Numele fișierului trebuie să fie alcătuit numai din caractere minuscule, cifre și liniuțe. Utilizarea spațiilor și a altor caractere este interzisă. Extensia numelui fișierelor trebuie să fie *.php. Fiecare script PHP include două linii, care indică serverului că textul cuprins între acestea este format din instrucțiuni PHP.

Practic aceste linii pot fi asimilate copertelor unei cărți, care păstrează unitatea programului PHP.

Scripturile PHP execută următoarele operații elementare: preluarea datelor de la utilizator, prelucrarea acestor date, obținerea accesului la datele stocate pe server, prelucrarea

datelor stocate pe server și afișarea datelor. Scripturile PHP sunt formate din instrucțiuni, iar cea mai simplă instrucțiune PHP este cea de afișare a unui text în browser.

Este de notat diferența cu alte limbaje script CGI scrise în limbaje precum Perl sau C: în loc de a scrie un program cu o multitudine de linii de comandă afișate în final într-o pagină HTML, veți scrie o pagină HTML cu codul inclus pentru a realiza o acțiune precisă.

Codul PHP este inclus între tag-urile speciale de început și de sfârșit care permit utilizatorului să treacă din "modul HTML" în "modul PHP".

Față de alte limbaje script, precum Javascript, codul se execută pe serverul Web, nu în navigator(client Web). În consecință, PHP poate obține accesul la fișiere , baze de date și alte resurse inaccesibile programului JavaScript. Acestea conțin bogate surse de conținut dinamic care atrag vizitatorii. [17]

Dacă pe serverul Web se află un script similar, clientul nu va primi decât rezultatul execuției scriptului, fără a avea nici o posibilitate de acces la codul care a produs rezultatul. Vă puteți configura serverul de Web să prelucreze (analizeze) toate fișierele HTML ca fișiere PHP. Astfel nu există nici un mijloc de a distinge paginile care sunt produse dinamic de paginile statice.

Limbajul PHP posedă aceleași funcții ca alte limbaje permițând să se scrie scripturi, să colecteze date și să genereze dinamic, pagini web sau să trimită și să primească cookies.

Marea calitate și cel mai mare avantaj al limbajului PHP este suportul cu un număr mare de baze de date. Realizarea unei pagini web dinamice cu o bază de date este extrem de simplu.

In lumea reala, paginile deservite de un server web sunt de cele mai multe ori modificate înainte de a fi transmise către clienți. Exista situații când paginile cerute nici nu exista fizic pe calculatorul server și cu toate astea ele sunt construite și deservite la cerere.

Acest lucru este posibil grație unor module sau aplicații adiționale care funcționează împreuna cu aplicația de server web. Unul din aceste module este PHP.

Limbajul PHP are de asemenea suport pentru diverse servicii server utilizând protocoale precum IMAP, SNMP, NNTP și POP3.

Fig. 5Deservirea unei pagini statice,

fără intervenția interpretorului PHP

1.5 Serverul HTTP Apache

Apache este un server HTTP de tip open source. Apache a jucat și joacă un rol important în dezvoltarea webului, fiind folosit în prezent în circa 50 % din paginile web.

Apache este un server web cu o contribuție notabilă la dezvoltatea Internetului (world wide web). Apache a reprezentat prima alternativă viabilă Corporation, și a evoluat rapid în funcționalitate și performanță ca un rival competitiv pentru alte servere web bazate pe Unix.

Apache este dezvoltat de o comunitate deschisă de programatori sub emblema Apache Software Foundation. Aplicația este disponibilă pentru o mare varietate de sisteme de operare incluzând:Unix, FreeBSD, Linux, Solaris, Novell, NetWare, Mac OS X, Microsoft Windows si OS/2.

Serverul Apache este caracterizat ca fiind un software gratuit și open source, acesta făcând ca, începând din aprilie 1996, el să fie cel mai popular server HTTP. Cu toate că în noiembrie început să piardă din cota de piață, în aprilie 2008. Apache stătea încă la baza a peste 50 % din siturile web.

Prima versiune a serverului a fost creată de Robert McCool, care la vremea aceea era implicat în proiectul National Center for Supercomputing Applications, cunoscut pe scurt ca NCSA HTTPd. A doua versiune a serverului a fost o rescriere substanțială, de data aceasta punându-se accentul pe crearea unui layer prioritar (Apache Portable Runtime) și a suportului de module.

Apache suportă o mare varietate de module care îi extind funcționalitatea, acestea variază de la server side programming și până la scheme de autentificare. Câteva limbaje suportate sunt: Perl, Python, Tcl si PHP.

Ca alte module putem enumera : SSL si TLS support (mod_ssl), un modul  proxyun, modul de rescriere URL (cunoscut ca un motor de rescriere mod_rewrite), custom log files (mod_log_config) și suport de filtrare (mod_include și mod_ext_filter). O altă calitate a serverului Apache este virtual hosting (găzduirea virtuală), care constă în posibilitatea de a găzdui mai multe situri simultan pe același server.

Principalul competitor al serverului Apache este Microsoft Internet Information Services (IIS), urmat de Sun Java System Web Server al companiei Sun Microsystems și multe altele, cum ar fi Zeus Web Server.

Apache este folosit de unele din cele mai mari site-uri din lume. Astfel, motorul de căutare folosit de Google folosește o versiune modificată de Apache numită Google Web Server (GWS), inclusiv Wikipedia rulează tot pe un server Apache. [18]

Caracteristica Apache Portable Routine(APR) optimizează capabilitățile precum administrarea proceselor pentru fiecare sistem de operare, dar permite serverului propriu-zis să ignore distincțiile specifice fiecărei platforme. Acest lucru a îmbunătățit performanța și stabilitatea implementărilor Windows, prin eliminarea emulatorului. Mai mult APR este accesibil și dezvoltatorilor Web care scriu programe multi-platforme în C, care este mai rapid decât limbajele interpretative, precum PHP și Perl, folosite de obicei pentru dezvoltare Web.

API-ul deschis a permis dezvoltatorilor să scrie diferite module care i-au schimbat comportamentul. Dacă serverului îi lipsește o funcție de care are nevoie un sit, sunt mari șanse ca undeva să fie disponibil un modul plug-in. [17]

Severul Apache e utilizat datorita avantajelor de mai jos:

Freeware;

Ușor de instalat;

Ușor de configurat;

Versiune precompilata pentru orice fel de platforma;

Foarte rapid;

Oferă suport pentru autentificarea userilor;

Permite implementare “multihomed” si “virtual servers”;

Securitate mai buna decât alte servere WEB;

Cel mai puternic motiv pentru folosirea acestui server este faptul că poate rula atât sub Unix cât și sub Windows după preferințele fiecăruia.

Serverele Web au ca funcționalitate de bază recepționarea de cereri anonime de la clienți și furnizarea de informații într-o manieră dorită a fi eficientă și rapidă. De fapt un server Web este un daemon care acceptă conexiuni conforme protocolului HTTP, răspunzând cererilor recepționate de la clienți. Pentru a asigura servicii HTTP, serverul Apache trebuie să fie instalat în sistem (în mod uzual, fiind vorba de un pachet RPM în Linux sau de un program executabil .exe în Windows), iar daemon-ul httpd pornit. Apache este un sistem modular, alcătuit dintr-un server de bază și mai multe module care sunt încărcate dinamic într-un mod similar cu funcționarea modulelor din nucleul Linux.

În anumite cazuri, este necesar să se restricționeze accesul la anumite documente, prin intermediul autentificării prin nume de utilizator și parolă sau în funcție de adresa calculatorului clientului Web.[18]

Pentru autentificarea utilizatorilor, vom parcurge doi pași:

se creează un fișier conținând numele și parolele utilizatorilor care vor avea acces la anumite date de pe serverul Web(în particular Apache)

se configurează serverul pentru a seta care resurse vor fi protejate și care sunt utilizatorii care au permisiunea accesării lor, după introducerea unei parole valide.

Apache poate fi configurat cu ajutorul interfeței grafice apacheconf (Apache Configuration Tool). Fișierul de configurare principal este http-conf și este de obicei localizat în directorul /etc/httpd (în versiunile de Linux sau Unix).

Configurarea serverului se poate realiza fie prin fișierul httpd-conf, fie prin .htacces, indicând o zonă protejată, de obicei în funcție de directoarele dorite a fi accesate pe bază de autentificare. Fișierul .htaccess va fi stocat în directorul asupra căruia dorim să modificăm comportamentul implicit al serverului Web. Înainte de a modifica maniera de autentificare din fișierul .htaccess, administratorul serverului Apache va specifica în httpd.conf că autentificările să se realizeze via .htaccess.

De asemenea, Apache oferă posibilitatea de a servi mai multe site-uri Web simultan, altfel spus, găzduirea virtuală (virtual hosting). Există două metode de implementare a găzduirii virtuale: prima bazată pe nume și a doua bazată pe adrese IP. Mașinile virtuale bazate pe adrese utilizează adresa IP a conexiunii pentru a determina mașina virtuală corectă. Astfel pentru fiecare găzduire virtuală bazată pe nume, determinarea mașinii virtuale se face pe baza numelui acestuia.

Găzduirea virtuală bazată pe nume este mai simplu de implementat, și este recomandată utilizarea acesteia. Pentru a utiliza serviciul de găzduire virtuală, trebuie mai întâi stabilite adresa IP-ului și portul pentru serverul care va accepta cereri pentru respectiva mașină virtuală. [18]

1.6.1 Baze de date

Ce este o bază de date ?

O bază de date, reprezintă o modalitate de stocare a unor informații și date pe un dispozitiv de stocare, cu posibilitatea extinderii ușoare și a regăsirii rapide a acestora.

În acest sens, bazele de date pot fi create și menținute manual (un exemplu ar fi fișele de evidență a cărților dintr-o bibliotecă, așa cum erau folosite cu ani în urmă) sau computerizat așa cum sunt majoritatea bazelor de date în momentul de față. O definiție într-un sens mai restrâns a unei baze de date este următoarea:

O bază de date este o colecție de date centralizate, creată și menținută computerizat, în scopul prelucrării datelor în contextual unui set de aplicații. Prelucrarea datelor se referă la operațiile de introducere, ștergere, actualizare și interogare a datelor [19].

Simple colecții de fișe (documente pe hârtie) sau fișiere de date care conțin date, dar nu permit operații de interogare nu sunt considerate baze de date. De exemplu, datele memorate în fișiere pe disc într-o aplicație de calcul tabelar (Microsoft Excel) sau documentele memorate de un editor de texte (ca Microsoft Word) nu sunt considerate baze de date.

Orice bază de date are următoarele proprietăți implicite:

Baza de date este destinată, construită și acoperită de date despre un domeniu bine precizat.

Ea are un grup de utilizatori și se adresează unui anumit grup de aplicații

Baza de date este o colecție logică coerentă de date ce are cel puțin un înțeles

O bază de date prezintă câteva aspecte ale lumii reale creând orizontul propriu.

Schimbările orizontului sunt reflectate în baza de date. Față de vechile metode de înregistrare a datelor privind diferite activități pe fișe (documente scrise) sau chiar în fișiere pe disc, sistemele de baze de date oferă avantaje considerabile, ceea ce explică extinsa utilizare a acestora.

Câteva dintre avantajele oferite sunt:

• Controlul centralizat al datelor, putând fi desemnată o persoană ca responsabilă cu administrarea bazei de date

• Viteză mare de regăsire și actualizare a informațiilor

• Sunt compacte: volumul ocupat de sistemele de baze de date este mult mai redus decât documetele scrise

• Flexibilitatea ce constă în posibilitatea modificării structurii bazei de date fără a fi necesară modificarea programelor de aplicație

• Redundanță scăzută a datelor memorate, care se obține prin partajarea datelor între mai mulți utilizatori și aplicații.

În sistemele de baze de date, mai multe aplicații pot folosi date comune, memorate o singură dată. De exemplu, o aplicație pentru gestionarea personalului dintr-o universitate și o aplicație pentru gestionarea rezultatelor la examene din aceeași universitate care folosește o singură bază de date, pot folosi aceleași informații referitoare la structurarea facultăților.

• Posibilitatea introducerii standardelor privind modul de stocare a datelor, ceea ce permite interschimbarea datelor între organizații

• Menținerea integrității datelor prin politica de securitate (drepturi de acces diferențiate în funcție de rolul utilizatorilor), prin gestionarea tranzacțiilor și prin refacerea datelor în caz de funcționare defectuoasă a diferitelor componente hardware sau software.

• Independența datelor față de suportul hardware utilizat. Sistemul de gestiunea a bazelor de date oferă o vizualizare a datelor, care nu se modifică atunci când se schimbă suportul de memorare fizic, ceea ce asigură imunitatea structurii bazei de date și a aplicațiilor la modificări ale sistemului hardware utilizat.

1.6.2MySQL

MySQL este un sistem de gestiune a bazelor de date relațional ,este un server de baze de date disponibil sub o licentă Open Source, dar există și sub licențe comerciale. care ofera fiabilitate si multe avantaje.

Fig.6 logo MySQL [20]

Frumusețea serverului MySQL este simplitatea sa fundamentală. Administrarea bazei de date se poate folosi o multitudine de utilitare in linia de comanda sau interfetelor grafice MySQL Administrator și MySQL Query Browser. Un alt instrument de management foarte popular este phpMyAdmin care este o aplicația gratuită, scrisă în PHP.[19]

MySQL realizeaza cu usurinta importarea diverselor baze de date si exportarea sub forma fisierelor sql. Tranzacțiile nu sunt parte a tabelelor implicite(ISAM) ale lui MySQL, dar sunt incluse două tipuri noi de tabele . Berkley DB(BDB) și InnoDB , care au fost dezvoltate de alte firme.

Administratorii de firme și dezvoltatorii de baze de date au ajuns la concluzia că MySQL are o dezvoltare energică și loială, ca să nu mai menționăm reputația câștigată cu trudă, de bază de date sigură.

MySQL operează în baza unui model client/server. Orice mașină care dorește să proceseze interogări asupra unei baze de date MySQL trebuie să ruleze MySQL server, care este responsabil de tot traficul de tip intrări/ieșiri(incoming/outgoing) cu baza de date.

Acest client poate fi un simplu script PHP care poate trimite o cerere catre baza de date prin intermediul serverului MySQL sau chiar clientului mysql. Clientul mysql este o interfață interactivă pentru transmiterea de comenzi către server.

Modelul de securitate folosit de MySQL se bazeaza pe nume de utilizator, parolă, nume server( hostname ) sau adresa de IP și privilegii, fiind similar celui generic folosit de sistemele Unix. Prin privilegii se inteleg în cazul MySQL operațiunile ce vor fi permise asupra bazei/bazelor de date, tabelelor sau indecșilor, cum sunt de exemplu SELECT, INSERT, UPDATE, DELETE, CREATE, DROP.

Datele sunt obiectul celor mai multor operații de prelucrare, iar sistemele de gestiune a bazelor de date furnizează cele mai complexe și puternice facilități pentru lucrul cu datele.

O bază de date este un program ce poate stoca o cantitate foarte mare de informații și o poate organiza într-un format accesibil în mod direct sau de către un alt program.

PHP permite lucrul cu un număr mare de funcții MySQL. În PHP există funcții pentru toate operațiile executate asupra bazelor de date MySQL. Cele mai importante funcții sunt:

mysql_connect() –functie folosită pentru crearea unei conexiuni la serverul de baze de date MySQL.

Exemplu cod php de conectare cu MySQL:

Funcția mysql_connect se conectează la MySQL folosind ca parametri adresa serverului unde rulează MySQL (dacă îl aveți instalat pe propriul calculator aceasta este localhost), user-ul ( dacă îl aveți instalat pe propriul calculator aceasta ar trebui să fie root) și parola (dacă îl aveți instalat pe propriul calculator aceasta ar trebui să nu existe).

Capitolul II. Site-ul de prezentare Web:Haidu Music

Proiectul meu de diplomăse dorește a fiun site web si o aplicație web care să fie folosită de pasionati de muzica șipe desupra usureaza munca administratorului in administrare si intretinerea sitului.

Spre deosebire de un site clasic, în care potențialii clienți mai intră și din întâmplare sau din curiozitate, pe web șansa ca cineva să acceseze direct pagina este extrem de mică (pornind de la premisa că nu a auzit niciodată de ea). Pentru a avea vizitatori, site-ul trebuie înscris la motoare de căutare și directoare web. Se poate apela și la publicitatea pe internet – bannere publicitare afișate pe diverse portaluri sau la marketingul prin e-mail. Bineînțeles că mai sunt si modalitățile clasice de promovare: spoturi TV sau radio, inserări în diverse publicații, etc.

Informațiile nu trebuie lăsate să se „învechească”. Vizitatorii trebuie să vadă că au în față un site dinamic, cu conținut mereu proaspăt, secțiuni cu noutăți, oferte speciale, concursuri sau alte facilități asemănătoareoare îi va determina pe mulți să se întoarcă cu plăcere la situl de muzică preferat.

Aplicația este foarte buna pentru pasionați de muzică deoarece tot timpul vor fi la curent cu toate noutățile din muzică.Este un bun mijloc prin care pot să asculte muzică preferată si sa voteze melodiile preferate.

2.1. Interfața sitelui de prezentare Haidu Muzic

Situl de prezentare Haidu Muzic conține 4 opțiuni majore:

Acasă

Despre noi

Albume

Vot

Fig.10 Pagina acasă

Interfața aplicației se dorește să fie cât mai eficientă dar în același timp să aibă un aspect cât mai prietenos și mai ușor de folosit de către utilizatorii acesteia.folosind cele mai noi tehnologii HTML 5, aceasta poate fi gazduida si pe Raspbbery Pi.

Acasa

La accesarea opțiunii “Acasă” prim planul sitului, fiind prima pagină pe ea sunt afișate imaginile formațiilor si vizitatorul sitelui are posibilitatea de a vota artistul sau formația preferată

In prima pagină se poate observa topul muzical nouțile și viitoarele melodii.

Vizitatorul poate să iși dea cu părerea, situl avand o ramura de sondaj de opinie,pe această pagină se poate observa statistica, deoarece vizitatorul poate sa și voteze.

:

Fig.11Pagina acasă

Despre noi

Despre noi este secțiunea in care vizitatorul poate afla informații despre istoria despre casa de discuri si datele de contact associate lor.Mai pot să afle informații despre istoricul casei de discuri ,când a fost inființată.

Fig.12 Pagina Despre noi

Albume.

Fig.13 Pagina Albume

Opțiunea“Albume“sunt afișate toate albumele existente care aparțin de această casă de discuri si utilizatorul avand posibilitatea sa caute un album după numele albumului.

Vizitatorul situ-lui poate să vadă albumele care aparțin unui anumit gen selectand numele genului dorit selectând din coloana stângă.. La optiunea” Categorie” se introduce genul preferat musical iar la “introduceți nume album” se va scrie numele albumui căutat.

După ce se va da clic pe căutare se va afișa rezultul căutări.

Vot

Opțiunea Vot” este accesată pentru ca utilizatorul sa voteze melodia preferată.

Fig.14 Pagina Vot

Vizulizare Album/Melodie

Fig.15 Pagina vizualizare album melodie

Opțiunea “ Vizualizare Album/Melodie” are rolul ca vizitatorul să poată vizualiza informatiile despre album cine canta melodia dorita adică numele canărețului si numele compozitorului.

In partea dreaptă apare meniul in care se poate asculta cantecul sau cantecele.

Top Muzical

Topul Muzical sunt prezentate melodiile in ordine descrescătoare in urma voturilor effectuate de vizitatori.Topul se bazează pe vizitatori, clasamentul realizanduse pe baza voturilor.

Fig.16 Pagina topul muzical

Statististică genuri favorite

Opțiunea “Statististică genuri favorite” este utilizată pentru vizualizarea procentajului pe baza voturilor vizitatorilor. Pe partea stăngă sunt afișate genurile muzicale iar pe partea dreapta procentajul.

Fig.17 Statistică genuri favorit

Părerea vizitatorului

În opțiunea “Părerea vizitatorului” se pot introduce numele utilizatorului adresa de email adreasa personală (daca se dorește) si mesajul vizitatorului.După ce scrie mesajul in chenarul (mesajul tău) se apasă trimitere sau dacă se răzgîndește apasă pe anulare.

.

Fig.18Părerea vizitatorului

2.2. Partea de administrare a sitului Haidu Music

Partea de administrare a sitului Haidu Muzic conține patru categorii;

-Acasă

-Categorii

-Albume

-Despre noi.

Acasă

Fereastra ”Acasă” este foarte importantă, deoarece cu ajutorul ei avem posibilitatea de a selecta parerea utilizatorilor și de a adauga uilizatori noi.

Fig.19Pagina acasă

Părerea Vizitatorilor

In această ferastră administratori vizualizează părerile primite și in funcție de mesajul primit ei pot să răspunda la mesajul primit alegand opțiunea”reply”și se deschide o fereastră noua unde administratorul poate sa raspundă și prin alegearea optiuni trimitere răspunsul va fi trimis pe email-ul vizitatorului.

Fig.20Pagina Părerea Vizitatorilor

Adăugare utilizator

In meniul Adăugare Utilizator ,se adaugă un utilizator nou pe partea de administrare a situ-lui complectand câmpurile :

Fig.21Adăugare utizator nou

În această imagine se poate vedea cum se pot introducele datele noilor administratori.

La secțiunea unde se cere (Nume) se vatrece numele noului administrator mai in jos avem (USERNME) este numele dorit de administrator si mai jos este (password)adică parola aleasă de noul administrator.tot odată din acest meniu se pot șterge din numarul de administratori curenți.

Categorii

In secțiunea categorii se fac procese pe genurile muzicale se adaugă albume noi și se selectează din ce categorie muzicală fac parte.Tot din această secțiune se pot șterge melodiile mai vechi.

Adăugare Gen Muzical

Fig.22Adăugare gen muzical

In această categorie se adaugă și edita noi genuri muzicale ,după un anumită perioadă melodiile se pot șterge

Vezi categorii

In această secțiune se vizulizează toate genurile existente si există posibilitaea de editare sau ștergere .

Fig.23Pagina Categorii

Albume

In această secțiune administratori pot să editeze albumele și să adauge melodii sa vizualizeze albumele existente sau pot ca să le șteargă.Aici se ține controlul asupra melodiilor și albumelor.

Album nou

Fig.24Pagina Album nou

In această pagină se poate introduce un album nou prin introducerea urmatorelor informatii:numele albumului ,categoria albumului ,numele formației ,al compozitorului o descriere amplă si daca este totul aranjat se selecteză adaugă album.,daca nu se anulează intregul proces cu anulează.Aici administratori incarcă albumele.

Vizualizare albume

. In această parte administratori pot sa vizualizeze toate albumele ,să le modifice sau să le șteargă.In această secțiune au acces numai administratori .

Fig.25 Pagina Vizulizare Albume

Despre Noi

Aceată secțiune permite modificarea datelor despre firmă cum ar fi istoricul și contactul.Modificările nu se pot face numai de către administratori sitului Haidu Muzic.

Istoricul

Fig.26Istoricul Sitului

Istoricul afișază date despre compania de muzică Haidu Muzic.In acestă ferastră este un editor HTML ExtJS foarte avansat care ușurează editarea acestor informații.

Contact

Contact- afișază date te contact al companiei de muzica Haidu Muzic.In acestă ferastră este un editor HTML ExtJS foarte avansat care ușurează editarea acestor informații.

Fig.267Date de contact

Capitolul III. Proiectarea aplicației

Pentru proiectarea aplicației am folosit cele mai uzuale tehnolgii din ziua de azi precum HTML și CSS în combinație cu ExtJS și PHP, pentru a crea o site de prezentare dinamic ușor de folosit de către vizittori sitului . De asemenea am folosit cunoscutul motor de baze de dateMySQL.

Dezvoltarea și testarea aplicației web am realizat-o utilizând serverul web Apache.

3.1. Structura bazei de date

Aplicația folosește o bază de date pentru stocarea pe termen lung a datelor. Aceasta este folosită pentru a stoca albume informații despre artisti,topul muzical și statistica melodiilor si manajementul administratorilor

.

Fig.28 Structura bazei de date

Tabela album conține informații despre albume și este formată din câmpurile: id albumului,id categoriei,nume album,nume artist.nume compositor,calea catre imagine pe server.

Fig.29 Tabela Abum

Tabela categorie conține informații despre genurile muzicale fiind format din campurile:,id categorie,nume,descriere și imagine .

Fig30. Tabela Ctegorie

Tabela Feedback conține informații despre parea vizitatorilor sitului fiind formată din câmpurile:id-ul păreri, numele vizitatorulu,i emai-lul, adresa,starea.

Fig 31 Tabela Feedback

Tabela Istoric conține informații despre istoria sitului si date despre contact fiind alcătuită din câmpurile istoric și contacte.

Fig.32 Tabela istoric.

Tabela melodii conține informații despre melodii fiind alcătuită din:numele cântărețului ,albumului,scriitorului și al compozitorului.

Fig.33 Tabela genuri

Tabela administratori conține informațiile administratorilor fiind alcătuită din numele administratorilor username si parolă.

Fig.34 Tabela Administratori

Tabela voturi conține statistica voturilor date de vizitatori sitului fiind alcătuită din nume ,voturi și puncte.

Fig.35 Tabela Voturi

3.2. Descrierea procedurilor și codurile sursă

Sitetul de prezentare Haidu Music

Acasa

În această pagină am implementat un slideshow cu imagini folosi librăria SlideJS codul implement este ilustrat mai jos:

Fig.36 Codul Pagini Acasă

In aceasta pagină se afișează cele mai noi melodii adăugate in partea stângă jos pentru aceasta sa folosit PHP sa citit din baza de date iformațiile legate de cele ai noi melodii și afișarea lor intr-un table HTML codul ilustrat mai jos:

Fig.37 Codul Pagini Acasă

Se afișează o statistică pe scurt a melodiilor preferate de vizitatori sitului pentru realizarea lui sa citit aceste informații din baza de date și cu ajutorul atributelor HTML și a modificatorilor de stil CSS sa relizat afișarea sub formă de bare de diagramă ,codul este ilustrat mai jos :

Fig.38 Codul Pagini Acasă

Despre noi

În această pagină am relizat o navigare prin meniul din partea stangă a pagini de unde se poate allege sectiunea “Istoricul” sau sectiunea ‘Contact” prin alegerea uneia dintre cele doua sectiuni se afișează informția coresunzătoare din baza de date codul urmator ilustrează extragerea castor informații:

Fig.39 Codul Pagini Pagini Depre Noi

Albume

În această pagină am implementat navigarea între genurile albumelor in partea stîangă prin citirea acestor categorii din baza de date codul urmator ilustrază această implementare:

Fig.40 Codul Pagini Albume

Se afișează albumele din informția din baza de date și ele sunt afișate sub formă de tabel și sa implementat paginarea albumelor și posibilitatea căutari după numele albumelor codul se ilustrează in tabelul următor:

Fig.41 Codul Pagini Albume

Vot

Se afișează lista cu melodii pe care vizitatrul sitului le poate vota ,codul creat de mine este ilustrat mai jos:

Fig.42 Codul Pagini Vot

Vizulizare Album/Melodie

În această pagină am realizat afișarea detaliilor albumelor și posibilitatea ascultări melodiilor cre aparține de albumul selectat codul implementat de mine este ilustrat apare in tabelul următor:

Fig.43 Codul Pagini Album Melodie

Top Muzical

În această pagină am implementat afișarea celor mai votate melodii codul din tabelul următor ilustrează cum a fost create această pagină:

Fig.44 Codul Pagini Topul Muzical

Statististică genuri favorite

În aceată freastra am implementat afițarea statisticii in tabel următor este prezentat codul principal folosit:

Fig.45 Codul Pagini Statistică Genuri Favorit

Părerea vizitatorului

În această pagină am creat un formular HTML pentru introducea părerilor a vizitatorilor sitului ,codul următor realizează implementarea creată de mine:.

Fig.46 Codul Pagini Părerea vizitatorului

Partea de administrare a sitului Haidu Music

Părerea Vizitatotorilor

In această ferastră am implementat posibilitatea vizualizări părerilor primite și posibilitatea la raspuns pe email a mesajului primit.

Codul următor ilustreză modul în care a fost creata această fereastra:

Fig.47 Codul Pagini Părerea Vizitatorilor

Adăugare utilizator

În această fereastră există posibilitatea creerii unui admninistator nou în baza de date, folosind câmpurile urmatoare: nume ,nume utilizator și parolă.

Codul următor ilustreză modul în care a fost creata această fereastra:

Fig.48 Codul Pagini Adăugare utizator nou

Categorii

În această fereastră se realizează managementul categoriilor de gen care există in această aplicație.

Adăugare Gen Muzical

În această fereastră se realizează adăugarea unui nou gen muzical in această aplicație.

Codul următor ilustreză modul în care a fost creata această fereastră:

Fig.49 Codul Pagini Adăugare Gen Muzical

Vezi categorii

În această fereastră am realizat un tabel HTML îin care este afișat informații despre genurile existente si am realiuzat optiune de editare stergere agenurilor din el.

Codul următor ilustreză modul în care a fost creata această fereastră:

Fig.50 Codul Pagini Categorii

Albume

În această fereastră se realizează managementul albumelor.

Codul următor ilustreză modul în care a fost creata această fereastră:

Fig.51 Codul Pagini Album nou

Despre Noi

În această fereastră se realizează managementul informațiilor care apare în sectiunea despre noi si contact .

Codul următor ilustreză modul în care a fost creata această fereastră:

Fig.52 Codul Pagini Despre Noi

3.3. Dezvoltări ulterioare

Cum lumea este în continuă mișcare și schimbare, sunt conștient că la un moment dat, acest site își va atinge apogeul după care va urma o perioadă în care informațiile furnizate de către acesta nu vor mai fi suficiente și vor fi necesare cîteva îmbunătățiri și adăugiri de facilități și opțiuni.

Prima dezvoltare care mi s-ar părea utilă ar fi prezentarea informatiilor despre formțiile care sunt în contractual acestei case de discuri.

Pentru o publicitate cât mai bună se poate integra acest site cu platformele de socialiazare prin prezentrea informațiilor de pe aceste platforme in legatură cu aceasta casă de discuri.

Pe viitor in această aplicație s-ar putea adauga functionalitatea de cumpărare albumelor artiștilor care apartin acestei case de discuri si posibilitatea inchirieri albumelor lor.

Pentru ca trăim intro lume plină de mișcare pe viitor acest site ar trebui sa fie optimizat pentru toate platformele mobile si toate dimensiunile prin refacerea interfeței sitului prin folosirea metodologiei “responsive design”

CONCLUZII

Lucrarea mea descrie o aplicație informatică de prezentare , creată în special pentru promovarea casai de discuri Haidu Music.

Haidu Muzic are o paletă de funționalități bogată datorită umătoarelor caracteristici și funcționalități:

Situl conține foarte multe informații legate despre casa de discuri Haidu Music care sunt prezentate intr-o manieră foarte intuitivă care ajuta pe vizitatori sitului la găsirea informatiilor interesante.

Partea de administrare este de mare ajutor pentru administrator usurează foarte mult timpul de administrare si interfața este foarte intuitivă și foarte usor de folosit.

În acest proiect am folosit cele mai tehnologii și mai răspândite cum ar fi :PHP,HTML 5 , ExtJS,MySQL

În plus scopul principal urmărit prin această aplicație web a fost de a asigura și promova casa de discuri Haidu Muzic si ușurarea administrari sitului.

În concluzie, în dezvoltarea aplicației am folosit cele mai noi și mai fiabile tehnologii existente la ora actuală, fiecare dintre ele fiind descrisă în lucrare, alături de motivarea utilizării ei, dorind ca acesta să devină un site foarte cunoscu in randul iubitorilor de muzică.

Această casă de discuri vine in ajutorul iubitorilor de muzică prezentându-le tot timpul noutați in domeniul muzical,actualizări despre artiști lor preferați.

BIBLIOGRAFIE

[1] Felea, M., Dezvoltarea comerțului electronic în condițiile globalizării, Revista

Amfiteatrul Economic, București, nr.17, 2005

[2] PHP and MySQL Web Development, Sams Publishing, 2001 – Luke Welling, Laura Thomson

[3] Introducere in Internet, Editura Teora, București, 1995- Popa S.

[4] Proiectarea bazelor de date relaționale, Editura Sitech ,1997-Giurgițeanu N.

Programarea în Web, Jamsa Press, 1996 – Kris Jamsa, Suleiman Lalani, Steve

[5] http://revistaie.ase.ro/content/18/chilom.pdf

[6] http://ro.wikipedia.org/wiki/HTML5

[7]https://www.siteconstruct.ro/diferente-html5-fata-de-html4/

[8] http://marianpc.eu/2011/01/20/ghidul-de-la-a-la-z-in-css/

[9] http://ie354c2.3x.ro/Laborator/css.pdf

[10] RICK DARNELL, Totul despre HTML 4, Editura Teora, 2002

[11] SABIN BURAGA, Proiectarea siturilor Web. Design si functionalitate, Editura Polirom, 2002

[12] SABIN BURAGA, VICTOR TARHON-ONU, }TEFAN TANASA, Programare Web in Bash si Perl, Editura Polirom, 2002

[13] http://www.slideshare.net/MomentumDesignLab/extjs-presentation/download

[14]http://de.wikipedia.org/wiki/Ext_JS

[16]Colin Ramsay, „Learning Ext JS”, Ed. Packt publishing, 2008.

[17] http://www.phpromania.net/manual/php/preface.html

[18] http://www.web-design-wiki.com/php-tutorial.html (imagine)

[19] http://www.etutoriale.ro/articles/16/1/Despre-PHP/

[20] http://ro.wikipedia.org/wiki/Apache_(server)

[21] http://httpd.apache.org/

[22]MySQL Cookbook, Paul DuBois,O'Reilly Media; Second edition (January 27, 2007)

[23] http://en.wikipedia.org/wiki/MySql

BIBLIOGRAFIE

[1] Felea, M., Dezvoltarea comerțului electronic în condițiile globalizării, Revista

Amfiteatrul Economic, București, nr.17, 2005

[2] PHP and MySQL Web Development, Sams Publishing, 2001 – Luke Welling, Laura Thomson

[3] Introducere in Internet, Editura Teora, București, 1995- Popa S.

[4] Proiectarea bazelor de date relaționale, Editura Sitech ,1997-Giurgițeanu N.

Programarea în Web, Jamsa Press, 1996 – Kris Jamsa, Suleiman Lalani, Steve

[5] http://revistaie.ase.ro/content/18/chilom.pdf

[6] http://ro.wikipedia.org/wiki/HTML5

[7]https://www.siteconstruct.ro/diferente-html5-fata-de-html4/

[8] http://marianpc.eu/2011/01/20/ghidul-de-la-a-la-z-in-css/

[9] http://ie354c2.3x.ro/Laborator/css.pdf

[10] RICK DARNELL, Totul despre HTML 4, Editura Teora, 2002

[11] SABIN BURAGA, Proiectarea siturilor Web. Design si functionalitate, Editura Polirom, 2002

[12] SABIN BURAGA, VICTOR TARHON-ONU, }TEFAN TANASA, Programare Web in Bash si Perl, Editura Polirom, 2002

[13] http://www.slideshare.net/MomentumDesignLab/extjs-presentation/download

[14]http://de.wikipedia.org/wiki/Ext_JS

[16]Colin Ramsay, „Learning Ext JS”, Ed. Packt publishing, 2008.

[17] http://www.phpromania.net/manual/php/preface.html

[18] http://www.web-design-wiki.com/php-tutorial.html (imagine)

[19] http://www.etutoriale.ro/articles/16/1/Despre-PHP/

[20] http://ro.wikipedia.org/wiki/Apache_(server)

[21] http://httpd.apache.org/

[22]MySQL Cookbook, Paul DuBois,O'Reilly Media; Second edition (January 27, 2007)

[23] http://en.wikipedia.org/wiki/MySql