Magazin Online de Carti

Introducere

Această lucrare prezintă dezvoltarea unei aplicații web de vânzări online de cărți, fiind bazată pe platforma opencart.

Am ales să implementez un magazin online de cărti, deoarece după parerea mea cititul este unul dintre cele mai frumoase hobby-uri pe care o persoană le poate avea, fiind urmat de o serie de avantaje. Multe studii au demonstrat că cititul îmbunătățește memoria, dezvoltă creativitatea, îmbunătațește vocabularul prin cuvinte noi, care mai târziu pot fi folosite cu ușurință în exprimare. Prin urmare “abilitatea” de a citi din pură inițiativă ne pregătește pentru a avea succes în toate domeniile, cât și pentru a face față obstacolelor care ne ies în cale.

Platforma OpenCart face parte din categoria aplicațiilor e-commerce (comerț electronic), iar din acest motiv aplicația oferă utilizatorilor cât și ofertantului o serie de avantaje. Un magazin virtual este la dispoziția utilizatorului 24 din 24 de ore, nu presupune spațiu costisitor, evitandu-se astfel cheltuielile legate de chirie, depozitare și întreținere. Este o aplicație care poate fi folosită cu usurință de către orice utilizator.

Platforma opencart vine cu multe avantaje și elemente în plus în ajutorul programatorilor, din punct de vedere al codului cât și din punct de vedere al interfeței cu utilizatorul. Felul în care aceasta este implementată facilitează în mod direct procesul de mentenanță sau chiar de extindere ulterioară a funcționalității sale.

Am ales să realizez această aplicație deoarece am avut ocazia să cunosc mai multe tipuri de framework-uri la locul de muncă, printre care și opencart.

Acesta mi-a atras atenția în mod special, deoarece folosește limbajul PHP și este o tehnologie nouă și suficient de complexă pentru a stârni interesul oricărui programator doritor să acumuleze cât mai multe cunoștințe în domeniu.

Limbaje de programare utilizate

PHP

Limbajul PHP este un limbaj de programare structuat de uz general cu cod-sursa deschis (Open Source), utilizat în general pentru dezvoltarea aplicațiilor Web. PHP înseamnă Hypertext Preprocessor, sintaxa sa provine din C, Java si Perl, acesta are rolul de a permite realizarea unor pagini web generate dinamic.

Principalele caracteristici ale limbajului sunt:

Simplitate: nu se folosește includerea de biblioteci, codul PHP fiind inclus într-un document executându-se între marcaje speciale.

Cross-Platform: cele mai populare implementări ale limbajului sunt cele de pe sistemele Linux și Windows.

Securitate: limbajul PHP deține un set de măsuri de siguranță puse la dispoziția programatorului.

Flexibilitate: odată cu dezvoltarea noilor tehnologii PHP-ul a fost integrat pentru serverele web deja existente: Zeus, Apache, IIS, etc.

Gratuitate: open source.

Usurință.

Pentru a rula pagini HTML (scripturi), trebuie să programăm calculatorul în calitate de server web și Bază de Date MySQL. Aceste componente de bază esențiale sunt gratuite și pot fi descărcate cu usurință de pe site-ul oficial al producătorului, următorul pas fiind instalarea și configurarea acestora.

In general este des întalnită instalarea unui pachet complet ce conține Apache + PHP + MySQL + PHPMyAdmin care se numește WampServer, XAMPP, PHPTriad, EasyPhp, Base etc. Aplicația PHPMyAdmin inclusă în pachetul WAMP permite administrarea cu usurință a bazei de date MySQL.

In aplicația prezentată am folosit limbajul PHP pentru creearea tuturor funcțiilor începând de la autentificare, logare, delogare, contact, adăugare de produse în coș, finalizare comandă, etc. In principiu limbajul PHP din punct de vedere funcțional, este baza aplicației. Am folosit acest limbaj în cadrul website-ului prezentat deoarece am avut ocazia să mă familiarizez cu el în decursul experienței mele, acesta fiind cel mai popular în rândul realizării website-urilor.

HTML

Prescurtarea Html vine de la HyperText Markup Language. Acesta este un limbaj de marcare folosit pentru creearea paginilor web, care ulterior sunt afișate într-un browser. Paginile html au extensia “.html” sau “.htm” și sunt formate din etichete sau taguri. Etichetele de obicei sunt pereche una de deschidere <html> și cealaltă de închidere </html>. Limbajul HTML nu face deosebire între litere, majuscule și miniscule.

Un document html este compus din:

Secțiunea head care conține etichetele <head> </head>

Secțiunea body cu etichetele <body></body>

Secțiunea head trebuie să conțină titlul paginii inclus între etichetele <title> și <title>, urmat de descrieri de tip <meta> și de legături către fișiere externe (exemplu: Fișiere de tip CSS, script-uri sau favicon). Secțiunea header se referă la prima parte a unui site (care de obicei include meniul) și este recunoscută după eticheta <header></header>, iar secțiunea footer se referă la ultima parte a site-ului recunscută după eticheta <footer></footer>.

Exemplu: <html>

<head>

<title>Licență</title>

</head>

<header></header>

<body> Conținut licență</body>

<footer></footer>

</html>

Conținutul HTML se poate genera în mod direct utilizând tehnologii de codare (exemplu: PHP, ASF sai JSP), astfel multe aplicații ca sistemele de gestinoare a conținutului, e-mail-uri, wiki-uri și formuri web generează pagini HTML.

Evoluția software introduce versiunea HTML5, care vine cu un numar de elemente și atribute noi specifice unui site modern, sintaxa fiind mult mai ușoară. HTML5 oferă o funcție Drag an Drop, care permite mutarea oricărui element în locul dorit. Un alt element nou este Geolocation API, care permite partajarea locației cu site-uri de încredere, confidențialitatea fiind foarte importantă. De aceea browser-ul nu are voie să trimită informații despre locație la site-uri Web, fără permisiunea utilizatorului. In prezent limbajul Html include și fișiere multimedia de tip audio si video, acestea sunt incluse în pagina web folosind diferite plugin-uri.

