Durata totală a pregătirii practice 120 ore 3 Calendarul pregătirii 25.06-13.07 2018 4 Perioada stagiului, timpului de lucru ș i orarul(de precizat… [602351]

UNIVERSITATEA DIN CRAIOVA

Facultatea de Matematică
ș
i
Ș
tiin
ț
ele ale Naturii

Departament de Informatică

CAIET DE PRACTICĂ

1

Student: [anonimizat]

2

Durata totală a pregătirii practice

120 ore

3

Calendarul pregătirii

25.06-13.07 2018

4

Perioada stagiului, timpului de lucru
ș
i orarul(de

precizat zilele de pregătire practică în cazul

timpului de lucru par
ț
ial)

Zilnic de Luni până Vineri între orele

08:00
ș
i 16:00

5

Adresa unde s-a derulat stagiul de pregătire practică

Craiova, Str. A. I. Cuza, Nr. 13

6

Proiect

E-commerce-ul în dezvoltarea globală

Tutore,

Conf. Dr. Cîrstea Bobilă

CUPRINS

1
INTRODUCERE
3

2
UNELTE FOLOSIT LA CREAREA SITEULUI WEB
4

2.1
Internetul
4

2.2
Server Web
4

2.2.1
Apache Web Server
5

2.3
Protocolul HTTP
6

2.3.1
Metoda GET
6

2.3.2
Metoda POST
7

2.4
Limbajul HTML
7

2.4.1
Marcaje obligatorii
7

2.4.2
Marcaje op
ț
ionale
8

2.4.3
Limbajul CSS
9

2.5
Limbajul PHP
11

2.5.1
Tipuri de date în PHP
12

2.5.2
Sintaxa
13

2.6
Baze de date
14

2.6.1
Limbajul MySQL
16

3
STUDIU DE CAZ: REALIZAREA UNUI SITE DE COMER
Ț
ELECTRONIC
20

3.1
Baza de date
20

3.2
Arhitectura site-ului
21

3.2.1
Model
22

3.2.2
View
29

3.2.3
Controller
33

3.3
Interfa
ț
a
36

3.3.1
Interfa
ț
a client
37

3.3.2
Interfa
ț
a administrator
40

4
Concluzii
43

5
Bibliografie
44

1
INTRODUCERE

Am ales să descriu în cadrul acestei lucrări de licentă despre un site de comer
ț
electronic

realizat de către mine. Site-ul a fost făcut presupunând că eu ca programator am o comandă de la

o firmă care vinde componente de calculator respective sisteme complete de calcul. Site-ul nu

ș
i-a propus un număr mar e de vizitatori în acela
ș
timp(gen emag, ebay etc), deci nu are nevoie de

o infrastructură foarte dezvoltată, un server cu facilită
ț
i PHP
ș
i MySQL respectiv un pachet de

găzduire de bază de la oricare firmă de hosting este deajuns.
Ș
i aici este un aspect important.

Acest gen de site reprezintă cea mai mare parte din cererea de pe pia
ț
ă. Cam toate firmele care î
ș
i

fac un site au nevoie de un site în care să se prezinte pe ei în
ș
i
ș
i
ș
i produsele lor. Un număr

extreme de mic de firme au nevoie de capabilită
ț
i mai avansate cum ar fi server distribuit, site in

cloud, etc. Ba chiar se poate observa un
ș
ablon clar printre site-urile de comer
ț
electronic, toate

au approximativ acelea
ș
i cerin
ț
e
ș
i func
ț
ionalită
ț
i. Iar eu mă folosesc puternic de acest fapt,

realizând un fel de bibliotecă/API cu ajutorul căruia se pot ob
ț
ine foarte u
ș
or mai multe site-uri

de comer
ț
electronic difer ite, schimbând doar partea vizuală, păstrând aproape intact partea de

procesare
ș
i legătura cu b aza de date. Pentru implementarea acestui
ș
ablon observat am folosit ca

inspira
ț
ie modelul MVC( Model View Controller) pe care o să îl descriu mai in detaliu mai târziu,

în capitolele de teorie. Codul este scris utilizând programarea orientată obiect. Deoarece folosesc

PHP
ș
i programarea orien tată obiect, rezultă că sunt nevoit să folosesc PHP versiunea 5. Din

facilită
ț
ile oferite de prog ramarea orientată obiect nu mă folosesc decât de mo
ș
tenire si

suprascrierea de metode. Lucrarea de licentă va avea următoarea structură: în capitolul doi voi

descrie toate limbajele folosite
ș
i conceptele teoretice necesare construirii site-ului, în capitolul

trei o să descriu site-ul în detaliu, arhitectura,
ș
ablonul amintit mai sus, baza de date, interfa
ț
a

grafică, etc. iar în ultimul capitol o să scriu câteva concluzii găsite cu ocazia realizării site-ului.

Pentru scrierea efectivă a codului am folosit softurile Zend Studio
ș
i Notepad++, ambele
ș
tiind să

autocompleteze denumirea func
ț
iilor PHP. Iar dezvoltarea am făcut-o pe serverul web WAMP

instalat local, pe calculatorul meu.

2
UNELTE FOLOSIT LA CREAREA SITEULUI WEB

În acest capitol voi vorbi de limbajele folosite în crearea site-ului
ș
i de infrastructura

minimală pentru rularea unui site
ș
i de unele aspecte teoretice necesare. Prima întrebare pe care o

punem este: de ce avem nevoie în mod minimal pentru a dezvolta
ș
i rula un site web. Softul

necesar pentru a rula o pagină web se numeste server web, iar infrastructura este internetul. Deci

avem nevoie de o conexiune la internet
ș
i de un server web.

2.1
Internetul

Condi
ț
ia esen
ț
ială pentru ca să poată fi accesat un site este e xisten
ț
a conexiunii la internet a

serverului nostru
ș
i aceas tă conexiune să fie vizibilă. Internetul până la urmă este oglinda unei

re
ț
ele locale, gândit la sca ra globală. Desenat pe hârtie structura are semăna cu o pânză de

paianjen, de aici provenind
ș
i numele de world wide web(ad literam pânză lată cât lumea). Mai

riguros formulat internetul este un graf fără noduri izolate
ș
i fără rute izolate(oricare calculator

poate să acceseze dacă i se permite oricare alt calculator). Fiecare nod din acest graf are o adresă

unică. Modul de comunicare pe internet este reglementat de protocoale. Unele protocoale

definesc modul fizic de transmitere a datelor(cum începe
ș
i cum se incheie comunicarea, modul

de diferen
ț
iere a bitului 0 de bitul 1) altele definesc dialogul între două calculatoare[4, pag 9], iar

altele definesc modul de realizare a conexiunii[4, pag 10]. Protocolul care define
ș
te modul de

adresare a calculatoarelor conectate la re
ț
ea se nume
ș
te IP(Internet Protocol). Ce-a mai

raspândită formă a sa este IPv4 însă odată cu terminarea spa
ț
iului de adresare se va trece pe IPv6.

Principiul e acela
ș
i ca la p atru doar că folosim baza 16 nu 10. De aceea o să descriem doar IPv4.

O adresă IPv4 este format din 4 numere cuprinse între 0
ș
i 255
ș
i sunt separate prin punct. Asta

dacă afi
ș
ăm adresa în form at citibil de om, el fiind în realitate un număr binar pe 32 de bi
ț
i. Dacă

grupăm în 4 acel 32 de bi
ț
i atunci avem 4 grupe de 8 bi
ț
i iar 2 la puterea 8-1=7 este 255. De acea

limita superioară la o grupă este 255. Iar nevoia de grupare vine nu din ordin tehnic ci pentru

u
ș
urin
ț
a administrării, analog cu adresa po
ș
tală(tară, ora
ș
, stradă, număr). De aceea cele 4 grupe

se mai numesc
ș
i clase
ș
i sunt ierarhice, cea mai puternică fiind p rima de la stângă. Clasele sunt

denumite A, B, C, D. Clasa A fiind cea mai puternică. Calculatoarele se descurc cu numerele dar

pentru oameni a fost inventat o modalitate să
ț
ină minte adrese: domeniile. E mult mai u
ș
or de

ț
inut minte
​
www.yahoo.c om
​
în loc de 66.218.71.94[4, pag 11]. Transformarea din număr în

denumire
ș
i invers de fac e de către un server specializat numit DNS(Domain name server) care

are o tabelă de asociere nume-adresă. Deoarece nu e practic ca fiecare server DNS să
ț
ină minte

toate adresele, el re
ț
ine do ar asociere domeniu-adresă conectat în mod direct la DNS
ș
i adresele

DNS-urilor conectate direct cu el însu
ș
i.
Ș
i atunci găsirea unei adrese se bazează pe verificarea în

lista propria
ș
i a întreba v ecinii. Procesul este recursiv, fiecare vecin verificând lista proprie
ș
i

intrebând mai departe. Procesul se opre
ș
te fie când e găsit adresa căutată fie nu mai sunt DNS-uri

de întrebat.

2.2
Server Web

Un server web este un soft care rulează pe un calculator cu scopul dedicat de a furniza

con
ț
inut utilizatorilor(ace st calculator se nume
ș
te tot server, doar că în acest caz ne referim la

partea hardware). Serverul web care reprezintă marea majoritate(63%
ș
i în cre
ș
tere) din

domeniile web active este Apache[1, pag 6], apar
ț
inând Apache Software Foundation. Apache

este open source, gratuit, relativ simplu de configurat,
ș
i versiunile mai noi sunt destul de

performante să satisfacă nevoile unui site cu cerin
ț
e mici
ș
i medii. Dar înainte de toate ce este un

server web mai exact?

Teoretic vorbind, un server web este o aplica
ț
ie client server cu anumite limitări
ș
i

particularită
ț
i. În cadrul u nei aplica
ț
ii client server, clientul trimit e un mesaj către server, serverul

preia acest mesaj, prelucrează informa
ț
ia din mesaj
ș
i dacă e cazul trimite un răspuns înapoi

clientului, sub formă de mesaj. Comunicarea dintre client
ș
i server se face prin porturi. În cazul

unui server web, comunicarea se face prin portul 80, rolul softului client este jucat de browser,

mesajul de la client la server se nume
ș
te cerere(request în engleză), răspunsul există în totdeauna

ș
i se nume
ș
te răspuns(response în engleză). Cererea are un forma t prestabilit, GET sau POST iar

răspunsul furnizat de către server este o pagină HTML plus resursele necesare afi
ș
ării

paginii(imagini, fi
ș
iere de stil CSS etc). Această pagină HTML este defapt rezultatul afi
ș
at de

către site-ul în cauză pentru cererea respectivă. Pentru o altă cerere cel mai probabil va fi un alt

răspuns. Deci putem spune că un site web este un mini-soft care rulează în interiorul unui soft

mai ”mare”, analog cu un program care rulează în interiorul unui sistem de operare. Serverul

web are rolul sistemului de operare din analogia de mai sus. El se ocupă de comunicarea în re
ț
ea.

Ascultă portul 80, când sose
ș
te o cerere serverul cite
ș
te din re
ț
ea cererea, decide cărui site îi este

adresat(un server web poate să stocheze mai multe siteuri în acela
ș
timp)
ș
i activează acel site,

transmi
ț
ând sub formă de argumente linie de comandă parametrii cererii. Ce anume se întâmplă

mai departe este resortul site-ului. Când siteul a terminat de procesat el ”spune” serverului web:

”uite acest răspuns, transmite expeditorului”. Serverul web va transmite înapoi răspunsul siteului

către browserul care s-a conectat la el. Acest flux de comunicare
ș
i regulile aferente sunt definite

într-un protocol de comunicare, numit HTTP. Acest protocol o să fie descris un pic mai pe larg

într-o sec
ț
iunea ulterioară al acestui capitol. Pentru ca un site să poată furniza con
ț
inut dinamic,

el trebuie să fie scris într-un limbaj care e capabil să fie rulat pe un server. Sunt multe asemenea

limbaje, PHP, Java, JSP, Perl, Python, Ruby, etc. Siteul prezentat în această lucrare este scris în

PHP. Pentru ca un site care e scris într-un asemenea limbaj să poate rula trebuie ca serverul web

să ofere suport pentru acel limbaj. Serverul Apache oferă suport pentru limbajul PHP. Acest

”suport PHP” se traduce prin prezen
ț
a unui executabil numit interpretorul PHP care este lansat în

execu
ț
ie de către serverul web de fiecare dată când i se cere un fi
ș
ier cu termina
ț
ia *.php. După

cum vom vedea în sec
ț
iunea dedicată limbajului PHP, PHP este interpretat, nu compilat, de

aceea e nevoie de interpretor. În cazul altor servere
ș
i limbaje executabilul nu mai este un

interpretor ci o ma
ș
ină vi rtuală care lansează în execu
ț
ie un pachet binar(de exemplu Java).

2.2.1
Apache Web Server

Apache este serverul web, funda
ț
ia în cadrul căreia rulează un site, fie el în PHP sau alte

limbaje. Dezvoltarea lui a început în anul 1995 de către un grup de administratori web ce au dorit

să îmbunătă
ț
ească ce era pe pia
ț
ă până în acel moment. Denumire a de Apache este subiect de

discu
ț
ii, unii sus
ț
inând că denumirea vine de la a patchy server(pr oiectul fiind open source

oricine cine doreste putea sa programeze asa că fiecare a venit cu o mică adăugare, modificare

numit patch), al
ț
ii spunân d că au denumit a
ș
a serverul din respect pentru tribul apa
ș
,

binecunoscut din căr
ț
ile lui Karl May. Serverul web este cel care
ș
tie să ruleze interpretorul PHP

ș
i să îi ofere resursele nec esare. Fiecare site ocupă un director în cadrul unui director special,

denumit www. Serverul web
ș
tie să recunoască accesări către aceste foldere. Dacă se scrie

www.ceva.com/numesite, atunci serverul web care rulează la adresa ceva.com
ș
tie automat să

preia cererea clientului, să lanseze interpretorul PHP
ș
i să trimită cererea către fi
ș
ierul PHP din

interiorul directorului numesite. Deobicei Apache nu este instalat niciodata singur, vine la pachet

cu serverul mysql. Aceste pachete se numesc în func
ț
ie de sistemul de operare ar serverului

Wamp sau Lamp (primul pentru windows al doilea pentru linux). Este mult mai facil a
ș
a, altfel

administratorul ar fi nevoit să creeze manual legăturile între MySql
ș
i Apache, lucru foarte

laborios
ș
i expus erorilor. Serverul Apache poate fi extins cu module, asemănător cu PHP-ul.

Sunt module pentru apeluri speciale de tip CURL(comunicare între servere), module pentru

securitate(protocolul criptat Https), lucru cu certificate digitale, etc. Controlul serverului Apache

se face dintr-un fi
ș
ier de c onfigurare httpd.conf
ș
i op
ț
ional, a
ș
a numitele fi
ș
iere .htacces cu care

se poate rafina accesul la informa
ț
ia. De exemplu nu dorim ca cineva să poată să descarce poze

de pe siteul nostru, atunci creăm un fi
ș
ier .htacces în directorul în care sunt stocate pozele.

2.3
Protocolul HTTP

HTTP este un protocol la nivelul de aplica
ț
ie(nivel 7 OSI) pentru sisteme colaborative,

distribuite de hypermedia[2, pag 1]. La nivelul de transport(nivel 4 OSI) protcolul HTTP se

folose
ș
te de TCP/IP, deci un pachet HTTP va fi translatat într-unul TCP la transmisia

propriu zisă. Protocolul este generic, poate fi folosit prin anumite extensii
ș
i la altceva decât

strict hypertext. Elementul de bază în comunicarea dintre două entită
ț
i este, după cum am

mai amintit mesajul. Mesajul în sine este format din: status de succes/eroare, metoda

cererii(GET, POST, etc), informa
ț
ii client(cum ar fi IP-ul)
ș
i un con
ț
inut [2, pag 12].

Informa
ț
iile client, m etoda,
ș
i statusul formează a
ș
a numitul antet(header în engleză). Acest

mod de împachetare a mesajului se nume
ș
te MIME-like(asemănător cu MIME în traducere).

Con
ț
inutul este delim itat de antet printr-o linie goală(con
ț
ine strict caracterul CRLF, adică

linie nouă)][2, pag 31]. Antetul este format din mai multe subantete de forma

