Realizarea Unui Magazin Virtual

UNIVERSITATEA BUCUREȘTI

FACULTATEA DE MATEMATICĂ ȘI INFORMATICĂ

SPECIALIZAREA INFORMATICĂ

Lucrare de diploma

MAGAZIN VIRTUAL

Coordonator științific

Conf. dr. Cristian Kevorchian Absolvent

Alexandru Chirvasa

Bucuresti

2016

Introducere

În această lucrare este prezentată o aplicație web, mai precis implementarea unui magazin online, în scopul de a vinde produse. Aplicația are doua componente. Una este destinată utilizatorilor și anume magazinul propriu-zis și cealalta este destinată administratorilor magazinului. Principalele facilități pe care le oferă acest magazine online sunt: pentr utilizatori, căutarea, vizualizarea și posibilitatea de a comanda produse de pe site, iar pentru administratorii de magazin, adăugarea, editarea și stergerea conținutului din magazin.

A fost aleasă această temă, deoarece magazinele online sunt din ce în ce mai utilizate și constituie o compoentă cheie în dezvoltarea unei companii. Un magazin online bine implementat poate aduce valoare adaugata considerabilă unei afaceri.

Lucrarea este structurată în trei capitole. În primul capitol se detaliază tehnologiile folosite în dezvoltarea aplicației, precum și motivele alegerii acestora. Capitolul II reprezintă descrierea detaliată a aplicației web și a modului ei de funcționare. Ultimul capitol reprezintă concluziile trase după dezvoltarea aplicației precum și o serie de propuneri de îmbunătățire a acesteia.

În ultimii ani, internetul a fost supus unor îmbunătățiri semnificative, fapt ce a forțat într-o anumită măsură și dezvoltarea programelor software, dar și a tehnologiilor ce sunt implicate în dezvoltarea aplicațiilor web. Din aceste tehnologii menționăm:

limbajele de script ”client-side”: JavaScript, VBScript, Lua

limbajele de script „server-side”: .NET ASP, JSP, PHP, Perl, Python

Tehnologia AJAX (Asynchronous JavaScript and XML)

Serviciile WEB

Arhitectura MVC

Toate pachetelei softwarei, precum și tehnologiilei implicate în dezvoltarea aplicațiilor web actuale au drept scop augmentareai interacțiuniii cu utilizatoruli într-o manieră facilă, atrăgătoare și intuitivă. Este ceea ce, în limbajuli tehnici, se numește Web 2.0, adică un salt calitativi și cantitativi a vechilor tehnologiii care existau înainte de anul 2003.

CAPITOLUL I – TEHNOLOGII FOLOSITE ÎN APLICAȚIE

PHP, MySQL, HML, CSS, JavaScript

I.1Prezentarea tehnologiilor pe scurt

I.1.1 PHP , unul dintre cele mai importante limbaje de programare server-side și open-source, este disponibil pe toate sistemele de operare, Linux, Windows și respectiv Mac OS X. Sintaxa acetuia este bazată pe limbajele C, Perl și Java și se integrează cu servere web ca Apache, IIS, Zeus, etc. Numele provine din limba engleză, reprezentând un acronim recursiv: Php: HypertextPreprocessor. Limbajul este folosit în special la dezvoltarea aplicațiilor și paginilor web, de obicei înglobat în codul HTML al acestora, dar odată cu lansarea versiunii 4.3.0, acesta se poate utiliza și in modul ”linie de comandă” (CLI), astfel permițând dezvoltarea aplicațiilor independente. De asemenea, PHP poate fi folosit manevrarea bazelor de date sau a fișierelor, crearea de formulare de înregistrare, a listelor dinamice, codificare sau trimiterea de email-uri.

I.1.2 MySQL este ce mai popular sistem de gestiune a bazelor de date open-source la această oră, fiind o componentă importantă a stivei LAMP(Linux, Apache, MySQL, PHP). Totodată poate fi folosită cu ușurință, este flexibilă, de încredere și dispune de o protecție maximă. Dezvoltatorii au pus la dispoziția programatorilor web o varietate mare de provideri de baze de date și au avut grijă să nu încarce în mod excesiv unitatea centrală și memoria. MySQL oferă multă flexibilitate utilizatorului, fiind posibila rularea pe mai multe platforme cum ar fi Linux, Windows, OS/X, HP-UX, AIX sau Netware.

I.1.3 HTML – HyperText Markup Language, este un limbaj de marcare folosit pentru dezvoltarea paginilor web ce vor fi afișsate într-un browser. Este orientat spre prezentarea documentelor text pe o singură pagină, folosind un program de redare specializat, numit agent uilizator HTML, exemplul cel mai elocvent fiind browser-ul. HTML furnizeaza modu prin care conținutul unui document poate fi adnotat cu diferite tipuri de metadata și indicații de redare. Acestea din urmă pot diferi de la mici decorațiuni ale textului, ca de exemplu precizarea faptului ca unele cuvinte trebuie subliniate sau ca trebuie introdusă o imagine, până la hărți de imagini, formulare sau scripturi complicate. Metadatele pot conține informații despre titlul și autorul documentului, informații despre structura documentului și informatii esențiale ce permit legarea documentului de alte documente, formând astfel hyperlink-uri.

I.1.4 CSS (Cascading Style Sheets) este un standard pentru formatarea paginilor web. Stilurile se pot atașa elementelor XML, XHTML și foarte cunoscutului HTML. Acest lucru se poate realiza fie prin utilizarea unor fișiere externe, fie direct în interiorul docmentului prin elementul <style> și/sau atributul style. A fost dezvoltat pentru a separa conținutul unui document, de stilul de prezentare, astfel îmbunătățind accesibilitatea conținutului, oferind mai mult control și flexibilitate în specificare caracteristicilor de prezetare. De asemenea cu ajutorul CSS-ului se poate reduce complexitatea și repetițiile în structura conținutului, cum ar fi webdesign-ul fără utilizarea tabeleleor.