In aplicația prezentată am folosit limbajul HTML versiunea HTML, deoarece consider că este cel mai bun dezvoltator de aplicații web la momentul actual.

1.3 JavaScript

Java Script este un limbaj orientat pe obiecte bazat pe conceptual prototipurilor. Tehnologia a fost lansată inițial de programatorul american Brendan Eich de la Netscape Communications Corporation sub numele de Mocha, LiveScript și în final JavaScript. Codul Java este o secvență de, declarații, instrucțiuni și comenzi introdus in paginile web și putând fi rulat de către orice browser. O instructțune este o comandă către browser și are rolul de a spune browser-ului ce trebuie să facă, fiecare instructțune se incheie cu punct si virgule (;). Limbajul este folosit pentru construirea site-urilor web, și în alt context pentru acesul la obiecte încastrate (embedded objects) în alte aplicații, sintaxa nu are nici o legatură cu limbajul java, mai degrabă fiind apropiată de sintaxa limbajului C.

Pentu a insera JavaScript într-o pagina HTML se foloseste tagul <script></script>.

Exemplu: <html>

<body>

<h1>Afișare mesaj folosind JavaScript</h1>

<script type =”text/javascript”>

Document.write(“documentație”);

</script>

</body>

</html>

In memoria browserelor este reținută reprezentarea unei pagini sub forma unui arbore de obiecte, obiectele fiind puse la dispoziția script-urilor JavaScript, care le pot citi și manipula. Arborele de obiecte poartă numele de DOM (Document Object Model).

Limbajul JavaScript este cel mai folosit în creearea site-urilor web deoarece:

Este un limbaj ușor de învațat

Poate fi interpretat de către orice browser

Sunt suficiente doar cateva linii de cod pentru a mări iteractivitatea paginilor web.

Fișierele JavaScript pot fi incluse în orice document (X)HTML.

JavaScript este un limbaj puternic dar și limitat de anumite restricții impuse de navigatoarele Web. Din motive de securitate JavaScript nu poate executa operații in rețea, nu poate scrie, citi sau șterge fișiere de pe hard disc.

In proiectul realizat am folosit limbajul JavaScript atât in functionalitate cât și în design.

1.4 SQL

SQL înseamnă Structured Query Language și în prezent este unul dintre cele mai puternice și folosite limbaje structurate pentru interogarea bazelor de date relaționale. Acesta este un limbaj nonprocedural și declarativ, el face parte din categoria limbajelor de aplicații fiind orientat pe mulțimi. De obicei este utilizat în administrarea bazelor de date client/server, generarea instrucțiunilor SQL fiind realizate de către aplicația client.

Datorita faptului că există o standardizare a limbajului SQL, caracteristicile adăugate acestuia se numesc extensii, astfel în standard sunt detaliate 6 tipuri diferite de date pentru o baza de date SQL. Fiecare implementare utilizată în cadrul standardului se numește dialect. Dialectul este conceput pentru crearea interogaăilor de selecție.

Exista 3 metode principale cu privire la implmentarea limbajului SQL:

Apelare directă (Direct Invocation): care permite introducerea instrucțiunilor direct de la prompter.

Modulară (Modul Language): foloseste proceduri apelate de programele aplicație.

Incaplsulată (Embedded SQL): Instrucțiunile sunt încapsulate în codul program.

Instrucțiunile SQL sunt grupate în:

Instrucțiuni de definire și manipulare a datelor: acestea permit descrierea structurii bazei de date precum adăugarea, stergerea sau modificarea unei înregistrări.

Instrucțiuni de selecție a datelor: aceste instrucțiuni permit consultarea bazei de date.

Instrucțiuni de control al cursorului și al bazei de date.

De obicei SGBD (Sistemul de Gestiune al unei Baze de Date) permite crearea acesteia printr-un simplu clic de mouse (exemplu : CREATE DATABASE nume_baza_de_date ). Creearea unei tabele trebuie să conțină și definirea structurii unei înregistrări precum și tipurile de date asociate câmpurilor. Numele tabelei trebuie să fie unic în baza de date, iar clauza NOT_NULL arată că nu se memorează valori de tip NULL în câmpul respectiv.

CREATE TABLE nume_tabelă

(nume1 tip_dată [NOT_NULL],

nume2 tip_dată [NOT_NULL],

nume3 tip_dată [NOT_NULL]..)

In aplicația realizată am folosit apelarea directă pentru executarea instrucțiunilor de creare a bazei de date împreună cu constrângerile definite de către OpenCart pentru aceasta.

1.5 CSS

CSS  (Cascading Style Sheets) în traducere “foi de stil în cascada” este un standard, care are rolul de a stiliza elementele unei pagini HTML.

CSS functionează cu limbajul HTML, acesta se ocupă cu aspectul elementelor din pagină, cum ar fi: fonturi, culori, imagini, stiluri și așezarea acestora în cadrul ferestrei paginii. Toate aceste atribute se aplică în general unui singur element din pagină, mai multor elemente individuale, sau întregului document. Codul CSS este editabil dintr-un editor cum ar fi: notepad, notepad++ sau sublime.

CSS3 vine cu multe lucruri noi pentru a îmbunătăți aspectul unui website. Desi multe din atributele noi introduse , nu sunt axate pe funcționalitate, webmasterii au observant că utilizatorii vor un design modern pe langă functionalitate.

Cateva din trucurile interesante aduse de CSS3 sunt:

Box Shadow: pană nu aparuse css3 creearea unei umbre la o pagina era destul de dificila, programatorii trebuiau să folosească un pluggin de JavaScript sau o imagine. Folosind BoxShadow se pot adăuga umbre unei pagini printr-o singură line de cod, dând un aspect de adâncime.