nume_antent:valoare. Protocolul HTTP define
ș
te mai multe tipuri de cereri(numit
ș
i

metode)[2, pag 36], dar pe noi ne interesează doar GET
ș
i POST, care indică serverului web

că se dore
ș
te ob
ț
inerea
ș
i transmiterea unui con
ț
inut(resursă). În răspunsul serverului se va

găsi printre altele un status numeric. Lista de valori posibile pentru acest status se găseste la

[2, pag 40], cele mai comune fiind 200(totul în regulă), 404(resursa nu e găse
ș
te la loca
ț
ia

cerută)
ș
i 500(eroare server). Aceste coduri de status se grupeză pe clase, astfel că cele ce

încep cu 2 deobicei indică un success, cele ce încep cu 4 indică o eroare în cererea clientului

ș
i cele care încep cu 5 indică o eroare server.

2.3.1
Metoda GET

Metoda GET este folosită pentru a ob
ț
ine resursa/pagina indicată. Parametrii unei cereri GET

sunt incluse direct in antetul lui GET.[2, pag 53]. Dat fiind că tehnic vorbind un antet este un

ș
ir de caractere, lung imea maximă al unui singur antet este de 255 de caractere. Dacă

condi
ț
iile sunt îndepl inite atunci rezultatul unei cereri de tip GET se poate salva temporar, ca