I.1.5 JavaScript este un limbaj de programare orientat pe obiect, rulat de către browser și este bazat pe conceptul prototipurilor. Este folosit pentru a adăuga interacțiune cu utilizatorul prin efecte aplicate elementelor din pagină în funcție de acțiunile generate de utilizator. De asemenea codul Javascript este folosit și pentru validarea datelor înscrise de utilizator în formulare. A fost dezvoltat la început sub numele de Mocha, de către Brendan Eich, primind ulterior numele de LiveScript și în final JavaScript.

I.2 Detalierea tehnologiilor

I.2.1 Mai multe despre PHP

PHP este un limbaj de programare web creat si utilizat de către webdeveloperi. PHP vine de la PHP:Hypertext Preprocessor. Produsul original a fost numit Personal Home Page Tools, și multe persoane încă mai explică astfel acest acronim. Dar pe măsură ce acest limbaj a fost extins și i-au fost adăugate noi funcționalități, un nou nume a fost votat de comunitatea de webdeveloperi. PHP a ajuns la a 7-a generație, numită PHP7.

PHP este un limbaj de programare de partea serverului (”server-side scripting language”) care poate fi integrat în HTML. Unii jurnaliști din domeniul IT l-au numit „limbajul open source ASP” datorită similitudinilor cu acesta, deși această comparație este una greșită deoarece PHP a apărut înaintea ASP-ului. În ultimii ani PHP și JSP au preluat conducerea pe piață iar ASP-ul (și mai nou evoluția sa ASPX) au pierdut cotă din piață, așadar această comparație nu mai este valabilă.

Cele mai cunoscute websiteuri care utilizează PHP sunt:

PHP-ul poate fi considerat o colecție de super-taguri HTML sau de mici programe care rulează în interiorul paginilor web, doar că acest lucru se realizează de partea serverului, înainte de trimiterea paginii către utlizator. De exemplu putem utiliza PHP pentru a adăuga un header și un footer comun tutoror paginilor unui website sau să trimitem date colectate dintr-un form către o bază de date (BD).

PHP-ul nu are nimic de a face cu layouturi, gestionarea eventurilor sau manipularea DOM-ului, sau cu orice legat de aspectul unei pagini web. De fapt majoritatea codului PHP este invizibil utilizatorului. Cineva care va privi o pagină PHP nu o să poată să își dea seama că nu este scrisă în HTML simplu, deoarece de obicei rezultatul PHP-ului este HTML.

PHP este un modul oficial al Apache HTTP Server, liderul de piață al softului pentru servere care găzduiește aproape 67% din website-urile existente. Datorită acestui lucru compilatorul PHP este integrat in serverul web, ceea ce se traduce prin aplicații mai rapide și care gestionează mult mai bine resursele de memorie.

Ca și Apache, PHP este operabil pe orice platformă, ceea ce înseamnă că rulează atât pe UNIX, Windows sau Mac OS X. Toate proiectele aflate sub îndrumarea Apache Software Foundation, inclusiv PHP sunt softuri open-source.

Principalii concurenți ai PHP sunt Microsoft ASP.NET, Perl, Java Server Pages(JSP), Perl și ColdFusion.

În comparație cu acestea, PHP are mai multe atuuri, și anume: performanță, scalabilitate, interfețe cu multe SGBD-uri, biblioteci predefinite petru multe task-uri web comune, cost redus, facilitatea învățării și utilizării, suport pentru orientarea pe obiecte, portabilitate, flexibilitate în dezvoltare, disponibilitatea codului sursă, disponibilitatea suportului și a documentației.

Performanță: datorită faptului că utilizează un singur server, PHP este foarte rapid si poate servi milioane de accesări zilnic.

Scalabilitate: Rasmus Lendorf a spus ca PHP are o arhitectură ”shared nothing”. Aceasta înseamnă că este posibilă scalarea orizontală cu un număr mare de servere, în mod eficient și ieftin.

Integrarea bazelor de date: PHP are posibilitatea nativă de a se conecta la mai multe sisteme de baze de date. Înafara de MySQL, este posibilă conectarea directă la PostgreSQL, DB2, Oracle, Informix, Sybase, InterBase etc.. Folosind stanardul ODBC (Open Database Connectivity), PHP se poate conecta la orice bază de date care furnizează un driver ODBC.

Biblioteci predefinite: Fiind un limbaj dezvoltat pentru Web, PHP are multe funtii native pentru efectuarea diverselor task-uri referitoare la Web. Se pot realiza conexiuni la servicii web și alte servicii în rețea, se pot genera imagini, trimite email-uri, se poate parsa cod XML, lucra cu cookie-uri și se pot genera documente PDF, doar cu ajutorul a câtorva linii de cod.

Ușurința învățării PHP: deoarece sintaxa PHP este bazată în principiu pe cea a limbajelor de programare C si Pearl, îl face îușor de învațat.

Suport pentru orientarea pe obiecte: Versiunea 5 a PHP are particularități orientate pe obiect foarte bine definite și anume: moșteniri, atribute și metode private și proteted, interfețe, constructori și destructori, clase abstracte și metode. De asemenea, sunt și câteva caracteristici mai puțin comune, ca de exemplu iteratorii.

Portabilitate: Fiind disponibil pentru multe sisteme de operare, gratuite de tip Unix (Linux, FreeBSD) sau comerciale (Solaris, IRIX, OS X) și pe diferite versiuni de Microsoft Windows, un cod PHP bine scris rulează fără probleme și fără modificari pe toate sistemele.

Flexibilitate în dezvoltare: PHP permite dezvoltarea aplicațiilor simple cu mare ușurință, și se adaptează în egală măsură la implementarea celor mari, care pot folosi și un framework ce are la bază un model de proiectare cum ar fi MVC (Model – View – Controller).