Text-Shadow: prin această opțiune se poate adăuga umbră unui anumit font.

Exemplu: p{

text-shadow: 0px 1px 1px rgba(0,0,0,2);

}

Border images: o imagine poate fi utlizată ca și un border.

Nivelul opacității: pentru a obține efectul dorit, se folosește comanda “opacity:0,5”,sau un alt număr între 0 și 5.

Colțuri rotunjite: Eliminarea colțurilor la o imagine se face folosind border.

In aplicația realizata am folosit CSS pentru o interfață cât mai placută și moderna pentru orice utilizator.

1.6 Bootstrap

Bootstrap este un framework special pentru design HTML/CSS și JavaScript dezvoltat inițial de Twiter, care a ajuns în prezent la verisunea 3. Rolul său este de a realiza site-urile web responsive, acestea adaptându-se la orice rezoluție de dispozitiv: telefon mobil, tablete, desktop, incluzând o compatibiliate bună cu browserele inclusiv cu Internet Explorer 7. In momentul de față bootstrap a devenit standardul în creearea template-urilor pentru sistemele CMS, WordPress și Joomla, fiind cel mai utilizat framework la momentul actual pentru dezvoltarea interfețelor web.

Bootstrap este un instrument care poate gestiona și faza inițială a unui proiect deoarece beneficiază de o serie de componente care pot fi personalizate și reutilizate oferind o bază solidă de pornire a proiectelor pentru a nu începe de la zero. La baza dezvoltării framework-ului a fost ales preprocesorul LESS (stylesheet language) datorită vitezei de compilare a codului, și utlizării codului JavaScript.

LESS nu este singurul pre-procesor de CSS disponibil pe piață, exitând la momentul actual mai multe pre-procesoare printre care s-au remarcat si SAAS ( Syntactically Awesome Style Sheets) și SCSS. Modul lor de funcționare este foarte asemanător, scopul fiecaruia este reproducerea unui cod de calitate. Aceste pre-procesoare ca rezultat oferă dezvoltatorului definirea unui set de variabile sau parametri și recomplilarea surselor LEES, de unde rezultă un nou set de fișiere CSS.

Datorită popularității și succesului câștigat de acest framework au apărut comunități cu scopul de a oferi gratis sau commercial, pachete de interfețe complete și gata de integrat în diverse domenii cum ar fi: administrate și dashboard, pagini de prezentare, galerii foto și pagini de business.

Integrarea jQuery în Bootstrap a existat încă de la primele versiuni împreună cu o varietate de plugin-uri care sunt des folosite și anume: reprezentare pe tab-uri, ferestre modale, carousel, meniu hamburger. O altă facilitate a frameworkului este folosirea unui font care reprezintă icoanele pentru anumite acțiuni, cel mai popular este Font Awesome fiind definit ca și font iconic, dezvoltat pentru a fi folosit împeună cu frameworkul.

FontAwsome este folosit și în aplicația prezentată, precum și o varietate de facilități oferite de framework-ul bootstrap.

OpenCart

OpenCart este o platforma de comerț electronic care poate realiza și gestiona magazine online. Platforma este opensource, fiind soluția ideală pentru a gestiona magazinele online care dispun de un buget limitat. Acesta poate gestiona un magazin online mic, sau mediu, începand de la zeci de produse și ajungandu-se chiar la câteva mii.

Opencart dispunde de un cod bine gândit și structurat in panoul de administrare în comparativ cu alte framework-uri cum ar fi: Magento sau ZenCart. Aceste este un mare avantaj deoarece opencart dispune de o rapiditate mai mare în afișarea conținutului și usurința în dezvoltarea de module speciale.

Pentru a putea instala opencart primul pas realizat în aplicația prezentată a fost creearea bazei de date folosind MYSQL Server.

Avantajele utilizarii OpenCart sunt:

Necesită resursele cele mai puțin costisitoare (hardware-server)

Oferă cele mai multe soluții din punct de vedere al templet-urilor astfel opencart este dotat cu peste 4000 de module și templet-uri.

Dispune de multi-limba și multi-valuta.

Page-Cache: atunci când nu sunt produse în coș, mărește viteza de descărcare a paginii, ceea ce duce la creșterea vânzărilor

Coș de produse dinamic

Checkout (finalizare comanda): datorită faptului că mulți dintre utilizatori renunță la comanda procedurii complicate, noile versiuni include completarea adresei de email și numarului de telefon. A doua modalitate de checkout și cea mai clasică ar fi plata ramburs folosită și în aplicația prezentată.

Posibilitatea de modificare a comenzilor din interfața de administrare, precum și opțiunea de acordare de discount.

Optimizare SEO (Search Engine Optimization): o solutie avantajoasa pentru optimizare seo ar fi implementarea unui modul care cuprinde cantitatea și calitatea paginilor web incluzând linkurile, tagurile , title-uri, și meta descriptions (descrieri).

Interfața de administrare opencart deține statistici referitoare la clienți și comenzi, catalog de produse , panoul de control, extensii, setări principale, utilizatori și localizare.

Panoul administrativ conține urmatorul meniu:

Catalog : categorii, produse, informații, opinii, atribute, producatori, opțiuni.

Extensii : module, transport, plăți, total comenzi

Vanzari : comenzi, cupoane, vouchere, mail

Sistem : setări, localizare, comenzi

Rapoarte

Pași de instalare:

După ce toate fișierele sunt încărcate pe server, din foloderul upload se lansează fișierul instal. Pentru a trece la pasul următor trebuie să fim de acord cu licența opencart folosind butonul “I agree to the license”.

Pre-Instalare : în faza de preinstalare se verifică pas cu pas dacă toate cerințele tehnice ale serverului sunt instalate corect.

Configurare : în faza de configurare trebuie introduse numele și parola bazei de date create anterior, precum și un nou nume și parolă pentru secțiunea de administrare a platformei opencart.