la o nouă cerere GET de la acela
ș
client se va returna varianta salvată, nu se reexecută acea
ș
i

procesare. Acest proces de salvare temporară se nume
ș
te cacheing în engleză. Trebuie notat

că
ș
i din puct de ved ere a securită
ț
ii, GET este mai vulnerabi l deoarece datele sunt transmise

la vedere, ca un
ș
ir complet vizibil de caractere. Iar legat de
ș
irul de caractere, o cerere GET

se termină la primul caracter de spa
ț
iu(spa
ț
iu simplu, linie nouă, tab, etc) deci dacă dorim de

exemplu să trimitem spre server un
ș
ir care con
ț
ine spa
ț
iu, acest spa
ț
iu trebuia codificat

într-o manieră recunoscută de HTTP. La fel, parametrii unei cereri GET sunt de formă

parametru1=valoare1&parametru2=valoare2 etc. Deci
ș
i caracterele & si = au o semnifica
ț
ie

aparte, astfel sunt considerate pe lângă spa
ț
iu
ș
i alte câteva caractere, caractere speciale. Iar

caractere speciale trebuiesc înlocuite înainte de transmitere cu echivalentul lor codificat.

Această lista de caractere speciale
ș
i echivalentul lor codificat se poate consulta de exemplu

la adresa
​
http://www.degraeve.com/reference/specialcharacters.php
​
. Codificarea cade în