Elemente de bază a sintaxei

Tag-urile PHP sunt <?php și ?>. Acestea anunță serverul web unde începe și se termină codul PHP, iar orice text dintre aceste 2 tag-uri este interpretat ca PHP. Textul din afara tag-urilor PHP este tratat ca HTML normal.

Există 4 stiluri diferite de tag-uri PHP. Următoarele fragmente de cod sunt echivalente :

Stilul XML :

<?php echo 'Acesta este un text'; ?>

Acesta este stilul de tag PHP recomandat. Administratorul serverului nu îl poate dezactiva, deci se poate garanta că va fi disponibil pe toate serverele. Acest stil de tag poate fi utilizat în documentele XML.

Stilul prescurtat :

<?echo ' Acesta este un text'; ?>

Pentru a utiliza acest stil, este nevoie fie să activăm setarea short_open_tag în fisierul de configurare, fie să compilăm PHP cu short_tag-urile activate. Stilul nu este activat implicit.

Stilul script :

<script language= 'php'>

echo 'Acesta este un text';

</script>

Stilul este familiar celor care au utilizat JavaScript sau VBScript. Poate fi folosit dacă editorul HTML are probleme cu celălalte stiluri.

Stilul ASP :

<% echo 'Acesta este un text'; %>

Poate fi folosit dacă a fost activată setarea de configurare asp_tags. Implicit stilul este dezactivat.

Separarea instrucțiunilor

Instrucțiunile sunt separate la fel ca în Pearl sau C, fiecare instrucțiune este terminată cu un semn punct și virgule ”;”.

Tag-ul de închidere implică și sfârșitul instrucțiunii, deci următoarele două exemple sunt echivalente:

<?php

echo "Acesta este un text";

?>

<?php echo "Acesta este un text " ?>

Comentariile

PHP suportă comentarii de tip ”C++”,”C” și Unix shell. De exemplu:

<?php

echo "Acesta este un mesaj"; // Acesta este un comentariu pe o linie

/* Acesta este un alt comentariu

pe mai multe linii */

echo "Acesta este un nou mesaj";

echo "Acesta este ultimul mesaj"; # Acesta este un comentariu pe o linie tip shell

?>

Comentariul pe o singură linie, de fapt realizează comentarea codului până la sfârșitul liniei curente sau până la terminarea blocului curent PHP.

I.2.2 Mai multe despre baze de date și MySQL

Baze de date

Structura unei baze de date relaționale

O bază d date relaționalî este o colecție de date organizată ca un set de tabele, din care datele pot fi accesate sau reasamblate în mai multe moduri diferite, fără a reorganiza tabele bazei de date. Baza de date relațională a fost inventată de către E.F.Codd în annul 1970.

Pe lângă faptul că este usor de creat și accesat, o bază de date relațională are marele avantaj de a fi ușor de extins. După crearea bazei de date originale, o nouă categorie de date poate fi adăugată, fără a modifica toate aplicațiile existente.

Fiecare table (numit și relație) din baza de date relaționalî conține una sau mai multe categorii de date ăn coloane. Fiecare rând conține un exemplu unic de date pentru categoriile definite de coloane. De exemplu, o bază de date tipi pentru afaceri va conține un table pentru client, care are coloane pentru nume, adresă, număr de telefon etc.. Un alt tabelva descrie o comandă și va avea coloane pentru produs, client, data, preț de vânzare etc.. Un utilizator al bazei de date poate obține o vizualizare a bazei de date, specific nevoilor sale. De exemplu, un manager de sucursală și-ar dori să vadă o listă cu toți clienții care au cumpărat un produs după o anumită data.

La crearea unei baze de date relațională , se poate defini domeniul de valori posibile într-o coloană de date si constrângeri suplimentare, care se pot aplica datelor.

Normalizarea tabelelor

Normalizarea bazei de date este procesul de organizare a câmpurilor și a tabelelor unei baze de date relaționale cu scopul de a minimiza reduntanțele si dependențele. Normalizarea presupune, de obicei, împărțirea tabelelor mari în tabele mai mici( și mai puțin redundante) și definirea relațiilor dintre ele. Obiectivul este de a izola datele , astfel încât adaugarea, ștergerea și modificarea unui camp să poată fi facută într-un singur tabel și apoi să se extindă la restul bazei de date utilizând relațiile definite.

Edgar F. Codd, inventatorul modelului relațional, a introdus conceptul de normalizare și de ceea ce știm acum ca prima formă normală(1FN) în anul 1970. În anul 1971 a definit a doua și a treia forma normală, iar împreuna cu Raymond F. Boyce a definit forma normală Boyce-Codd(BCNF) în anul 1974. O bază de date relațională este adesea descrisă ca fiind “normalizată” daca este in a treia formă normal.

Structured Query Language

SQL (Structured Query Language) este un limbaj standard de calculator pentru gestionarea bazelor de date relaționale și manipularea datelor. SQL este folosit pentru a interoga, insera, actualiza și modifica date.

Majoritatea bazelor de date relaționale suportă SQL, acest lucru fiind un beneficiu pentru administratorii de baze de date (DBAs), deoarece aceștia sunt nevoiți de multe ori să susțină bazele de date pe mai multe platform diferite.

Dezvoltat pentru prima oară la începututl anilor 1970 la IBM, de Raymond Boyce și Donald Chamberlin, SQL a fost lansat commercial de Relational Software Inc (Oracle de astăzi), în 1979. Actuala versiune standard SQL este volntară, furnizor-compatibil și monitorizată de către Institutul Național de Standarde American (ANSI).

Astăzi, SQL este frecvent utilizat pentru dezvoltarea și gestionarea bazelor de date Web. Deși SQL este acum considerat a fi un limbaj standard, există încă o serie de variante ale acesteia, cum ar fi mSQL si MySQL. Prin utilizarea unui limbaj de scripting cum ar fi PHP, comenzi SQL pot fi executate când o pagină Web este încărcată. Acest lucru face posibil crearea de pagini Web dinamice care pot afișa informații diferite de fiecare dată când sunt încărcate.