Instalare finalizată: ultima fază include ștergerea fișierului instal din folderul upload.

WampServer

WampServer este un software pentru sistemul de operare Microsoft Windows, creat de Romain Bourdon, acesta constă în serverul web Apache, MySQL și limbajul de programare PHP. Cele mai noi versiuni disponibile în momentul actual sunt: WampServer (32 biți și PHP 5.5) 2.5 și WampServer (64 biți și PHP 5.5) 2.5.

In administrarea aplicatiei de vânzări am folosit pachetul Wamp deoarece am avut ocazia să mă familiarizez cu el în decursul experienței mele acesta fiind cel mai popular în rândul website-urilor

Sublime Text2

SublimeText 2 este un software folosit pe post de editor , cu o interfață de programare a aplicațiilor Python (API). Sublime susține mai multe limbaje de programare și limbaje de marcare, iar funcționalitatea acestuia poate fi extinsă de către utilizatori folosind plugin-uri, de obicei construite de comunitate și menținute sub licențe gratuite de software. Acesta conține 22 de teme diferite care poti fi configurate în funcție de necesitate.

Capitolul III. Proiectarea și implementarea aplicației

III.1 Proiectarea aplicației

III.1.1 Descrierea procedurilor de autentificar si înregistrare.

In urma tehnologiilor utilizate, magazinul de cărți online dispune de o temă responsive, astfel el poate fi accesat de pe orice dispozitiv cum ar fi telefon, tabletă, laptop sau desktop.

Orice utilizator se poate autentifica sau înregistra pe site dacă cerințele aplicației sunt respectate.

Inregistrare.

Pagina de înregistrare și autentificare se poate accesa din meniu, acesta fiind inclus pe toate paginile site-ului, utilizând butonul „Inregistrare”. Acestă pagină conține două secțiuni diferite: autentificare și înregistrare. Orice utilizator își poate crea un cont pe website completând câmpurile care apar la secțiunea înregistrare. Acestă secțiunea este foarte importantă deoarece conține toate datele utilizatorului atât datele persoanle cât și datele necesare pentru a cumpăra un produs. Câmpurile pe care utilizatorul trebuie să le completeze în secțiunea înregistrare sunt:

Detaliile personale: nume, prenume, adresă de email și număr de telefon.

Adresa utilizatorului: adresă (stradă, număr), oraș, tară și județ.

Parolă: parolă și confirmare parolă

După ce contul a fost creat utilizatoul este redirectionat pe pagina de mesaje unde poate vizualiza informații despre contul său. Datele personale, adresa cât și parola sunt confidențiale pentru fiecare utilizator al aplicației.

Autentificare

Pentru ca utilizatorul sa nu fie nevoit să completeze un număr mare de câmpuri secțiunea autentificare conține doar două câmpuri importante, acestea fiind adresa de email si parola. In cazul în care utilizatorul și-a uitat parola, trebuie să acceseze linkul „Am uitat parola” , după care va fi redirecționat pe o altă pagină unde, într-un câmp își va introduce adresa de email pe care va primi informații legate de noua parolă.

Dupa ce utilizatorul s-a autentificat pe site, acesta este redirectionat pe pagina „Contul meu” unde isi poate edita informatiile introduse in momentul inregistrarii. Pagina conține trei opțiuni de editare prima se numește „Editează infomațiile contului”. In cadrul acestei secțiuni utilizatorul își poate schimba numele, prenumele, adresa de e-mail sau numărul de telefon. A doua opțiune pune la dispoziția utilizatorului modificarea parolei vechi cu una nouă. Ultima opțiune numită „Modifică adresa” este legată de adresă, care în cadrul acestui tip de aplicație are un rol important deoarece este strâns legată de livrarea unui produs. Utilizatorul poate adauga o nouă adresă pastrând-o și pe cea veche. In acest caz el trebuie să alegă una din ele ca și adresă implicită folosind radio butonul „Adresă implicită” bifând opțiunea „Da sau Nu.” De asemenea adresa implicită va fi luată în considerare în momentul în care se face o comandă online, la un anumit produs.

Fiecare din aceste adrese pot fi șterse utilizând butonul „sterge” care se află în dreptul fiecărei adrese cu excepția adresei implicite, care nu poate fi stearsă.

III.1.2 Descrierea procedurilor de contact

Contact

Pagina de contact trebuie să creeze un impact în mintea utilizatorului pentru al determina să caute cât mai multe informații despre acea companie. De regulă un utilizator care s-a decis să-și facă cumpăraturile online, fie că este începator sau are deja experiență în domeniu, trebuie să ofere o atenție sporită datelor de contact.

Afișare unor date de contact reale inspiră încredere utilizatorilor astfel, aplicația prezentată pune la dispoziția vizitatorilor un formular care conține trei câmpuri esențiale: nume, adresă de e-mail și întrebare. De asemenea un utilizator poate contacta telefonic sau prin intermediul e-mailului un distribuitor care se află în diferite orașe din Romania. In funcție de orașul selectat utilizatorul va putea vizualiza adresa de e-mail și numarul de telefon al distribuitorului din orașul dorit.

î

Lipsa unei astfel de pagini în acest tip de aplicație poate induce neîncredere unui utilizator care este obișnuit să cumpere produse online.

III.1.3 Descrierea procedurilor de cumpărare

Deoarece scopul principal al acestui magazin este vanzarea produselor, este necesar ca butonul “Adauga in cos” sa fie cat mai vizibil pentru toti vizitatorii site-ului, de aceea butonul se afla in dreptul fiecarui produs disponibil. Scopul principal al unui vanzator online este de a convinge clientul ca are nevoie de produsele sale, de aceea structura produselor are un impact important asupra vizitatorului precum si structurarea produselor sub forma “Oferte Speciale” sau “Reduceri”.