resortul programatorului paginii web de unde se ini
ț
iează cererea spre server.

2.3.2
Metoda POST

Metoda POST e foarte similar cu metoda GET, însă are o diferen
ț
ă foarte importantă.

Parametrii cererii nu vin în acela
ș
moment/antet cu antetul POST, ci antetul POST ”spune”

serverului ”aten
ț
ie, fi pregătit, vor sosi după mine ni
ș
te date”. Iar acele date sunt parametrii

plus valorile asociate. Parametrii se supun aceluia
ș
regului ca
ș
i în cazul GET, însă

codificarea se face automat,
ș
i nu mai avem limita de 255 de caractere. Deoarece parametrii

sunt tran
ș
mi
ș
i împacheta
ț
i în format binar, nu ASCII ca
ș
i în cazul GET, se pot transmite

inclusiv fi
ș
iere către server, folosind metoda POST. O cerere de tip POST nu este cacheable.

Deoarece parametrii tran
ș
mi
ș
i sunt trimise ulterior, pe o alta conexiune internă
ș
i în format

binar, metoda POST este mai sigură decât metoda GET.

2.4
Limbajul HTML

Limbajul HTML este limbajul de bază în care sunt scrise paginile web, fie că sunt generate

dinamic de un alt limbaj fie că sunt statice(scrise direct în HTML). Elementul de bază al

limbajului HTML este marcajul(tag în engleză). Unele sunt op
ț
ionale altele sunt obligatorii.

Majoritatea marcajelor au
ș
i marcaj de închidere de exemplu <p> … </p> indică un paragraf.

2.4.1
Marcaje obligatorii

Vom prezenta pe scurt cele câteva marcaje obligatorii[5, pag 241] din HTML

–
<html> ..</html> Este marcajul de bază, orice pagină web trebuie să inceapă cu <html>

ș
i se termină cu < /html>

–
<body> .. </body> cuprinde conținutul propriu-zis al paginii HTML, adică ceea ce va fi

afișat in ferastra browser-ului. Un marcaj poate fi scris atât cu litere mici, cât și cu litere

mari. De exemplu <BODY> = <BodY> = <body>. Caracterele "spațiu" și "CR/LF" ce

apar între taguri sunt ignorate de catre browser. Marcajul body vine în interiorul

marcajului html, ca orice alt marcaj dealtfel. Marcajul body(ca dealtfel fiecare alt

marcaj) poate sa aiba o serie de atribute care descriu cum sa arate continutul din

interiorul marcajului. Astea printre altele pot fi:

●
TEXT
=
Specifică
o
culoare
generală
pentru
textul
din
pagină.
Aceasta
culoare

va fi aplicată cu tag-ul <FONT COLOR=”…”>;

●
BGCOLOR = Specifică o culoare pentru fundaului paginii;

●
BACKGROUND = Specifică o imaginie pentru fundalul paginii;

●
LINK = Specifică o culoare pentru link-urile din pagina;

●
ALINK = Specifică o culoare pentru link-urile active din pagină;

●
VLINK = specifică o culoare pnetru link-urile vizitate.

Însă
toate
aceste
atribute
au
devenit
depă
ș
ite
si
au
fost
înlocuite
cu
directive
CSS
despre
care
o
să

vorbim
mai
jos.
Toate
aceste
atribute
func
ț
ionează
însă
nu
la
fel
fa
ț
ă
de
toate

browserele, asta fiind scopul principal al CSS.

–
<head>
..
</head>
Acesta
este
marcajul
ce
define
ș
te
antetul
paginii.
Foarte
important,
se

încarcă
tot
timpul
înaintea
body-ului
deci
aici
e
locul
de
asociat
fi
ș
iere
de
stil
CSS
ș
i

Javascripturi,
ca
în
momentul
încărcării
body-ului
browserul
să
aibă
gata
încărcat
modul

de
afi
ș
are
ș
i
eventuale
mici
func
ț
ii.
Tot
aici
se
pot
defini
ș
i
meta
informa
ț
ii
despre