Codul SQL este împartit in 3 categorii principale:

Limbaj de manipulare a datelor (LMD) – utilizat pentru a adăuga, actualiza sau șterge date și este format din INSERT, DELETE și UPDATE

Limbaj de definire a datelor (LDD) – utilizat pentru a gestiona tabele și structuri index și este format din CREATE, ALTER, TRUNCATE.

Limbaj de control al datelor (LCD) – utilizat pentru a desemna și revoca drepturile de baze de date și permisiuni și este format din ROLLBACK și COMMIT.

MySQL este un sistem de gestiunei a bazelori de date relaționali, produs de compania suedeză MySQL AB și distribuiti sub Licența Publică Generală GNU. Este cel mai populari SGBD open-source la ora actuală, fiind o componentăi cheie a stiveii LAMP (Linux, Apache, MySQL, PHP).

„Deși este folositi foartei des împreunăi cu limbajul de programarei PHP, cu MySQL se pot construi aplicațiii în orice limbaji majori. Există multei schemei API disponibilei pentru MySQL ce permiti scrierea aplicațiilori în numeroase limbajei de programarei pentru accesareai bazelori de date MySQL, cum ar fi: C, C++, C#, Borland Delphi, Java, Perl, PHP, Python, FreeBasic, etc., fiecarei dintre acestea folosind un tip spefici API. O interfațăi de tip ODBC denumităi MyODBC permite altor limbajei de programarei ce folosesc această interfață, să interacționezei cu bazele de date MySQL cum ar fi ASP sau Visual Basic. În sprijinul acestor limbaje de programare, unele companiii produc componentei de tip COM/COM+ sau .NET (pentru Windows) prin intermediuil cărora respetivelei limbaje să poată folosi acest SGBD mult mai ușor decât prin intermediuli sistemului ODBC. Aceste componentei pot fi gratuite (ca de exemplu MyVBQL) sau comerciale.” – conform (https://ro.wikipedia.org/wiki/MySQL)

MySQL este componentăi integratăi a platformelori LAMP sau WAMP (Linux/Windows-Apache-MySQL-PHP/Perl/Python). Popularitateai sa ca aplicației webi este strâns legatăi de cea a PHP-ului care este adeseai combinati cu MySQL și denumiti Duo-ul Dinamic. În multe cărți de specialitatei este precizat faptul ca MySQL este mult mai ușor de invățati și folositi decât multe din aplicațiilei de gestiunei a bazelor de date, ca exemplui comandai de ieșire fiind una simplă și evidentă: „exit” sau „quit”.

Pentru adminsitrareai bazelori de date MySQL modul linie de comandă este o soluție, sau, poate fi folosită și o interfață grafică: MySQL Administrator și MySQL Query Browser. Un instrument foarte folosit în administrarea acestor baze de date este aplicația gratuită, phpMyAdmin, scrisă chiar cu ajutorul limbajului PHP.

MySQL poate fi executat pe majoritatea platformelor software existente: AIX, NetBSD , GNU/Linux, Mac OS X, FreeBSD, Windows 9x/NT/2000/XP/Vista , Solaris, SunOS.

Caracteristici de bază ale MySQL

Principalii concurenți ai MySQL sunt Microsoft SQL Server, PostgreSQL și Oracle. Avantajele MySQL sunt:

Performanță ridicată

Costul scăzut

Ușurința configurării și învățării

Portabilitatea

Disponibilitatea codului sursă

Disponibilitatea suportului

Performanță

Referințele dezovaltării arată că MySQL este cu mult mai rapid decât competitorii săi.

Cost scăzut

MySQL este disponibil gratuit sub licență open source sau la un cost scăzut sub licență comercială. Este necesară această licență dacă dorim redistribuirea lui MySQL ca parte a unei aplicații. Cele mai multe aplicații web nu trebuie distribuite, astfel încât nu este necesară licența.

Ușurința folosirii

Majoritatea bazelor de date moderne folosesc SQL, deci adaptarea la cel implementat în MySQL nu ar trebui să fie o problemă. De asemenea, MySQL este mai simpu de configurat decât produsele similare.

Portabilitate

MySQL poate fi folosit pe diferite sisteme Unix și Microsoft Windows.

Codul sursă

Similar limbajului PHP, codul sursă al MySQL poate fi accesat si modificat.

Disponibilitatea suportului

Spre deosebire de alte produce open source, MySQL AB oferă suport, training, consultanță și certificare.

Conectarea și deconectarea de la server

Pentru ai realizai conectarea la serveri trebuie specificati un nume de utilizatori și, de celei mai multei ori, o parolă. Dacăi serverul ruleazăi pe un alti calculator trebuiei specificat șii un hostnamei.

Dacăi conectarea sei realizează cui succes îni continuare sunti afișate informațiii introductivei, urmatei de prompt-uli mysql>

Deconectareai de la serveruli MySQL sei poate realizai oricând prini introducerea comenziii QUIT (sau \a) lai prompt-uli mysqli.

Introducerea interogărilor

Următoareai comandă estei o interogarei simplă carei cere serveruluii informații precumi versiunea curentăi și data curentăi:

Aceastăi interogare ilustreazăi câteva lucrurii despre mysqli:

Îni mod normali, o comandăi constă într-oi declarație SQLi urmată dei semnul puncti și virgulăi.

Cândise lanseazăi o comandăi, mysqli o trimitei serveruluii spre execuției și afișeazăi rezultatele, apoii afișează din noui prompt-ul mysql>i pentru a indicai că este gatai să acceptei alte comenzii.