Aplicația prezentată conține o pagina de “Oferte Speciale” care se află în meniu fiind vizibilă pentu orice posibil client. Această pagină conține un set de cărți din diferite domenii, la un preț redus față de prețul inițial.

Utilizatorul beneficiază de o sortare a cărților putând alege afișarea lor în funcție de: preț (mic>mare), preț (mare>mic), nume (A-Z), nume (Z-A) sau implict. De asemenea poate alege care carți să fie afișate în pagină (15, 25, 50, 75 sau 100 bucăți).

Cosul de cumparaturi este o caracteristica importanta pentru magazinele online, fiind reprezentat printr-o iconita simbolica. Totalitatea produselor disponibile in aplicatie se gasesc in pagina principala de unde se ramifica si alte subpagini cu produse, cat si in pagina de oferte speciale.

Inainte de a lua decizia de a cumpara un produs, orice vizitator doreste sa afle cat mai multe detalii despre produsul care urmeaza sa il cumpere, iar in acest caz la un click pe produsul respectiv, acesta va fi redirectionat pe pagina de informatii. Acesta pagina contine un colaj de poze cu cartea respectiva, descriere si opinii sau un feedback de la alti cumparatori, precum si link care site-urile de socializare. In general site-urile de socializare sunt surse semnificative pentru promovarea produselor online, putand aduce in atentia clientilor ultimele noutati. Tot in pagina de informatii cumparatorului ii se ofera posibilitatea de adauga produsul rspectiv in cos utilizand butonul “Adauga in Cos”, precizand cantitatea (numarul de bucati) pe care o doreste. In functie de cartea sau cartile pe care utilizatorul le-a adaugat in lista sa de cumparaturi, la un click pe iconita cosului se va deschide o fereastra cu detalii despre pretul total plus TVA.

Optiunile “Vezi cosul” si “Finalizeaza comanda” se afla tot in acesta ferestra fiind esentiale in mediul de vanzari online.

Optiunea “Vezi Cosul” afiseaza totalitatea produselor pe care cumparatorul le-a adaugat in cosul sau, benficiind de posibilitatea de a sterge un produs in cazul in care s-a razgandit si nu mai doreste acel produs. Un alt avantaj in cadrul acestei sectiuni este posibilitatea de reimprospatare produselor din punct de vedere cantitativ, in cazul in care clientul nu mai doreste doua carti sau mai multe carti de acelasi fel ci numai una singura, folosind optiunea de remprospatare cantitatea se modifica la numarul de bucati dorite de catre acesta.

In cadrul acestor aplicatii este important a se cunoaste metodele de plata acceptate. Majoritatea magazinelor online foloesc ca principale metode de plata cardurile de debit, de credit, transfer bancar sau plata ramburs, acestea fiind reprezentate sub forma de icoane sugestive.

In cadrul aplicatiei prezentate cand utilizatorul alege optiunea “Finalizeaza Comanda” in cazul in care acesta nu are creat un cont cu informatiile personale nu va putea cumpara un produs.

III.1.3 Descrierea procedurilor de plata (finalizarea comenzii)

Metodele de plata acceptate in cadrul aplicatiei prezentate sunt: plata cu cadrul, transfer bancar si ramburs. Pentru ca utilizatorul sa finalizeze o comanda acesta trebuie sa parcurga o serie pasi:

Inregistrare sau autentificare: in cazul in care utilizatorul are deja un cont creat, trebuie doar sa se inregistreze folosind username-ul si parola, in cazul in care acesta nu are un cont creat sau nu doreste sa aiba unul, el nu va putea alege optiunea “Comanda fara cont”

Acesta optiune ii cere utilizatorului informatii despre adresa si detalii personale.

Adresa de facturare: utilizatorul poate folosi adresa existenta, mai exact cea adaugata la creearea contului sau are posibilitatea de a adauga una noua.

Adresa de livrare: la fel ca si in cazul adresei de facturare, utilizatorul poate folosi adresa existenta sau poate adauga una noua

Selectarea metodei de livrare: utilizatorul trebuie sa bifeze radio butonul “Transport gratuit” (Free Shipping), avand totodata posibilitatea de a adauga un comentariu cu privre la comanda sa.

Selectarea metodei de plata: Transfer Bancar sau Plata la Livrare (Cash on Delivery)

Confirmare Comanda

Metoda de livrare utilizata in cadrul aplicatiei este free shipping (transport gratuit), astfel indiferent de valoarea sau cantitatea produselor cumparate, acestea ajung in maxim o saptamna la adresa stabilita, comanda fiind achitata integral in Lei. Prima metoda de plata care pusa la dispozitia utilizatorilor este transferul bancar. Metoda transferului bancar se poate efectua doar in moneda tarii de origine (Romania), platile neidentificate de catre administrator vor fi transferate catre contul bancar al cumparatorului. Suma transferului bancar trebuie sa acopere o parte din cerintele administratie, plata trebuie efectuata in cel mult 24 de ore dupa ce s-a facut comanda, in cazul in care plata nu este efectuata comanda va fi anulata.

Metoda PayPal este una dintre cele mai sigure, populare si flexibile metode de a cumpara produse online. Datorita faptului ca foloseste standarde inalte de protectie a tranzactiilor si a datelor, numarul utilizatorilor care detin conturi PayPal depasteste 100 de milioane. Din septembrie 2007 PayPal se poate folosi si in Romania, desi intial erau disponibie doar cateva optiuni ale serviciului, in momentul actual acesta poate fi folosit fara limitari de catre oricine.

In serviciul PayPal pot fi folosite atat carduri de debit cat si carduri de credit.

Pentru a putea realiza o comanda online utilizatorul trebuie sa detina un cont PayPal. Serviciul prezinta mai multe tipuri de conturi: PayPal Personal Account, PayPal Premier Account si PayPal Business. In cazul magazinelor online PayPal Personal Account este cel mai utilizat cont, deoarece permite efectuarea platilor online oriunde in tara si in strainatate.