pagină(folosit
în
trecut
de
google
la
căutare)
ș
i
tilul
paginii(textul
ce
apare
în
”urechiu
ș
a”

de la browser(tab în engleză).

Deci structura minimală al oricărei pagini web este:

<html>

<head>

</head>

<body>

</body>

</html>

2.4.2
Marcaje op
ț
ionale

În continuarea o să men
ț
ionez câteva marcaje comune în html, care au statut op
ț
ional, în

sensul că le inserez doar când am nevoie de ele.

–
<H1> … </H1> <H6> … </H6> Sunt folosite pentru a crea titluri in pagină, titluri

având una din dimensiunile standart 1-6. În acest caz, <H1> dă dimensiunea cea mai

mare, iar <H6> cea mai mică.

–
<br> Trece la linia nouă [5, pag 241]

–
<p> </p> Define
ș
te un paragraf. Automat trece la linie nouă.

–
<a href=”adresa”> Text vizibil </a> Crează o legătură către o altă pagină. Vizual vedem

textul ”Text vizibil” pe pagină, în modul prestabilit(se poate schimba din CSS) de

culoare albastră cu textul subliniat,
ș
i dacă se dă click pe ele ne duce pe adresa ”adresa”.

–
<img> Cu ajutorul acestui tag inserăm o imagine in pagina web. În paginile HTML

putem introduce mai mai multe tipuri de imagini, dar cele mai des folosite sunt cele GIF

si JPG. Fisierele GIF sunt imagini ce folosesc cel mult 256 de culori și sunt indicate

pentru imagini de dimensiuni mici (ca dimensiune a fișierului, nu ca suprafața) care nu

necesită o adâncime mare de culoare. Aceasta este formatul cel mai răspândit pe web.

Fisierele JPG sunt imagini ce folosesc pana la 16,7 milioane de culori si de aceea sunt

indicate pentru imagini mai fine, ce necesită claritate, adâncime, dar aceste imagini au,

de obicei și dimensiuni mai mari și atunci se incarcă mai greu. Tag-ul img are structura:

<IMG SRC= “…” ALT =“…” BORDER=”…” WIDTH=”…” HEIGHT=”…”

ALIGN=”…”>;

●
SRC = Stabileste sursa (în engleza = “source” ) imaginii ce trebuie încărcate;

●
ALT = Stabileste textul (de obicei explicativ) ce va fi afișat de browser atunci

când vizitatorul plasează pointer-ul mouse-ului desupra imaginii;

●
BORDER = Dimensiunile border-ului ce va fi desenat în jurul imaginii;

●
WIDTH = Lungimea in pixeli a imaginii;

●
HEIGHT = Înaltimea in pixeli a imaginii;

●
ALIGN = Stabileste alinierea imaginii in cadrul paginii web. Din nou, aceste

atribute au fost preluate de CSS.

–
<table>
<tr>
<td>
</td>
</tr>
</table>
Cu
această
structură
definim
o
tabelă
în
pagina

web.
Table
spune
browserului
ca
”aten
ț
ie,
urmează
o
tabelă,
trateaz-o
ca
atare”.
TR

define
ș
te
un
rând
în
tabelă.
Pot
fi
oricâte
tr-uri
în
interiorul
unui
table.
Iar
TD
define
ș
te
o

celulă
în
interiorul
unui
rând.
Aten
ț
ie,
chiar
dacă
vizual
td
poate
fi
considerat
coloană,
nu

există
no
ț
iunea
de
coloană,
doar
de
celule.
Din
păcate
nu
putem
spune
colorează
coloana

1 în verde, trebuie să specificăm fiecare celulă în parte.

–
<div>
</div>
Define
ș
te
o
zonă
de
demarca
ț
ie
în
pagină.
Nu
are
nici
un
efect
vizual
însă

este
folosit
des
în
CSS,
de
exemplu
vrem
să
aliniem
toate
elementele
dintr-o
zonă
a

paginii,
nu
aliniem
fiecare
element
în
parte
ci
le
băgăm
în
interiorul
unui
div
ș
i
aliniem

div-ul în sine.

–
<form>
<input>
<textarea></textarea>
<select>
<option></option>
</select>
</form>

Pentru
ca
o
pagină
să
devină
dinamică,
să
poată
trimite
informa
ț
ii
spre
server
avem

nevoie
de
formulare.
Marcajul
form
define
ș
te
un
formular
ș
i
are
2
atribute
foarte

importante:
action
ș
i
method.
Atributul
action
define
ș
te
adresa
scriptului
către
care
va
fi

trimis
informa
ț
ia
introdusă
în
formular.
Atributul
method
define
ș
te
metoda
GET
sau

POST
folosită
la
transmitere.
În
caz
că
dorim
să
transmitem
un
fi
ș
ier
trebuie
să
precizăm

ș
i
atributul
encty pe.
Marcajele
input
definesc
câmpuri
de
text
de
o
linie
sau
căsu
ț
e
de

bifat.
Fiecare
input
are
un
atribut
obligatoriu,
name.
Name
precizează
numele
sub
care
se

va
regăsi
valoarea
din
interiorul
căsu
ț
ei
după
ce
se
trimite
la
server.
Fiecare
limbaj
de

programare
pe
partea
de
server
are
diferite
metode
de
a
regăsi
această
informa
ț
ie,
în
PHP

acesta
se
află
în
vectorul
special
$_REQUEST,
cu
cheia
egal
cu
valoarea
atributului

name,
si
valoarea
egal
cu
ceea
ce
s-a
introdus
în
căsu
ț
ă.
Textarea
define
ș
te
o
căsu
ț
ă
de

text mai mare. Select define
ș
te un meniu derulant.

–
<ul>
<li>
</li>
</ul>
Aceste
marcaje
compun
o
listă
în
html.
Ul
precizează
că
începe
o

zonă care constituie o listă iar li define
ș
te un element din cadrul listei.

2.4.3
Limbajul CSS

Fi
ș
iere
ș
e de stil în cascada, sau CSS sunt asociate fi
ș
ierului HTML
ș
i hotărăsc elementele

vizuale din pagină. Înainte de introducerea CSS fiecare browser interpreta marcajele gen <font>,

<b>, sau atributele gen border, valign, width, etc în modul în care implementau creatorii

browserului codul. Iar creatorii browserului erau oameni, adică supu
ș
i gândirii proprii. Chiar

dacă existau anumite încercări de standardizare mai apăreau
ș
i discrepan
ț
e între cum ”desenau”

pagina două browsere. De multe ori nu se putea face o standardizare al unui element că era atât

de adânc implementat în cod că însemna rescrierea aproape în totalitate a browserului.
Ș
i atunci

s-a inventat un mod extern HTML-ului în care să fie precizate toate directivele de afi
ș
are din

HTML plus
ș
i elemente n oi care să fie implementat de creatorii de browsere în colaborare unul

cu celălalt astfel ca la final o directivă să fie interpetată la fel de orice browser. Chiar
ș
i a
ș
a, acest

lucru nu a fost indeplinit decât pe la ultima versiune, CSS3 respectiv browserele moderne. Un

fi
ș
ier de stil se asociează unei pagini html prin marcajul link, inserat obligatoriu în zona head al

paginii. Fiecare marcaj din html are două atribute de care nu am vorbit încă, id si class. Aceste

două atribute nu au nici un rol func
ț
ional, servesc doar la indentificarea unui marcaj anume sau

al unui grup de marcaje. ID este pentru un anume marcaj
ș
i trebuie să fie unic în cadrul paginii

iar class este pentru un grup de marcaje. În CSS un stil pentru id se define
ș
te sub forma #nume {

..directive } iar pentru clasă este .nume {.. directive..}. De exemplu avem în html următorul cod