Mysqliafișeazăi rezultatul interogărilori într-o formăi tabelarăi. Prima liniei conține etichetelei coloanelor, iari liniile următoarei sunt rezultatelei interogăriii.

Mysqli afișează șii numărul dei rânduri returnatei și cît timpi a fost necesari pentru execuțiai interogăriii

Pe oi singurăi linie poti fi introdusei mai mulei comenzi, separatei cu câtei un semni puncti și virgulăi, de exemplui:

O comandăi nu trebuiei neapărat săi fie introdusăi pe o singurăi linie, de exemplui:

Prompt-uli se schimbăi din mysql> îni -> dupăi introducereai primei liniii a uneii interogării pe maii multe liniii. Aceastai indicăi faptuli că respectivai interogarei estei incompletă șii mysql așteaptăi introducereai restuluii interogăriii.

Se poatei întrerupe introducereai unei interogării pe liniii multiplei folosind simbolurilei \c

Crearea și selectarea unei baze de date

Pentru a crea o nouă bază de date se folosește comanda CREATE DATABASE.

Crearea uneii baze de datei nu implicăi și selectareai acesteia pentrui utilizarei, aceasta trebuiei selectatăi folosindi comandai USE:

Crearea și utilizarea unei baze de date

Pentrui a vedeai bazele dei date existentei pe uni serveri se foloseștei comandai SHOWi:

Bazai de datei “mysql”i este necesarăi deoarecei descriei privilegiilei de acces alei utilizatoriloro.

Dacă o bază de date există, aceastai ar puteai fi accesatăi astfeli:

Crearea tabelelor

După creeare, nu există nici un tabel în baza de date, lucru ce se poate observa utilizând comandai SHOW TABLES:

Crearea unui tabel se realizează utilizând comanda CREATE TABLE.

Acum comandai SHOW TABLES vai avea următoruli rezultati:

Vizualizarea detaliilor unui tabel se realizează utilizând comanda DESCRIBE:

Conform unui sondaj realizat de webdirections.org la congresul WDS 2008, 70% dintre webdeveloperi utilizează MySQL.

I.2.3 Mai multe despre HTML

HTML a fost dezvoltat inițial de Tim Berners-Lee la CERN în 1989. HTML a fost văzut ca o posibilitate pentru fizicienii care utilizează computere diferite și schimbe între ei informație utilizând Internetul. Erau prin urmare necesare câteva trăsaturi: independență 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 font-uri, grafică și culori diferite ), lucru vital pentru o audiență atât de variată.
Hipertext înseamnă că orice cuvânt, frază, imagine sau alt element al documentului văzut de un utilizator ( client ) poate face referință la un alt document, ceea ce ușurează mult 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.

Documentele HTML – structura

Un document HTML este format dintr-o succesiune de blocuri de informație. Aceste blocuri pot fi incluse unul în altul. Un bloc este delimitat de simboluri speciale, numite tag-uri (etichete). Modul în care un document este marcat cu elemente și cu atribute ale acestor elemente se realizeaza în conformitate cu Document Type Definition (DTD – definiția tipului de document). Aceasta conține regulile ce caracterizează fiecare tip de document.

Sursa autorizată pentru furnizarea de informații despre HTML și HTML DTD este World Wide Web Consortium (W3C) având adresa http://www.w3.org.

Tag-ul este termenul consacrat pentru a defini  elementele cu care sunt marcate textul și grafica într-o pagina web. Fiecare tag este încadrat de semnele "<" (mai mic) și ">" (mai mare).

De exemplu: <strong>Acest text se va vedea îngroșat într-un browser</strong>

Primul cuvant sau caracter ce apare în interiorul acestor paranteze poartă numele de element.

Majoritatea elementelor au un tag de deschidere și unul de închidere cu aceeași structură, dar cu prezența caracterului "/" în fața denumirii elementului.

Orice pagină web (document HTML) are în structură trei elemente obligatorii: un element numit HTML, care cuprinde întregul document, și două sub-elemente ale acestuia: HEAD (antet, cap) și BODY (corp).

Tag-ul <HTML> este primul tag care trebuie sa apara într-un fisier HTML. El va incadra alături de tag-ul său corespunzator de închidere (</HTML>) întreaga pagina web.

Tag-ul <HEAD> va marca partea de antet a paginii web. Are tag corespunzator de închidere (</HEAD>).

Tag-ul <BODY> va încadra conținutul paginii web. Are tag corespunzator de închidere (</BODY>).

Tag-ul <TITLE> marchează titlul unui document HTML, cel care va fi afișat in bara de titlu a browser-ului. Acest tag se folosește numai în interiorul tag-ului HEAD. Dacă acest tag lipsește, atunci in bara de titlu va aparea numele fișierului.

Ultima versiune de HTML este HTML5. Aceasta a fost creată în scopul de a simplifica dezvoltarea aplicațiilor web. Sintaxa acestuia este mult mai ușoară și oferă mai multe caracteristici noi, în comparație cu HTML4.

Aplicațiile cache (offline)

Aplicațiile HTML5 se pot implementa pentru a fi accesate și offline. HTML5 pune la dispoziție o funcție de stocare offline, prin care unele fișiere sunt stocate de browser. În consecință, dacă utilizatorul nu este conectat la internet, browser-ul încarcă fițierele necesare stocate anterior. Aceste fișiere pot fi de tip HTML, CSS, Javascript, sau orice alt tip de fișier necesar pentru ca browserul să afișeze pagina web (de exemplu imagini).

“Drag and Drop

HTML5 oferă o funcției incorporatăi Drag and Drop, care permitei dezvoltareai de aplicațiii interactive. Cu Drag & Drop aveții posibilitateai să mutații orice elementi în locul potrivit.

Geolocationi