In cazul aplicatiei prezentate, dupa ce utilizatorul a confirmat comanda facuta, acesta va fi redirectionat pe site-ul oficial PayPal, unde va trebui sa se autentifice cu e-mailul si parola sa, in cazul in care acesta nu are un cont, va putea selecta linkul “Create a PayPal account”.

Dupa autentificarea pe site-ul oficial PayPal, utilizatorul trebuie sa isi introduca datele cardului care doreste sa-l foloseasca pentru a plati comanda.

Metoda ramburs este cea mai ieftina modalitate de a trimite produse oriunde in tara, asfel dispune de costuri resduse comparativ cu firmele de curier. Beneficiarul trebuie sa se prezinte la oficiul postal de care apartine pentu ridicarea coletului.

Un studiu recent arata ca 75% din romanii care isi fac cumparaturile online nu platesc cu cardul, cea mai utilizata metoda de plata este cea ramburs.

III.1.3 Proiectarea bazei de date

Baza de date a magazinului online, este alcatuita din 131 de tabele, fiecare cu o serie de coloane aferente, si cu legaturi existente intre aceste tabele. Pentru a accesa baza de date locala a aplicatiei, este necesar sa scriem in browser localhost urmat de /phpmyadmin (Exemplu: http://localhost/phpmyadmin/.

Deoarece Platforma OpenCart are inclusa baza de date cu 131 de tabele, in cadrul aplicatiei prezentate nu a fost necesara utilizarea tuturor tabelelor. Fiecare tabela contine cuvantul oc in fata numelui.

1. Tabela oc_address: aceasta tabela detine informatii cu privire la adresa utilizatorului, ea contine urmatoarele campuri: addres_id, customer_id, firstname, lastname, address_1, address_2, city, country_id, zone_id.

2. Deoarece partea de administratie a platformei OpenCart este structurata in produse si categorii, tabela oc_category detine informatii din pagina “Oferte Speciale”. Ea contine urmatoarele campuri: category_id, image, parent_id, column, sort_order, status (poate fi enable sau disable), date_added, date_modified.

3. Tabela oc_categoy_description: detine informatii cu privire la descrierea unei carti, meta-titluri, meta-descrieri, care sunt foarte importante pentu SEO (Search Engine Optimization). Tabela contine urmatoarele campuri : category_id, name, description, meta_title, meta_descriprion.

4. Tabela oc_country: aceasta tabela contine numarul total de tari pe care utilizatorul le poate selecta cand isi creeaza un cont. Contine urmatoarele campuri: country_id, name, iso_code_2, iso_code_3, address_format, postcode_requierd.

5. Tabela oc_customer: aceasta tabela contine detaliile personale ale utilizatorului, provenite din creearea contului. Contine urmatoarele campuri: customer_id, firstname, lastname, email, telephone, password, address_id, ip, status, approved, date_added.

6. Tabela oc_customer_login: acesta tabela se refera la autentificarea utilizatorilor. Contine urmatoarele campuri: customer_login_id, email, ip, date_added, date_modified.

7. Tabela oc_product: aceasta tabela detine informatii despre pret si cantitate, greutate. Contine urmatoarele campuri specifice: product_id, model (se refera la numele cartii), quantity, image, shipping, price, height, date_added, date_modified.

8.Tabela oc_product_description: Contine urmatoarele campuri: product_id, name, description, meta_title si meta_description.

9. Tabela oc_product_to_category: contine id-urile tuturor cartilor atat din sectiune categorii cat si din sectiunea produse. Aceasta tabela contine urmatoarele campuri: product_id, category_id.

10. Tabela oc_product_option: Contine urmatorele campuri: product_option_id, option_id, value, required.

11. Tabela oc_order: Acesta tabela detine informatii despre comanda unui produs, precum si detaliile personale ale cumparatorului. Contine urmatoarele campuri: order_id, store_name, customer_id, firstname, lastname, email, telephone, payment_firstname, payment_lastname, payment_address_1, payment_address2, payment_city, payment_country, payment_method, payment_code, shipping_firstname, shipping_lastname, shippling country, shipping_address, total, ip, date_added, date_modified.

12. Tabela oc_order_history: detine informatii despre toate comenzile pe care un utilizator le-a facut in trecut, contine urmatoarele campuri: order_history_id, order_id, order_stauts, comment, date_added.

II.1 Diagram Creator

Diagram Creator este un instrument vizual de proiectare (design) a bazei de date, care integrează dezvoltarea SQL, crearea și întreținerea într-un singur mediu de dezvoltare pentru sistemul de baze de date MySQL.

Capitolul III. Interfata de administrare Opencart

Interfata de administrare opencart are o structura simpla. Aceasta cuprinde statisticile referitoare la comenzi si clienti, extensii, catalog de produse, sistem de configurare a magazinului (setari, utilizatori, localizare) etc. Structura de administrare este alcatuita dintr-un meniu usor de utilizat.

III.1 Structura Catalogului

Catalogul de categorii: contine o lista cu prima jumatate din totalul cartilor. In cadrul acestei sectiuni administratorul poate adauga sau sterge o carte. Urmatorii pasi tin de editarea unei categorii, astfel campurile care poti fi editate sunt: numele cartii, descrierea si poza. Fiecare categorie (carte) dispune de campurile meta-tag-title si meta-description pe care administratorul trebuie sa completeze in mod obligatoriu, in caz contrar o categorie nu va putea fi adaugata sau stearsa, generandu-se o eroare. Optiunea “Parent” permite ca unei categorii principale sa ii fie adaugate o subcategorie.Optiunile “Enabled” si “Disabled”, sunt folosite pentru afisarea sau “ascunderea” unei categorii in interfata principala a magazinului online.

Catalogul de produse: contine lista cu cea de-a doua jumatate din totalul cartilor. Catalogul de produse vine in plus cu mai multe optiuni fata de catalogul categoriilor. In aceasta sectiune administratorul are posibilitatea de a adauga unei carti pretul, editura, cantitatea (numarul de carti disponibile), data (cat timp cartea respective va mai fi in stoc pentru a fi cumparata), greutate. De asemenea toate aceste optiuni poti fi editate, de exemplu schimbarea pretului sau pozei etc. Fiecarui produs principal ii se poate asigna un alt produs (o alta carte existenta) sau o categorie/subcategorie, acestea vor aparea in interfata principala ca si carti sugestive pentru utilizatori. Sectiunea de reduceri (discount) este necesara in implmentarea unui magazine online, fiind foarte atractiva pentru cumparatori.

Producatori (manufacturers): in cadrul aplicatiei prezentate aceasta sectiune contine editurile pentru fiecare carte. Editura va putea fi vizualizata in interfata principala in dreptul cartii respective.

Informatii: catalogul de informatii contine optiunile Termeni si Conditii si Politica de Confidentialitate. Securitatea este un punct important in domeniul online, astfel magazinul online este unicul detinator al tuturor informatiilor colectate cu privire la detaliile persoanle ale utilizatorilor. De asemenea este interzisa furnizarea datelor cu privire la finalizarea si livrarea unei comenzi online.

III.2 Extensii

Module: aceasta sectiune contine o lista de module: slideshow, magazin (store), filtre speciale de cautare, banner si carousel cu imagini, categorii. Toate aceste module sunt integrate de platforma opencard. De mentionat este ca administratorul nu poate adauga un nou modul, acesta le poate folosi doar pe cele existente deja.

Transport (Shipping): aceasta extensie este alcatuita dintr-o lista de metode de transport integrate de platforma opencart. In aplicatia prezentata am ales implementarea extensiei Transport Gratuit (Free Shipping).

Plati (Payments): Majoritatea metodelor de plata disponibile in aceasta sectiune sunt disponibile in strainatate: amazon, authorize.net, worldpay, skrill, sagepay etc. In aplicatia prezentata am ales implementarea unor metode de plata care sunt disponibile si in Romania: transfer bancar, paypal si plata ramburs. Aceste optiuni sunt afisate in interfata principala, la sectiunea finalizeaza comanda, administratorul poate activa sau dezactiva aceste metode de plata utilizand butoanele enabled si disabled .

Comanda (order totals): in cadrul acestei sectiuni sunt disponibile module cu referire la totalul unei comenzi: taxe, totalul comenzilor, sub-total, vouchere cadou, cupoane, puncte accumulate pentru reduceri.

Statusul comezilor: statusul unei comenzi este un punct important deoarece administratorul poate seta stadiul in care se afla o comanda . Acesta are la dispozitie o serie de optiuni care pot fi utilizate pentru o comanda:

comanda anulata

coamanda finalizata cu success

coamnda refuzata

comanda expirata

comada gresita

comanda expediata

comanda in prelucrare

comanda pregatitita pentru trimitere

Instalare extensii: aceasta sectiune permite administratorului instalarea unei noi extensii, pe care doreste sa o utilizeze in aplicatia sa, nefiind disponibila in extensiile integrate de platforma opencard.

III.3 Vanzari

Comenzi: In cadrul acestei sectiuni sunt afisate toate comenzile utilizatorilor. Detaliile cu privire la adresa cumparatorului, nume, prenume, email, metode de plata folosite, numele produsului cumparat, totalul comenzii, data adaugarii in cos a produselor, istoricul comenzilor sunt mentionate in cadrul acestei sectiuni.

Administratorul are posibilitate de a face factura pe produsele care urmeaza a fi trimise spre cumparator, utilizand butonul print. In factura este mentionat numele, adresa, metoda de plata, data si produsele cumparate.

Clienti : aceasta sectiune contine lista clientilor care deja au cumparat online un produs sau mai multe. Elementele importante sunt: numele clientului, data cand a cumparat o carte si e-mailul.

III.4Sistem

Setari: aceasta sectiune pune la dispozitia administratorului o lista de setari care pot fi folosite pentru modificarea interfetei si structurii magazinului online.

Generalitati: in acesta sectiune este necesar ca adminul sa completeze campurile care fac referire la: numele magazinului, numele detinatorului magazinului, adresa, numarul de telefon si e-mailul propriu.

Magazin: templet-ul (design-ul) unui site este foarte important pentru impactul vizual al utilizatorului, de aceea adminul are posibilitate de a folosi un nou template mult mai atractiv si placut decat cel setat in mod implicit de catre platfoma opencart. In aplicatia prezentata am folosit templet-ul in mod implicit pe care l-am modificat in functie de ideile proprii si experienta acumulata in domeniu.

Localizare : tara de provenienta, judetul si limba (romana sau engleza) poti fi setate de catre admin in cadrul acestei sectiuni.

FTP / Mail / Server: Serviciile de gazduire web si inregistrare domenii nu sunt necesare momentan in cadrul aplicatiei prezentate deoarce aceasta este implementata pe un server local.

Design: Sectiunea Design cuprinde doua categorii principle: banere si machete. Machetele cuprind totalitatea paginilor care apar in interfata principaal a magzinului. Adminul poate adauga o pagina noua , pe care ulterior o poate edita sau sterge, de asemenea din aceasta sectiune url-ul poate fi creat sau modificat precum si positionarea paginii respective. Categoria banere contine un slideshow cu produse, care in aplicatia prezentata este dezactivat folosind optiunea disabled.

Utilizatorul intefetei de administrare: aceasta sectiune este dedicata adminului, ea contine detaliile personale ale acestuia, precum si parola cu care se autentifica in interfata de administrare opencart.

Monede: aceasta optiune perminte adaugare mai multor tipuri de monede care for fi afisate langa pretul unui produs, exemple: euro, dolari, leu. In cadrul aplicatiei prezentate moneda aleasa este leul, fiind unitatea monetara a Romaniei.

Tari/ Judete: Aceasta sectiune cuprinde toata tara (Romania), cu un cod aferent al fiecarui judent.

Greutate: Unitatea de masura folosita pentru a masura greutatea unei carti sau mai multor este kilogramul.

III.4Instrumente

Copie (Backup): aceasta optiune permite adminului sa abia o copie asupra bazei de date care contine toate informatile importante din cadrul magazinului online.

III.5Rapoarte

Raportul de vanzari: acest raport detine intr-un tabel numarul produselor, numarul comenzilor, data si totalul unei vanzari. Acestea poti fi cautate printr-un filtru de cautare (butonul search), in functie de zile, saptamani, luni, si anis au in functie de statusul comenenzii respective.

Raportul cu produsele achizitionate: aceasta sectiune contine o lista cu toate cartile care au fost cumparate si livrate cumparatorilor. La fel ca si in cazul rapoartelor de vanzari acestea pot fi cautate printr-un filtru special, dar doar in functie de statusul lor.

Raportul cu privire la activitatea clientului: acest raport contine o lista cu activitatile principale ale clientului. Aceste activitari tin de momentul in care utiliatorul s-a autentificat pe site, editarea profilului sau, intocmirea unei comenzi noi, schimbarea sau cererea unei noi parole de autentificare, inregistrarea cu un cont nou si delogare.

Tari/ Judete: Aceasta sectiune cuprinde toata tara (Romania), cu un cod aferent al fiecarui judent.

Greutate: Unitatea de masura folosita pentru a masura greutatea unei carti sau mai multor este kilogramul.

III.4Instrumente

Copie (Backup): aceasta optiune permite adminului sa abia o copie asupra bazei de date care contine toate informatile importante din cadrul magazinului online.

III.5Rapoarte

Raportul de vanzari: acest raport detine intr-un tabel numarul produselor, numarul comenzilor, data si totalul unei vanzari. Acestea poti fi cautate printr-un filtru de cautare (butonul search), in functie de zile, saptamani, luni, si anis au in functie de statusul comenenzii respective.

Raportul cu produsele achizitionate: aceasta sectiune contine o lista cu toate cartile care au fost cumparate si livrate cumparatorilor. La fel ca si in cazul rapoartelor de vanzari acestea pot fi cautate printr-un filtru special, dar doar in functie de statusul lor.

Raportul cu privire la activitatea clientului: acest raport contine o lista cu activitatile principale ale clientului. Aceste activitari tin de momentul in care utiliatorul s-a autentificat pe site, editarea profilului sau, intocmirea unei comenzi noi, schimbarea sau cererea unei noi parole de autentificare, inregistrarea cu un cont nou si delogare.

Concluzii

Aplicația prezentată în această lucrare contribuie cu succes la structurarea, prezentarea si gestionarea eficientă a unui magazin online.

Realizând această aplicație am dorit să pun în valoare tehnologiile folosite și descrise în lucrare, precum si sa-mi imbogatesc cunostintele mai mult.

Magazinele online au cunoscut o dezvoltare rapida a conceptului inca de la aparitia pe piata reusind sa ocupe un loc bine pozitionat in piata de bunuri si servicii. Acest tip de magazine sunt o afacere care ofera facilitati atat ofertantilor cat si clientilor, asigurandul accesul la anumite bunuri, indiferent de locatia geografica, fiind disponibil 24 din 24 de ore.

Din punctual meu de vedere, aplicatia ar putea fi imbunatatita prin: afisarea informatiei in mai multe limbi straine, implementarea mai multor metode de plata si mai multor tipuri de monede.

Magazinul raspunde cu succes necesitatilor tutoror utilizatorilor care cumpara produse online.

Bibliografie

http://ciobanu.cich.md/lectii_view.php?id=7 (php)

http://www.marplo.net/php-mysql/introducere.html (php)

http://ciobanu.cich.md/lectii_view.php?id=5 (html5)

http://ro.wikipedia.org/wiki/HyperText_Markup_Language (html)

http://ro.wikipedia.org/wiki/JavaScript (javascript)

http://laurian.ro/wordpress/wp-content/uploads/2013/JavaScript_a5.pdf (JAVASCRIPT)

http://vega.unitbv.ro/~cataron/Courses/BD/BD_Cap_5.pdf (sql)

http://www.marplo.net/curs_css/introducere.html {css|}

http://www.code-it.ro/html-5-si-css3-designul-la-un-nou-nivel/ (css)

http://dana-damoc.eu/blog/introducere-la-bootstrap-3/ (bootstrap)

http://onlinepixel.ro/opencart opnrcart

http://docs.opencart.com/installation/ opencart

http://creatikon.ro/online/ecommerce/magazin-online-in-opencart/

http://en.wikipedia.org/wiki/WampServer

Bibliografie

http://ciobanu.cich.md/lectii_view.php?id=7 (php)

http://www.marplo.net/php-mysql/introducere.html (php)

http://ciobanu.cich.md/lectii_view.php?id=5 (html5)

http://ro.wikipedia.org/wiki/HyperText_Markup_Language (html)

http://ro.wikipedia.org/wiki/JavaScript (javascript)

http://laurian.ro/wordpress/wp-content/uploads/2013/JavaScript_a5.pdf (JAVASCRIPT)

http://vega.unitbv.ro/~cataron/Courses/BD/BD_Cap_5.pdf (sql)

http://www.marplo.net/curs_css/introducere.html {css|}

http://www.code-it.ro/html-5-si-css3-designul-la-un-nou-nivel/ (css)

http://dana-damoc.eu/blog/introducere-la-bootstrap-3/ (bootstrap)

http://onlinepixel.ro/opencart opnrcart

http://docs.opencart.com/installation/ opencart

http://creatikon.ro/online/ecommerce/magazin-online-in-opencart/

http://en.wikipedia.org/wiki/WampServer