<span id=”span_verde”>Ceva text</span> iar în CSS avem #span_verde { text-color: green }.

Această asociere va cauza ca textul din interiorul span-ului să fie afi
ș
at cu verde. La fel se

întâmplă
ș
i în cazul class, doar că atunci fiecare span din clasa span_verde va fi afi
ș
at cu verde.

Denumirea de stil în cascadă este dat de cele 3 moduri în care se pot preciza aceste directive de

stil
ș
i ierarhia dintre ele. P rima variantă este asocierea unui fi
ș
ier extern de stil. Aceasta are cea

mai scăzută prioritate. A doua este cu ajutorul marcajului style, introdus obligatoriu in head,

aceasta are prioritate medie. Ultima
ș
i cea mai puternică este cu ajutorul atributului style, prezent

în marcaj. De exemplu să presupunem că avem o clasă numit span_obisnuit definit sub forma

.span_obisnuit{ color: black}, un marcaj style de forma <style> .span_obisnuit{ color:yellow }

</style>
ș
i un marcaj <sp an class=”span_obisnuit” style=”color: green”> Ceva text </span>.

Textul afi
ș
at va fi verde. De ce? Pentru că: în fi
ș
ierul extern eu definesc culoarea să fie neagră,

dar în sec
ț
iunea head al p aginii suprascriu această regulă
ș
i spun să fie galben însă în atributul

style al span-ului suprascriu
ș
i această regulă
ș
i spun să fie verde. Puterea unui fi
ș
ier extern de

stil constă în faptul că se poate asocia mai multor fi
ș
iere html. Astfel printr-un singur fi
ș
ier de stil

putem determina cum arată fiecare pagină ce compune siteul. Fiecare directivă este de forma

nume:valoare . În continuare voi prezenta câteva directive foarte folosite în CSS:

–
Color: Precizează culoarea textului la care se aplică. Sunt câteva constante predefinite ex

black, white, green, etc în rest se precizează valoarea RGB în hexadecimal precedat de

semnul #.

–
Font-size: Precizează mărimea în pixeli a textului. Aten
ț
ie, 12px nu este egal cu mărimea

12 din editoare gen word.

–
Font-weight: Precizează cât de îngro
ș
at e textul. Sunt câteva constante predefinite: thin,

bold, bolder, normal

–
Background-color: Culoarea de fundal al marcajului. Deobicei se aplică la div, span sau

td

–
Margin: Precizează distan
ț
a în pixeli la care să se situeze elementul fa
ț
ă de cel precedent.

Are patru variante, în func
ț
ie de direc
ț
ia la care mă refer: margin-left, margin-right,

margin-top, margin-bottom.

–
Text-align: Alinierea textului, clasic. Stânga, centru, dreapta.

–
Text-decoration: Se referă la sublinierea textului sau tăierea cu o linie orizontală

–
Display: Acesta este unul din directivele mai greu de folosit
ș
i în
ț
eles. Cel mai des se

folose
ș
te să se as cundă un element de pe pagină care ulterior va fi afi
ș
at din Javascript.

Comanda pentru asta este diplay:none . Valoarea de bază este inline(elementele sunt

afi
ș
ate unu lângă altul fără să treacă în linie nouă). Restul de valori posibil controlează

dacă
ș
i când anum e se trece la linie nouă(înainte de afi
ș
are, după afi
ș
are etc).

–
Width, height: Define
ș
te lă
ț
imea
ș
i înăl
ț
imea în pixeli al marcajului. Fiecare are trei

variante. Min-width, max-width, width. Width precizează exact lă
ț
imea. Chiar dacă

con
ț
inutul este m ai lat sau mai pu
ț
in lat decât valoarea pr ecizată, el va fi for
ț
at la acea

dimensiune. Min-width precizează dimensiunea minimă. Dacă con
ț
inutul marcajului este

mai mic decât acea lă
ț
ime atunci va fi lă
ț
it for
ț
at. Însa dacă e mai mare el nu va fi

mic
ș
orat. Max-w idth este inversul lui min-width. Dacă lă
ț
imea reală a con
ț
inutului

depă
ș
e
ș
te limita impusa, acesta va fi mic
ș
orat for
ț
at la acea valoare. Analog
ș
i pentru

înăl
ț
ime.

–
Padding: Foarte asemănător cu margin
ș
i în trecut cauzatoare a multe incompatibilită
ț
i

între browsere. În loc să definească distan
ț
a marcajului fa
ț
ă de marcajul precedent,

padding define
ș
te distan
ț
a con
ț
inutului fa
ț
ă de marginea marcajului curent. De exemplu

dacă dorim ca textul din interiorul celulei chiar dacă e aliniat stânga să nu înceapă exact

de la dunga verticală ce reprezintă marginea stângă a celulei atunci scriem

padding-left:5px

2.5
Limbajul PHP