Geolocationi API în HTML5, permitei să partajații locația dvs. cu site-urii de încredere. Confidențialitateai este importantăi în funcția de geolocalizare. Browserelei nu au nevoiei să trimităi informațiii despre locație la site-uri Web, fără permisiuneai explicită a utilizatorului. De exemplu, dacă un utilizatori acceseazăi o pagină web, în care, de asemenea, este prezentăi funcția de geolocalizarei folosind browser-ul Firefox, browseruli va întreba utilizatorul dacă dorește să partajeze locațiai lui. Dacă utilizatoruli acceptă, Firefox va strânge informațiii despre punctele de accesi fără fir în apropierei și adresa IP a computeruluii vizitatorilori și va trimite aceste informații către Google Location Services, care este un serviciui de geolocalizarei Firefox implicit.

Audio și video

În prezent, existăi facilității HTML necesarei pentru punerea în aplicarei a fișierelori multimedia. De aceea, fișierelei mediai se includi în HTML folosind diferitei plugin-uri . De exemplu, Flash este utilizati pe scară largă pentru a încorporai videoi și fișierei audio. Cu toate acestea, acest lucru poate fi foartei ușor de realizat în HTML5 cu ajutoruli elementelori audio și video, fără utilizareai de plugin-uri.

Formulare de introducere