Inițial, PHP era acronim pentru “Personal Home Page” (pagină de bază personală), un

limbaj de scriptare creat in 1994 de Rasmus Lerdorf[3, pag 1] pentru a contabiliza vizitatorii

CV-ului personal, publicat în Internet. PHP-ul este făcut public în debutul anului 1995 sub

denumirea de Personal Home Page Tools, fiind considerat un analizor simplist care interpreta

câteva macrouri ce puteau fi incluse în cadrul documentelor HTML, permițând contorizarea

accesului la paginile Web sau accesarea unei carți de oaspeți (guestbook). Analizorul a fost

rescris la mijlocul aceluiași an și denumit PHP/FI 2.0, unde FI era o alta aplicație scrisă de

Rasmus Lenford, un interpretor de formulare HTML. A fost adăugat și suportul pentru bazele de

date MySQL și astfel PHP/FI a început să aibă succes, fiind disponibil gratuit pe Web. Se

estimează că la sfârșitul lui 1996 cel puțin 15 mii de site-uri Web utilizau PHP/FI, iar în anul

1997 numărul acestora era de 50 de mii[6, pag 12].

După ce funcționalitatea și utitatea limbajului au fost dezvoltate (și pe masură ce a inceput

sa fie folosit în contexte cu caracter mai profesional), numele limbajului a devenit “PHP:

Hypertext Preprocessor” (preprocesor de hypertext).[7] În conformitate cu site-ul Web Php

oficial aflat la adresa www.php.net, PHP este “un limbaj de scriptare înglobat în HTML”. A

spune că PHP este înglobat în HTML înseamnă că scripturile PHP pot fi întrețesute cu cod

HTML, ceea ce face mult mai ușoară dezvoltarea site-urilor Web dinamice. PHP este un limbaj

de script care funcționează alături de un server Web. 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

comanda afișate în final într-o pagină HTML, veți scrie o pagină HTML cu codul inclus pentru a

realiza o acțiune precisă (în cazul nostru se va afișa un text). O altă diferen
ț
ă, majoră fa
ț
ă de alte

limbaje este că PHP este un limbaj interpretat, nu compilat. Se execută comandă cu comandă,

linie cu linie codul sursă, nu se genereaza un executabil prin compilare, care ulterior poate fi

rulat
ș
i fără interpretor. T ot din cauza faptului că e interpretat nu compilat PHP este mai lent

decât alte limbaje.

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". [6, pag 12] <?php ?>

De asemenea este un limbaj de scriptare, nu un limbaj de programare propriu-zis, ceea ce

înseamnă că PHP a fost conceput pentru scrierea scripturilor Web, nu a unor aplicații

independente. Scripturile sunt rulate numai dupa ce apare un eveniment – de exemplu atunci

când un utilizator transmite un formular sau vizitează o adresă URL.

Ca o completare pentru această definiție putem spune că PHP este o tehnologie pe parte de

server, interplatformă, ambele descrieri fiind importante. Ca o completare pentru această

definiție putem spune că PHP este o tehnologie pe parte de server, interplatformă, ambele

descrieri fiind importante. Sintagma “pe parte de server ” se referă la faptul că acțiunile unui

script PHP sunt executate pe server (nu pe client, respectiv calculatorul pe care ruleaza browserul

utilizatorului care vizează un site Web). Natura interplatformă a limbajului înseamnă că PHP

rulează pe majoritatea sistemelor de operare, inclusiv pe Windows, Unix (cu multiple variante

ale acestuia) și Macintosh[3, pag 3]. Mai important este faptul că scripturile scrise pe un server

funcționează în mod normal și pe alte servere, asa cum sunt sau cu mici modificări. PHP

versiunea 5 introduce suportul pentru programarea orientata obiect, în stil JAVA(mo
ș
tenire

simplă).
Ș
i acuma sa prez entăm bazele limbajului PHP

2.5.1
Tipuri de date în PHP

Ca
ș
i în orice limbaj de p rogramare, elementul de bază este variabila, adică o zonă de memorie

identificabilă prin nume. În PHP orice variabilă este precedat de semnul $. Însă spre

diferen
ț
ă de limba jele de programare de sine stătătoare(PHP are nevoie de interpretor ca

să fie rulat) nu este necesar declararea apriori a tipului unei variabile, aceste este dedus

din context. Dacă la următoarea comandă folosim o variabilă în alt context decât înainte,

acesta nu dă eroare ci este comutat automat la noul tip(deci aten
ț
ie, poate cauza erori greu

de găsit). Asemănător cu limbajul Java, chiar dacă intern e folosit, programatorul nu

poate să lucreze explicit cu pointeri. Totu
ș
i, chiar dacă nu le declarăm, tipurile de date

există
ș
i sunt mom ente în care trebuie să ne aducem aminte de ele. Aceste tipuri pe scurt

pot fi[3, pag 29]:

–
Boolean. Variabilele de acest tip pot avea doar două valori: ADEVARAT sau FALS.

Aceste valori pot fi indicate prin cuvintele cheie TRUE sau FALSE (pentru ambele nu se

face distincție între literele mari și literele mici). Valoarea 0 este considerată FALSE, iar

toate variabilele diferite de 0 sau care au atribuită o valoare sunt considerate TRUE.

–
Integer: O variabilă de tip integer reprezintă o valoare din mulțimea numerelor întregi.

Acest număr poate fi specificat în baza 10, în baza 16 sau în baza 8, convențiile fiind

aceleași ca și în limbajele C/C++ sau Java. Modul de reprezentare depinde de platforma

utilizată; de obicei se folosește reprezentarea pe 32 de biți. Astfel un număr întreg se

situează între -32767
ș
i 32768[8, pag 11]. Interpretorul PHP nu oferă suport pentru

numerele întregi fără semn.

–
Float O variabilă de tip float poate fi specificată folosind fie forma zecimală, fie cea

stiințifică (cea cu exponent). La fel ca și în cazul tipului integer, precizia variabilelor de

tipul float este dependentă de platforma utilizată.

–
String O variabilă de tip string reprezintă un șir de caractere. Un caracter se reprezintă pe

un octet, deci sunt 256 de caractere distincte. Lungimea variabilelor de tip string nu este

limitată de către interpretor și se specifică prin folosirea ghilimelelor simple sau prin

folosirea ghilimelelor duble. Însă este există o diferen
ț
ă semnificativă între un
ș
ir definit

cu ghilimele simple
ș
i cel definit cu ghilimele duble. Textul din interiorul ghilimelelor

duble este interpretat. De exemplu să presupunem că avem variabila $nr=5. Afi
ș
at pe

ecran ”Numarul este $nr” afi
ș
ează Numarul este 5 iar ‘Numarul este $nr’ afi
ș
ează exact

textul.

–
Array: Reprezintă tipul vector, însă spre diferen
ț
ă de multe alte limbaje, el poate să aibă

ș
i chei formate d in text. Deci Variabila $a[“maxim”] este la fel de corect ca
ș
i $a[0].

Sunt câ
ț
iva vecto ri predefini
ț
i în PHP: $_REQUEST con
ț
ine to
ț
i parametrii trimi
ș
i către

server în momentul unei cereri, $_SERVER con
ț
ine date despre server, gen adresa IP,

calea locală, numele scriptului curent. Un lucru important de
ț
inut minte este durata de

viata al variabilelor în PHP: cât timp se execută un script
ș
i atât. La limbajele de

programare care nu sunt specializate pe server ci rulează de sine stătător până nu

inchidem programul variabilele trăiesc în memorie, chiar dacă s-a executat o ac
ț
iune. În

PHP procesarea unei cereri coincide cu terminarea ”programului”. Dacă dorim să

accesăm rezultatele unei procesări anterioare avem două variante: fie le re
ț
inem în baza

de date fie le adăugăm la vectorul sesiune numit $_SESSION care păstrează valori până

clientul închide browserul de internet.

–
Obiect: Instan
ț
ă al unei clase, rezultatul comenzii new.

Concluzii

În lucrarea prezentă am arătat că prin construirea unei arhitecturi simple se pot realiza u
ș
or

mai multe siteuri de acela
ș
gen, deoarece partea grafică este pe cât posibil separată de partea de

procesare. Arhitectura creată de mine nu este specifică magazinelor ce comercializează

componente de calculatoare, eu am ales această categorie pentru siteul meu din cauza u
ș
urin
ț
ei

găsirii datelor. Siteul nu î
ș
i propune să satisfacă nevoile unor firme gen emag sau depozitul de

calculatoare, de nivel na
ț
ional. Însă pentru o firmă care dore
ș
te să vândă produse într-un ora
ș

ș
i

vrea prezen
ț
ă online, este suficientă. Din punct de vedere al programatorului siteul se comportă

ca o biliotecă. Odată creată biblioteca, este suficient să schimbăm partea grafică
ș
i dintr-un site

de produse IT ob
ț
inem un site de produse florale sau bijuterii handmade, scutind astfel

programatorul de un efort considerabil(partea de procesare se păstrează). Chiar
ș
i la siteuri

străine, dar mai pu
ț
in cun oscute(deci firmei mai mici) se observă acela
ș
sistem. De exemplu la o

căutare în google folosind cheap pc components glasgow(deci un oră
ș
el micu
ț
comparat cu restu)

găsim siteuri asemănătoare:
​
http://www.pless.co.uk/home.php

Welcome!

​
. Evident siteul
ș
i sistemul poate fi îmbunătă
ț
it într-o lucrare

viitoare: i se poate asocia un sistem de stocuri într-un mod u
ș
or(un nou câmp în tabela produse), i

se poate asocia o parte grafică mai profesionistă(mă refer la HTML + CSS, din lipsa de

experien
ț
ă siteul l-am cre at pornind de la un template free de pe artisteer.com), i se poate

îmbunătă
ț
i securitatea(eu am evitat doar cele mai comune probleme, descrise în tutoriale, cum ar

fi MySql injection, rezolvat prin PreparedStatement
ș
i inserarea de cod javascript răuvoitor prin

folosirea comenzii strip_tags). Consider că am atins scopul lucrării, de a crea un sistem simplu
ș
i

u
ș
or de modificat, care po ate fi mulat pe multe siteuri de e-commerce.

3
Bibliografie

1.
Il-Horn Hann, Jeff Roberts, Sandra Slaughter -”Delayed Returns to Open Source

Participation: An Empirical Analysis of the Apache HTTP Server Project”

2.
J. Mogul, J. Gettys, R. Fielding, H. Frystyk-”
​

​
Hypertext Transfer Protocol – HTTP/1.1”

3.
Steven HOLZNER-„Ini
ț
iere în PHP5”

4.
Alin Vasile Mnerie, Florin Molnar-Matei-„Îndrumător de laborator”

5.
Ion Rare
ș
Stanciu , Adriana Bebe
ș
elea, Alin Vasile Mneri e, Mircea Krepelka, Ioan

Groza, Veronica Kürti, Antonela Kőrösi, Titus Slavici, Gabriela Victoria Mnerie, Liliana

Dorneanu-“Utilizarea calculatoarelor în mediul economic”

6.
Larry Ulman – ”Php
ș
i MySQL pentru site-uri web dinamice”

7.
ANGHEL, Traian – „Dezvoltarea aplicațiilor WEB folosind XHTML, PHP și MySQL”

8.
Titus Slavici,
Ș
erban Popa, Karina Hermann – ”Limbaje de programare”

9.
Ioan Despi, Reisz Robert, Gheorghe Petrov, Aurel Stepan – ”Teoria generală a bazelor

de date”

10.
E.F.Codd – „A Relational Model of Data for Large Shared Data Banks”

11.
E.F.Codd – „Relational database: a practical foundation for productivity”

12.
Model-View-Controller: A Design Pattern for Software

https://ist.berkeley.edu/as-ag/pub/pdf/mvc-seminar.pdf