HTML5 introducei mai multe elementei noi de intrare, cum ar fi pop-upi calendare, selectoarei de culorii și multe altele. Cu aceste funcțiii de intrarei se poate crea o formă foarte eficientă, cu un controli mai bun al intrăriii și verificării.” conform(http://ciobanu.cich.md/lectii_view.php?id=5)

I.2.4 Mai multe despre CSS

CSS-ul a ajuns la versiunea 3, și anume CSS3. Acesta reprezintă un upgrade ce aduce câteva atribute noi și ajută la dezvoltarea noilor concepte în webdesign. Unele dintre cele mai importante segmente (module) noi adăugate acestui standard pentru formatarea elementelor HTML aduc un plus considerabil in dezvoltarea activități webdesign.

Mai jos sunt prezente in listă cele mai importante modulele adăugate in CSS3:

Selectors

Box Model

Backgrounds and Borders

Image Values and Replaced Content

Text Effects

2D/3D Transformations

Animations

Multiple Column Layout

User Interface

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

1.2.5 Mai multe despre JavaScript

”JavaScripti vă permite să creații o interfațăi activă cu utilizatorul, să dea o impresiei vizuală placutăi în timp ce navigații prin paginilei site-ului. Puteți verifica validitateai informațiilori introdusei într-un formular înaintei ca datele să fie trimisei către server. Puteți face calculei matematice, crea paginii HTML dinamice, personalizatei în funcție de opțiunile utilizatoruluii sau ale browser-ului.

JavaScript controlează browser-ul, și prin intermediuli scripturilor puteți deschide ferestre noi, puteți afișa mesaje de avertizare și puteți pune mesaje în bara de stare a ferestrei browser-ului. Puteți genera ceasuri, calendarei și documente cu timpul înscris. Puteți chiar verifica prezența plug-in-urilor în browseri și puteți redirecționa utilizatoruli spre o pagina diferita în cazul în care browseruli nu are un anumit plug-in.

O mențiune importantă: programele care ruleaza pe calculatorul utilizatorului sunt numite aplicații client-side (aflate pe partea de client), și programele care rulează pe server (inclusiv CGI-urile) sunt numite aplicații server-side (aflate pe partea de server).” conform(http://www.ghid-html.info/113-limbajul-javascript.html)

Din motive de securitate și pentru ca ruleaza pe computer-ul utilizatorului, limbajul JavaScript are câteva limitări:

citirea sau scrierea fișierelor locale este interzisă. Totuși există o excepție, și anume directorul de cookie-uri ce aparține browser-ului.

nu permite citirea sau scrierea fișierelor de pe server. O soluție pentru acest lucru este să fie preluate datele trimise de un script cu ajutorul unui program rulat pe server, iar acesta din urmă să scrie fișierele necesare.

limbajul JavaScript nu permite nici închiderea ferestrelor de browser ce nu au fost deschise de el. Astfel se exclude problema de a se închide anumite ferestre din browser în momentul când este accesată o pagina web ce rulează cod JavaScript.

dacă o pagină web este pe alt server, aceasta nu poate fi citită de un script JavaScript. Astfel nu se poate afla ce site-uri accesează utilizatorul.

jQuery – cea mai cunoscută librarie de JavaScript

jQuery este o platformă de dezvoltare JavaScript, concepută pentru a ușura și îmbunătăți procese precum traversarea arborelui DOM în HTML, managementul inter-browser al evenimentelor, animații și cereri tip AJAX. jQuery a fost gândit să fie cât mai mic posibil, disponibil în toate versiunile de browsere importante existente, și să respecte filosofia "Unobtrusive JavaScript". Biblioteca a fost lansată in 2006 de către John Resig.

Caractesristici jQuery

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

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

parcurgerea ș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 ( vezi mai jos )

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

CAPITOLUL II – APLICAȚIA

În acest capitol este descrisă aplicația, back-end-ul fiind implementat pe baza framework-ului Codeigniter (un framework bazat pe modelul MVC) și cu ajutorul limbajului PHP, alături de sistemul de gestiune al bazelor de date relaționale MySQL. Acestea au fost alese pentru că pot fi foloste gratuit, pe orice sistem de operare, fără restricții și sunt ușor de utilizat și înțeles. Pentru front-end au fost utilizate limbajele HTML, CSS și JavaScript.

II.1 Descrierea site-ului

Prin dezvoltarea acestui site, s-a urmărit realizarea unui magazin virtual cu ajutorul căruia utilizatorii pot achiziționa ușor produsele dorite, dar și realizarea unei interfețe de content management prin care proprietarul magazinului poate administra conținutul site-ului său. Cu ajutorul sistemului de content management, se pot adăuga, șterge, modifica produse, administra stocurile existente, controla categoriile din care fac parte produsele, precum și stabilirea unor promoții la anumite produse.

II.2 Structura site-ului

Paginile principale ale magazinului virtual sunt: first-page.tpl, product.tpl, category.tpl, search.tpl, cart.tpl, contact.tpl și page.tpl.

Pagina first-page.tpl reprezintă prima pagină a aplicației web, unde vizitatorul poate vedea principalele categorii, un carousel cu oferte, promoții, produse noi, precum și partenerii magazinului. De asemenea în partea de sus are posibilitatea de a căuta după nume produsul dorit și de a vizualiza un sumar al coșului de cumpărături.

În pagina product.tpl se încarcă dinamic, informații despre produsul accesat. Vizitatorul are acces la pozele produsului, descrierea acestuia, informații despre disponibilitatea produsului precum și posibilitatea de a adăuga produsul în coșul de cumpărături.

Pagina category.tpl grupeaza toate produsele dintr-o anumită categorie, permițând totodata sortarea acestora dupa anumite criterii.

Pagina search.tpl oferă utilizatorului o metodă simplă și rapidă de afișare a unei liste de produse ce au în componența numelui, unul sau mai multe cuvinte cheie introduse de către utilizator.

Pagina checkout.tpl conține o detaliere a produselor aflate in coș, împreună cu totalul valorii comenzii, dar și un formular ce trebuie completat de către utilizaor în vederea finalizării cumpărăturilor. Dacă formularul a fost completat corect, comanda se va finaliza cu succes și utilizatorul va primi un email de confirmare al comenzii. În caz contrar, se vor afișa mesaje sugestive și utilizatorul va trebui sa verifice câmpurile completate greșit.

Pagina contact.tpl oferă vizitatorului informatii cu privire la magazin, și anume datele de contact, datele fiscale sau harta unde poate fi găsit magazinul fizic. De asemenea în pagina de contact există și un formular ce poate fi completat în scopul de a obține informații suplimentare sau a depune plângeri cu privire la servici sau produse.

Pagina general-text.tpl oferă administratorului posibilitatea de a creea dinamic pagini cu conținut diferit, astfel făcând ușoară comunicarea cu vizitatorii. Pot fi articole sau pagini ce țin de informarea clienților cu privire la modul de cumpărare, termenii și condițiile sau posibilitatea de returnare a produselor.

II.3 Content Management System

Partea de administrare a conținutului a fost dezvoltată în scopul de a facilita proprietarului de magazin on-line, operațiunile de adăugare sau ștergere produse, precum și actualizarea conținutului, fie că e vorba de produse, meniu, categorii, brand-uri sau pagini text.

De asemenea, noi utilizatori ai CMS-ului pot fi adăugați din aceasta interfață, în cazul în care se dorește modificarea conținutului de mai multe persoane.

Pentru a intra în panoul de administrare, utilizatorul are nevoie de o adresa de email și de o parolă.

Odată introduse corect, utilizatorul are acces la conținutul site-ului, reprezentat prin butoane cu diferite acțiuni:

List all pages

Add new page

Navigation

List all products

Add new product

List all pages – accesarea acestui buton, permite utilizatorului vizualizarea, editarea și stergerea paginilor din site. De asemenea în partea stângă exista acces rapid la adăugarea unei pagini noi și la filtrarea rezultatelor afișate după anumite criteria.

Add new page – în această secțiune, se pot adăuga pagini noi. Utilizatorul trebuie sa completeze campurile necesare din mai multe tab-uri cu informații despre pagină. Odată finalizată completarea, dacă se dorește publicarea imediata a paginii, se va apăsa butonul ”Publish”, sau pentru publicarea ulterioară, butonul ”Save as draft”.

Navigation – în această pagină vor apărea paginile ce au fost setate ca făcând parte din meniu. Acestea pot fi rearanjate în ordinea dorită prin drag and drop, sau pot fi șterse din meniu.

List all products – la fel ca și în cazul paginilor, aici se pot viziualiza, edita și sterge produse. În plus, în partea stângă există un buton de ”Export CSV”, care permite descărcarea unui fițier de tip CSV, în care se vor regăsi toate produsele din magazin.

Add new product – această secțiune permite adăugarea de produse noi pe site. Utilizatorul trebuie să completeze o serie de informații despre produs, cum ar fi: nume, cod produs, preț, descriere, imagini etc. La fel ca și în cazul paginilor, produsele pot fi publicate imediat, sau salvate pentru o publicare ulterioară.

II.4 Crearea bazei de date MySQL

Pentru stocarea informațiilor despre utilizatorii de CMS, produsele din magazin, pagini sau comenzi s-a folosit o bază de date cu mai multe tabele, cele mai importante fiind detaliate mai jos.

”cms_users” – conține datele despre utilizatorii de CMS

Principalele câmpuri sunt:

Id – cheie primară autoincrementabilă

Gid – cheie externă, face legătura cu tabelul cms_groups și dă tipul de utilizator

Password – parola folosită pentru login

Email – adresa de email necesară logării in CMS

Activated – are valoarea 1 cand contul e active si 0 altfel

”cms_groups”

Id – cheie primară autoincrementabilă

Group_name – numele grupului, ce reprezintă tipul de utilizator

3. ”orders” – conține toate datle legate de comenzi

4.”pages” – contine informațiile despre paginile create în CMS

Principalele câmpuri sunt:

Id – cheie primară autoincrementabilă

Alias – reprezintă URI –ul corespunzător paginii

Parent_id – stabilește ierarhia între pagini

Is_category – are valoarea 1 dacă este categorie și 0 altfel

Revision_id – cheie externă, face legătura cu tabelul ”revisions”

Status – poate avea 3 valori: draft, active sau deleted

5. ”revisions” – conține informațiile din pagini

Cel mai important câmp din acest tabel este ”content”. Acesta are stocat conținutul unei pagini create in CMS.

6. ”product” – conține informațiile despre produsele din magazin

Principalele câmpuri sunt:

Id – cheie primară autoincrementabilă

Full_name – numele produsului

Category – id-ul categoriei din care face parte, este cheie externă și face legătura cu tabelul ” pages”

Description – descrierea care apare în pagina produsului

Price – prețul produsului

Promo – ne spune dacă un produs este la promoție sau nu

Special_price – prețul produsului daca este la promoție

Status – poate avea 3 valori: draft, active sau deleted

Datele de conectare la baza de date sunt intr-un fișier numit ”database.php” din folderul ”config”.

II.5 Elemente de statistică

Site-ul este conectat la Google Analytics printr-un cod unic, ceea ce permite urmărirea traficului, paginile accesate dar și anumite evenimente, ca de exemplu finalizarea unei comenzi. Astfel proprietarul magazinului poate vedea detalii despre numărul de utilizatori care au ajuns în pagina de comandă dar nu au finalizat procesul.

Pentru a putea înregistra datele de pe fiecare pagină, codul este plasat în tag-ul <head>.

CAPITOLUL III – CONCLUZII ȘI PROPUNERI

Alegerea unui magazin online pentru afacerea personală este un mare avantaj în primul rând datorită disponibilității. Un magazin online este deschis 24/7 și astfel clienții se pot ”plimba” prin magazin oricând doresc. În al doilea rând, un magazin online poate găzdui simultan un numar mult mai mare de clienți în comparație cu un magazin fizic.

Un alt element important al unui magazin online este expunerea. Acesta poate fi accesat din orice colț al lumii și dacă politica magazinului permite, se pot livra comenzi oriunde.

Cu ajutorul metodelor de analiză a traficului de pe site se poate identifica de unde au venit clienții ce au finalizat o comandă, precum si valoarea acesteia.

De asemenea un magazin online adminstrat eficient, crește considerabil vânzările unei firme ce își desfășoară deja activitățile în regim clasic.

Un aspect deloc de neglijat sunt clienții. Comunicarea cu aceștia este mai ușoara. După crearea unei baze de date cu clienți se pot desfășura campanii prin email, astfel înștiințând clienții despre promoțiile existente sau ultimele produse apărute. Folosind rețelele de socializare,

Ca o propunere de îmbunătățire a aplicației descrise mai sus, ar fi implemetarea unui sistem de conturi pentru clienți. Astfel aceștia vor putea plasa comenzi mai ușor, fără să mai completeze anumite câmpuri, deoarece ele sunt precompletate din setările contului. În aceste condiții, un formular de retur, în care clientul poate sa aleaga o comandă si anumite produse de care nu a fost mulțumit ar fi necesar și util. În completarea contului de utilizator, ar putea fi implementat un sistem de produse favorite, unde clientul își poate adăuga produsele pentru a avea acces foarte rapid la ele în eventualitatea finalizării unei comenzi.

Implementarea unui modul de generare automată a facturilor și a garanțiilor oferite de magazin ar aduce un mare plus magazinului. Clientul ar avea astfel posibilitatea de a vedea istoricul de comenzi, alături de factură și de garanțiile corespunzătoare fiecarui produs în parte.

O secțiune de review-uri pe fiecare produs ar fi utilă utilizatorilor în vederea alegerii produsului de care au nevoie. Aceasta ar aduce si un plus de încredere în ceea ce privește produsele de pe site.

Pentru a facilita căutarea produselor în site, ar fi utilă în pagina de categorie o secțiune de filtre, cu ajutorul cărora, prin eliminare, să afișeze utilizatorului exact produsele cu specificațiile dorite.

Pe partea de CMS ar fi util proprietarului să aibă posibilitatea de a vizualiza comenzile din site și de a putea să schimbe statusul acestora în funcție de evoluție. Integrarea cu un curier ar fi foarte utilă în vederea expedierii cât mai rapide și mai organizată a comenzilor.

În vederea construirii unei baze de date cu clienți pentru a trimite campanii prim email ulterior, crearea unei secțiuni de abonare la newsletter ar fi de folos. Astfel, daca un client este încântat de produsele de pe site, poat introduce adresa de email într-un câmp și la apasarea unui buton să fie stocata în baza de date pentru viitoarele campanii. Această operațiune ar putea fi finalizată cu oferirea unui cod de reducere (voucher), pe care clientul îl poate folosi la finalizarea unei comenzi. Aceasta presupune și implemetarea unui sistem de vouchere bine pus la punct pentru a nu exista refolosiri ale codurilor sau folosirea a mai multor coduri de reducere intr-o singură comandă.

Pentru a acoperi eventualitatea unui magazin cu foarte multe produse organizate în categorii și subcategorii, ar trebui conceput un alt sistem de afișare al meniului în site, pentru a avea acces cât mai facil la acestea.

Bibliografie

Bill McCarty, "PHP4", Ed. Teora, București, 2002;

Taylor Dave, "Crearea paginilor WEB cu HTML 4", Ed. Teora, Bucuresti;

Larry Ullman, "PHP și MySQL pentru site-uri dinamice", Ed. Teora, București, 2005;

Traian Anghel, "Dezvoltarea aplicatiilor WEB folosind XHTML, PHP si MySQL", Librăria Stilus Onlineș

Tudor Sorin, Vlad Hutanu, “Crearea și programarea paginilor WEB”, Ed. L&S SOFT, 2006.

www.php.net

http://www.w3schools.com/php/php_sessions.asp

Invață singur PHP, MySql și Apache, Julie C.Meloni, Editura Corint, 2005

http://elistaria.com/web-development/solutii-web

http://office.microsoft.com/ro-ro/access/HA012242471048.aspx

http://ro.wikipedia.org/wiki/MySQL

http://www.scritube.com/stiinta/informatica/php/INTRODUCERE-IN-PHP23222242.php

Home

http://developer.mozilla.org/en/docs/JavaScript;