Subsemnatul NEACȘU ALIN -GEORGEL, student la specializarea INGINERIA SISTEMELOR [631515]

Licență

Subsemnatul NEACȘU ALIN -GEORGEL, student la specializarea INGINERIA SISTEMELOR [631515]

Byadmin ianuarie 1, 2024

UNIVERSITATEA DIN CRAIOVA
FACULTATEA DE AUTOMATICĂ, CALCULATOARE ȘI ELECTRONICĂ

DEPARTAMENTUL DEPARTAMENTUL DE AUTOMATICĂ ȘI
ELECTRONICĂ

PROIECT DE DIPLOMĂ

Coordonator: Șef lucrări Dr. Ing . Rădulescu V irginia

Absolvent: [anonimizat] – Georgel Neacș u

Craiova
Iulie, 2018

UNIVERSITATEA DIN CRAIOVA
FACULTATEA DE AUTOMATICĂ, CALCULATOARE ȘI
ELECTRONICĂ

DEPARTAMENTUL DEPARTAMENTUL DE AUTOMATICĂ
ȘI ELECTRONICĂ

REALIZAREA UNUI MAGAZIN VIRTUAL

Coordonator: Șef lucrări Dr. Ing . Rădulescu Vi rginia

Absolvent: [anonimizat]-Georgel Neacsu

Craiova
Iulie, 2018

DECLARAȚIE DE ORIGINALITATE

Subsemnatul NEACȘU ALIN -GEORGEL, student: [anonimizat], Calculatoare și Electronică a Universității din
Craiova, certific prin prezenta că am luat la cunoștință de cele prezentate mai j os și că îmi asum, în acest
context, originalitatea proiectului meu de licență:
 cu titlul REALIZAREA UNUI MAZIN VIRTUAL.
 coordonată de Prof. : RĂDULESCU VIRGINIA.
 prezentată în sesiunea IULIE 2018 .
La elaborarea proiectului de licență, se consideră plagi at una dintre următoarele acțiuni:
 reproducerea exactă a cuvintelor unui alt autor, dintr -o altă lucrare, în limba română sau prin
traducere dintr -o altă limbă, dacă se omit ghilimele și referința precisă,
 redarea cu alte cuvinte, reformularea prin cuvinte proprii sau rezumarea ideilor din alte lucrări,
dacă nu se indică sursa bibliografică,
 prezentarea unor date experimentale obținute sau a unor aplicații realizate de alți autori fără
menționarea corectă a acestor surse,
 însușirea totală sau parțială a unei lucrări în care regulile de mai sus sunt respectate, dar care are
alt autor.
Pentru evitarea acestor situații neplăcute se recomandă:
 plasarea între ghilimele a citatelor directe și indicarea referinț ei într -o listă corespunzătoare la
sfărșitul lucrării,
 indicarea în text a reformulării unei idei, opinii sau teorii și corespunzător în lista de referințe a
sursei originale de la care s -a făcut preluarea,
 precizarea sursei de la care s -au preluat date experimentale, descrieri tehnice, figuri, imagini,
statistici, tabele et caetera,
 precizarea referințelor poate fi omisă dacă se folosesc informații sau teorii arhicunoscute, a căror
paternitate este unanim cunoscută și acceptată.
Data, Semnă tura candidat: [anonimizat],

UNIVERSITATEA DIN CRAIOVA
Facultatea de Automatică, Calculatoare și Electronică

Departamentul de Automatică și Electronică
Aprobat la data de
…………………
Director de
departament,
Prof. dr. ing.
Cosmin IONETE

PROIECTUL DE DIPLOMĂ

Numele și prenumele student: [anonimizat]/ -ei:
Neacșu Alin -Georgel

Enunțul temei:

Realizarea unui magazin virtual

Datele de pornire:

Crearea unui site cu ajutorul HTML și CSS

Conținutul proiectului:

1. Introducere
2. Noțiuni generale despre HTML și CSS
3. Noțiuni generale despre JavaScript și jQuery
4. Tehnologii utilizate
5. Concluzii

Material grafic obligatoriu:
Da

Consultații:
Periodice
Conducătorul științific
(titlul, nume și prenume, semnătura): Șef lucrări Dr. Ing . Rădulescu Virginia

Data eliberării temei:
10.11.201 7

Termenul estimat de predare a
proiectului:
22.06 .2018

Data predării proiectului de către
student și semnătura acestuia:

UNIVERSITATEA DIN CRAIOVA
Facultatea de Automatică, Calculatoare și Electronică

Departame ntul de Automatică și Electronică

REFERATUL CONDUCĂTORULUI ȘTIINȚIFIC

Numele și prenumele candidatului/ -ei: Neacșu Alin -Georgel
Specializarea: Ingineria Sistemelor Multimedia
Titlul proiectului: Realizarea unui magazin virtual
Locația în care s -a realizat practica de
documentare (se bifează una sau mai
multe din opțiunile din dreapta): În facultate □
În producție □
În cercetare □
Altă locație: [ se detaliază ]

În urma analizei lucrării candidatului au fost constatate următoarele :
Nivelul documentării Insuficient
□ Satisfăcător
□ Bine
□ Foarte bine
□
Tipul proiectului Cercetare
□ Proiectare
□ Realizare
practică □ Altul
[se detaliază ]
Aparatul matematic utilizat Simplu
□ Mediu
□ Complex □ Absent
□
Utilitate Contract de
cercetare □ Cercetare
internă □ Utilare
□ Altul
[se detaliază ]
Redactarea lucrării Insuficient
□ Satisfăcător
□ Bine
□ Foarte bine
□
Partea grafică, desene Insuficientă
□ Satisfăcătoare
□ Bună
□ Foarte bună
□
Realizarea
practică Contribuția autorului Insuficientă
□ Satisfăcătoare
□ Mare
□ Foarte mare
□
Complexitatea
temei Simplă
□ Medie
□ Mare
□ Complexă
□
Analiza cerințelor Insuficient
□ Satisfăcător
□ Bine
□ Foarte bine
□
Arhitectura Simplă
□ Medie
□ Mare
□ Complexă
□
Întocmirea
specificațiilor
funcționale Insuficientă
□ Satisfăcătoare
□ Bună
□ Foarte bună
□
Implementarea Insuficientă
□ Satisfăcătoare
□ Bună
□ Foarte bună
□
Testarea Insuficientă
□ Satisfăcătoare
□ Bună
□ Foarte bună
□
Funcționarea Da Parțială Nu

□ □ □
Rezultate experimentale Experiment propriu
□ Preluare din bibliografie
□
Bibliografie Cărți
Reviste
Articole
Referințe web

Comentarii
și
observații

În concluzie, se propune:

ADMITEREA PROIECTULUI
□ RESPINGEREA PROIECTULUI
□

Data, Semnătura conducătorului științific,

REZUMATUL PROIECTULUI

Tema „realizarea unui magazin virtual” a fost aleasă pentru a detalia conceptele legate de noile
tehologii de creare a unui site web , de la structura și interfață grafică și până la finalizare, introducând
date care alcătuiesc conținutul, cum ar fi text, fișiere, imagini și multe altele.
În primul capitol va fi definită noțiunea de HTML.
În cel de -al doilea capitol, vor fi definite notiunile de Java Script si CSS.
Apoi va fi descrisă aplicația di n punct de vedere funcțional împreună cu câteva cazuri principale
de utilizare.
În ultima parte a lucrării, va fi prezentată structura aplicației, modelul de date creat pentru această
aplicație, dar și detalierea responsabilității părților componente ale a plicației web create.

Cuprins

INTRODUCERE ………………………….. ………………………….. ………………………….. ………………………….. …….. 11
CAPITOLUL 1 HTML și CSS ………………………….. ………………………….. ………………………….. ……………. 13
Introducere ………………………….. ………………………….. ………………………….. ………………………….. ……………… 13
Formatarea textelor ………………………….. ………………………….. ………………………….. ………………………….. . 14
Liste ………………………….. ………………………….. ………………………….. ………………………….. …………………… 15
Tabele ………………………….. ………………………….. ………………………….. ………………………….. …………………. 15
LINK -URI ………………………….. ………………………….. ………………………….. ………………………….. …………… 16
IMAGINI ………………………….. ………………………….. ………………………….. ………………………….. ……………. 17
CSS ( Cascading Style Sheets ) ………………………….. ………………………….. ………………………….. …………. 17
ETICHETE CSS ………………………….. ………………………….. ………………………….. ………………………….. . 18
Elementele id și class ………………………….. ………………………….. ………. Error! Bookmark not defined.
FONTURI ………………………….. ………………………….. ………………………….. ………………………….. ……….. 18
FORMATARE TEXT ………………………….. ………………………….. ………………………….. ……………………. 19
BACKGROUND ………………………….. ………………………….. ………………………….. ………………………….. 19
STILURI PENTRU LISTE ………………………….. ………………………….. ………………………….. …………….. 19
Chenare si margini ………………………….. ………………………….. ………….. Error! Bookmark not defined.
CAPITOLUL 2 JAVASCRIPT SI jQuery. ………………………….. ………………………….. ………………………….. . 22
INTRODUCERE ………………………….. ………………………….. ………………………….. ………………………….. …. 22
STRUCTURA ………………………….. ………………………….. ………………………….. ………………………….. ……… 23
EXPRESII LOGICE ………………………….. ………………………….. ………………………….. …………………………. 24
STRUCTURI REPETI TIVE ………………………….. ………………………….. ………………………….. ………………. 24
Definirea unei funcții ………………………….. ………………………….. ………….. Error! Bookmark not defined.
Apelarea funcțiilor ………………………….. ………………………….. ……………… Error! Bookmark not defined.
VARIABILE ………………………….. ………………………….. ………………………….. ………………………….. ……….. 26
JQUERY ………………………….. ………………………….. ………………………….. ………………………….. …………. 26
Bootstrap ………………………….. ………………………….. ………………………….. ………………………….. ………………… 27
Capitolul 3 Dezvoltarea unei aplicații pentru crearea unui magazin virtual ………………………….. …………… 29
Tehnologii utilizate ………………………….. ………………………….. ………………………….. ………………………….. . 29
C# ………………………….. ………………………….. ………………………….. ………………………….. ………………………….. 29
Ce tipuri de aplicații pot fi dezvoltate cu ajutorul C# ………………………….. ………………………….. ……… 29
ASP.NET MVC – Framework și design pattern ………………………….. ………………………….. ……………………. 30

Design pattern – definiții ………………………….. ………………………….. ………………………….. ………………… 30
Model View Controller – MVC ………………………….. ………………………….. ………………………….. ………. 31
ASP.NET MVC ………………………….. ………………………….. ………………………….. ………………………….. .. 32
MYSQL Server ………………………….. ………………………….. ………………………….. ………………………….. ……….. 34
Entity Framework ………………………….. ………………………….. ………………………….. ………………………….. ……. 38
Prezentarea aplicației dezvoltate ………………………….. ………………………….. ………………………….. …………….. 40
Din perspectivă funcțională ………………………….. ………………………….. ………………………….. …………………… 40
Cazu ri de utilizare ………………………….. ………………………….. ………………………….. ………………………….. ……. 41
Diagrama bazei de date ………………………….. ………………………….. ………………………….. …………………………. 44
Privire asupra codului sursă al aplicației dezvoltate ………………………….. ………………………….. ………………. 52
Concluzii ………………………….. ………………………….. ………………………….. ………………………….. ………………… 65
Bibliografie ………………………….. ………………………….. ………………………….. ………………………….. …………….. 66

Lista figurilor
Figure 1 Exemplu tabel ………………………….. ………………………….. ………………………….. …………………………. 16
Figure 2: Chenar ………………………….. ………………………….. ………………………….. ………………………….. ……… 20
Figure 3: Home page – view c ontroller ………………………….. ………………………….. ………………………….. …… 21
Figure 4: Slider produse ………………………….. ………………………….. ………………………….. ………………………… 27
Figure 5: Model de clase ………………………….. ………………………….. ………………………….. ……………………….. 31
Figure 6: Index ………………………….. ………………………….. ………………………….. ………………………….. ………… 33
Figure 7: Autentificare ………………………….. ………………………….. ………………………….. ………………………….. 41
Figure 8: Inregistrare ………………………….. ………………………….. ………………………….. ………………………….. … 42
Figure 9: Comanda produse ………………………….. ………………………….. ………………………….. …………………… 43
Figure 10: Diagrama bazei de date ………………………….. ………………………….. ………………………….. …………. 44
Figure 11: Produse ………………………….. ………………………….. ………………………….. ………………………….. …… 45
Figure 12: Clienti ………………………….. ………………………….. ………………………….. ………………………….. …….. 46
Figure 13: Comenzi ………………………….. ………………………….. ………………………….. ………………………….. ….. 47
Figure 14: Comanda produse ………………………….. ………………………….. ………………………….. …………………. 47
Figure 15: Furnizori ………………………….. ………………………….. ………………………….. ………………………….. …. 48
Figure 16: Cos cumparaturi ………………………….. ………………………….. ………………………….. …………………… 49
Figure 17: Asp net users ………………………….. ………………………….. ………………………….. ……………………….. 51
Figure 18: Structura proiect ………………………….. ………………………….. ………………………….. …………………… 52

INTRODUCERE

Un site web este alcătuit de regulă din mai multe pagini . O pagină web este un document definit
cu ajutorul limbajului HTML și limbaje d e programare cum ar fi PHP, ASP.net fiind accesibil celui
care acceseaza pagina, prin intermediul protocolului HTTP, care transferă informația de la server la
browser. Pagina web poart ă acest nume deoarece se afișeaz ă pe un monitor, ea seamana cu o pagină de
ziar: de obicei paginile web au o lățime care încape pe tot ecranul . Aceasta, poate f i mult mai înaltă
decât înălțimea ecranului, ea putând fi totuși ușor afișată cu ajutorul funcțiilor normale ale mouseului și
navigatorului , prin "tragere" în sus și în jos. De regul ă, o pagina poate fi vizualizat ă pe orice dispozitiv
conectat la o retea de i nternet (laptop, telefon, tablet ă, etc), fiind capabil ă să afișeze informații prin
intermediul protocolului HTTP.
Un site web este alcătuit din mai multe pagini care deține de obicei o pagină principală sau
homepage, de la care se stabilesc comunicări către paginile interne și secundare. S tructura și modelul
de "navigare" din interiorul site -urilor web sunt foarte diferite, în funcție de planul, dorința,
posibilitatea, ideea și imaginația cumpărătorului. De regula homepage reprezint ă pagina de start a site –
ului, pe care cumparatorul sau cel care ofera informații în domeniul online o face cunoscută către
public ca și un punct de plecare pentru întregul său proiect web .
Site-urile web se pot grupa după o mulțime de elemente , dar principalul element important
rămâne domeniul de activitate al site -ului stabilit de cel care îl dorește . De regulă un site web poate fi
alcătuit din orice fel de tipuri de date și informații statice , imagini, sunete, comerț, platform de
socializare, presă, blog -uri, vlog -uri. Discutând la o clasă mai înalt ă, domeniul unui site web poate fi:
un așa -zis magazine online, ziar web, revista web, encicopedia web, bibliotecă, universitate , bănci,
catalog virtual, portal virtual, blog, vlog, etc .
Dacă la început nu a fost atât de accent uată latura estetică, în zilele de azi se pune accent din ce în
ce mai mult pe estetica, dinamica si activitatea unui site web , nu numai pe conținutul de informații al
acestuia .

Principalele categorii de conținut al site-urilor web sunt:
1.Conținutul de tip meme – meme -urile sunt poze editate cu un text dorit pus pee le.
2.Conținut in fografic – sunt date reprezentate grafic.
3.Conținut video – este utilizat în cazul site -urilor care conțin tutoriale și reprezentări video.
4.Conținutul propriu -zis de tip text – textul este foarte important în cazul unui site ori blog ce poate fi
folosit împreuna cu celelalte trei tipuri de conținut .
Zona online este foarte competitivă , tocmai de aceea design -ul cel mai adecvat si cel mai bine
optimizat este cel care atrage noi clienti.
Crearea site -ului se desfaso ară în mai multe etape :
-prima etapa este să stabilim felelu site -ului de care avem nevoie.

-a doua etap ă este cea de alegere a dom eiului . Numele domeniului va reprezenta business -ul nostru și
este important să fie scurt, descriptiv si uș or de memorat.
-urmatoarea etap ă este foarte important ă , hostig -ul. Hosting -ul înseamnă o perioadă de timp în care
închiriem un spaț iu de g ăzduire pe discurile de stocare ale unui server care deț ine o conexiune permanenta
la internet.
După ce ne hotărâ m asupra tipului de site , domeniu si hosting, urmează construirea site -ului.
Este nevoie de o persoana care să se ocupe de desi gn-ul site -ului, imagini, text ș i limbaj de
programare. După schița site -ului, creă m un wireframe cu detaliile site -ului (butoane, pagini, poze),
după care realiză m designul template -ului.

Optimizarea site -ului pentru motoarele de c ăutare reprezintă urmă torul pas, care este de asemenea
foarte importa nt. Orice site, indiferent de cât de bine arată sau este făcut, nu reprezintă nicio valoare sau
folos dac ă nu poate fi gă sit pe internet . În spatele unui site simplu ș i bine organizat, web developer -ul
scrie sut e de linii de cod, in HTML, CSS, JavaScript,Microsoft Visual Studio 2017 sau MySQL, ca totul
să meargă perfect. Lansarea și promo varea site -ului sunt ultimele măsuri î n procesul de creare a unui site.
Inaugurarea trebuie să fie facută și pe paginile de Social Media, cum ar fi Facebook, Instagram, Tweeter,
Pinterest ș i altele.

CAPITOLUL 1 HTML ș i CSS

Introducere
HTML (Hypertext Markup Language) este un limbaj de marcare care stă la baza dezvoltării
oricărei pagini web. Limbajul HTML constă într -o serie de etichete numite și tag -uri care permit
formatarea modului de afișare a informației din pagina Web (folosirea a numitor font -uri, culori și stiluri
pentru text, înserarea unor imagini sau a unor tabele, utilizarea listelor și a formularelor etc.) .
Două dintre trăsăturile de bază ale unui document HTML sunt:
 Independența față de platformă
 Legăturile hipertext (hy perlink -uri)
Structura general ă
Ca structură, o pagină HTML are două părți: o parte delimitată de tag -urile <HEAD> și </HEAD>
ce conține informații de identificare a paginii și o parte delimitată de tag -urile <BODY> și
</BODY> ce conține informațiile de p rezentat efectiv în pagină. Cel mai important tag utilizat în
secțiunea HEAD este cel care dă titlul paginii .Acest titlu va fi încadrat de <TITLE> și </TITLE>.
Un exemplu de pagină HTML foarte simplă, având titlul "Magazin virtual" este:
<HTML>
<HEAD>
<TITLE>Magazin virtual</TITLE>
</HEAD>
<BODY>
Bine ai venit!<BR>
Primul meu magazin virtual realizat in HTML
</BODY>
</HTML>

Tagurile HTML
Tag-urile nu sunt altceva decât niș te marcaje sau etichete pe care limbajul HTML le foloseș te alaturi
de texte pentru a ajuta browser -ul de inte rnet să afișeze corect conț inutul paginii web.
Aceste tag -uri pot fi de doua feluri:
Taguri pereche

Exemple: <HTML> si </HTML>; <TITLE> si </TITLE>; <HEAD> si </HEAD>
Taguri singulare (nu au un tag de incheiere)
Exemple: <HR>, <BR>
Tag-urile de bază pe care trebuie să le conțină un document HTML:
<HTML> – cu acest tag î ncepe orice document HTML. Prin folosirea acestuia îi spunem browser –
ului c ă este vo rba de un fisier HTML pentru a î l putea afi șa.
<HEAD> – între aceste tag -uri s unt trecute, pe lângă titlul paginii, diverse informaț ii folositoare
pentru browser -ul de internet.
</HEAD> – acesta este tag -ul de î ncheiere al tag -ului <HEAD>
<TITLE> – cu ajutorul lui vei putea da un titlu documentului tău. Astfel, textul pe care îl vei scrie
între aceste tag -uri va fi afișat î n bara de titlu a documentului.
</TITLE> – arată sfârș itul titlului documentului.
<BODY> – odata cu acest tag incepe conț inutul paginii web. Tot ce vei scrie intre tag -urile
<BODY> si </BODY> va fi afiș at, de catre browser, pe ecranul monitorului.
</BODY> – îi spui browser -ului că ai terminat de scris conț inutul pag inii. Tot ceea ce vei scrie după
acest tag nu va mai fi afiș at.
</HTML> – codul oricărui document se termină cu acest tag.
Tag-urile pot fi scrise atât cu litere mari cat ș i cu litere mici.
Un document HTML este un fișier care are extensia . htm sau . html. Pentru editarea textului unui
document HTML pot fi folosite orice tipuri de editare.
După deschiderea unui tag si adăugarea conț inutului dorit , acesta trebuie să fie î nchis , pen tru a putea
funcț iona.

Formatarea textelor

Textul este una dintre cele mai importante componente ale unei pagini web.
Tag-ul utilizat pentru formatarea modului de afișare a textului este <FONT>…</FONT>. Tag -ul
FONT suportă mai mulți parametri, printre care:
– SIZE=x, unde x este dimensiunea font -ului (1 fiind dimensiunea cea mai mică);
– COLOR=#RRGGBB – culoarea cu care se va afișa font -ul. Orice culoare se poate compune din trei
culori de bază: roșu, verde și albastru (Red -Green -Blue, RGB). Acestei compoziții îi corespunde un cod

hexazecimal, unde intensitatea fiecărei culori este reprezentată pe un octet. De ex., 00FF00 este codul
pentru culoarea verde. Culoarea implicită este negru;
– FACE=font – font-ul cu care va fi scri s textul respectiv.

Liste
Există mai multe tipuri de liste, cele mai utilizate fiind cele:neordonate și ordonate.
Definirea listei se face cu <UL> si <OL>. Pentru declararea unui nou element în interiorul listei
folosește <LI>.
Exemplu:
<UL>
<LI> Samsung
<LI>Apple
<LI>HTC
</UL>
Este posibilă și construirea de subliste în interiorul listelor.

Tabele
Tabelele se definesc folosind <TABLE>…</TABLE>. Din punct de vedere al organizării și al
aspectului vizual al paginii, acest tag este unul dintr e cele mai importante. În general, toată informația
afișată la accesarea unei pagini web este conținută de tabele, având diverse setări pentru margini,
background, lățime, număr de celule, spațierea celulelor etc .

TABLELOR li se pot asocia urmă toarele a tribute :
– WIDTH=x sau WIDTH=x% – acesta specifică lungimea întregului tabel în pixeli (de exemplu
WIDTH=500) sau în procente .
– HEIGHT=x sau HEIGHT=x% – similar cu WIDTH, dar pentru înălțimea întregului tabel (exemple:
HEIGHT=300 sau HEIGHT=100%);
– BORDER=x – dacă x este 1 atunci tabelul va avea și "cadru" (linii de delimitare a elementelor).
Daca x este 0, atunci acestea vor lipsi
– CELLSPACING=x – specifică spațiul dintre căsuțe, în pixeli;
– CELLPADDING=x – specifică spațiul dintre marginea unei căsuțe și conținutul acesteia, în pixeli.

La tabele ca ș i la texte se pot atribuii fonturi si culori.
Exemple de tabele :
<TABLE>
<TR><TD>CELULA 1</TD><TD>CELULA 2</TD><TD>CELULA 3</TD></TR> <TR>
<TD COLSPAN=3 ALIGN=CENTER>CELULA 4</TD></TR>
</TABLE>

LINK -URI

Un element important al oricărei pagini web îl constituie link -urile . Acestea pot fi link -uri externe ,
care te îndrumă pe un alt site sau linkuri interne care te redirectionează pe o alt ă pagina a aceluiaș i site.
Pentru link -uri se foloseste tag -ul <A HREF= „link.html”>….</A>.
Link -urilor li se pot atribuii tag -ul TARGET .Acesta poate sa fie TARGET =”nume” si v -a deschide o
noua fereastra.
TARGET = „_blank” pentru o fereastra noua sau TARGET=”_sef l” unde v -a deschide o noua
fereastra in interiorul paginii .
Aceste link -uri nu se restrang doar la format HTML ci pot fi link -uri directe catre diverse formate de
fisiere : .doc, .txt, .pdf , .jpg etc.
Acestea suporta atributul FONT si COLOR .

Figure 1 Exemplu tabel

IMAGINI
Inserarea imaginilor în paginile HTML se face folosind tag -ul <IMG SRC=nume>, unde „nume” este
numele unui fișier gif sau jpg.
Se mai pot folosi imagini și drept fundal pentru pagini de internet. Pentru aceasta, vom introduce
atributul BACKGROUND î n cadrul tagului<BODY> de la începutul unui fișier:

<BODY BACKGROUND=poza.jpg>
Acestea pot folosii ș i atributul BORDER .

CSS ( Cascading Style Sheets )

CSS este un limbaj (style language) care definește "layout -ul" pentru documentele HTML.
Denumirea CSS provine din expresia Cascading Style Sheets. CSS acoperă culori, font -uri, margini , linii,
înălțime, lățime, imagini de fundal, poziții avansate și multe alte opțiuni. HTML este de multe ori folosit
necorespunzător pentru a crea layout -ul siturilor de internet. CSS oferă mai multe opțiuni, este mai exact
și sofisticat. În plus, este suportat de toate browser -ele actuale.

Cele două tehnologii au fost utilizate împreună pentru realizarea nivelului de prezentare al aplicației.
În ceea ce privește interac țiunea cu utilizatorul, HTML si CSS joacă cel mai important rol în crearea de
interfețe ușor de înțeles și de utilizat de către utilizator. Tot cu ajutorul CSS se pot construi interfețe
responsive, potrivite atât pentru monitor, cât și pentru dispozitivele mobile sau tablete.
Beneficiile CSS sunt :
– controlarea layout -ului documentelor dintr -o singură pagină de stiluri,
– control mai exact al layoutului,
– aplicare de layouturi diferite pentru tipuri media diferite (ecran, printare, etc),
– tehnici numer oase ș i sofisticate.
Sintaxa CSS este structurată pe trei nivele:
nivelul 1 fiind proprietaț ile etichetelor din documentul HTML, tip inline
nivelul 2 este infor mația introdusă î n blocul HEAD, tip embedded
nivelul 3 este r eprezentat de comenzile aflate î n pagini separate, tip externe

Atributele indica urmatoarele: rel – fisierul este tip styleshhet
type – tip text ce contine comenzi CSS
href – fisierul sau adresa fisierului CSS

ETICHETE CSS

Eticheta <div> funcționează asemanător cu eticheta <p>, putând găzdui comenzi CSS aplicabile l a un
bloc sau mai multe din conț inutul paginii.
Eticheta <span> este similară cu eticheta <font> (pe cale de a fi eliminată de consorțiul W3C)
aplicâ ndu-se elementelor dintr -un paragraf.
Etichetele CSS sunt cunoscute sub nu mele de elemente sau selectori având un layout asemană tor cu
etichetele HTML.

ELEMENTELE ID ȘI CLASS
Id si class sunt comenzi care dau unei formatari CSS un nume. Se folosesc atu nci când dorim să
aplică m un stil de formatare a unei anume zone. Pentru comp atibilitate cu versiunile anterioare de
browsere numele asociate zonelor nu vor contine caracterul „ _ ” .
Elementul id se apl ică unui style de format o singură dată sau la o singură etichet ă HTML, plasâ ndu-se un
nume acel ui style. Acest element necesită existența comezilor CSS în zona HEAD sau intr -un fiș ier
extern .

FONTURI
Aceste elemente specifică argumentul fontului care se a sociază unui element HTML fiind incluse ori
în zona HEAD ori î n interiorul etichetei dorite.
În cazul de faț a se remarc ă asemă narea cu eticheta font din HTML care accepta argumentele type,
style, size si weight.

Font-family este de fapt o list ă de fontur i din care browserul va folosi în ordinea în care le recunoaș te
(primu l folosit va fi primul din listă, dacă nu este recunoscu t îl folosește pe al doilea și așa mai departe).
Este recoma ndat ca ultima pozitie din listă să fie un font generic (de exemplu serif, sans -serif sau
monospace).

În situația î n care numele fontului e ste format din doua cuvinte se încadrează î ntre ghilim ele duble
pentru ca browserul să le interpr eteze impreună .

FORMATARE TEXT
Alinierea se face cu text -align care poziționează pe orizontal ă obiecte (de exemplu text sau imagini)
și admite valorile left, right și center ca ș i eticheta align din HTML.
Vertical -align este folosit pentru alinierea pe vertica la a obiectelor dintr -un tabel ș i poate lua valorile:
top, middle si bottom.
Float este folosit pentru alinierea textului cu imaginile si poate avea valorile: left si right. În funcție de
valoarea aleasă imaginea va fi aliniată în partea opusă a paginii.
Tabulare Text -indent este folosit pentru al inierea textului in interior având valori exprimate î n inci
(in), centimetri (cm) sau pixeli (px).
Decorare T ext-decoration adaugă sublinierea sau tăierea blocului text asociat ș i poate avea valorile
underline, line -through sau none.
Culoarea se face cu atributul Color și defineș te culoarea textului dintr -o zonă sau întraga pagină .

BACKGROUND
Background -ul poate fi defint ca fiind culoarea paginii , a unei celule a tabelului sau pentru text.
Culoarea de fond se defineste cu atributul background -color și poate fi asociat orică rei etichete
HTML.
Imaginile de fo nd pot fi folosite ca fundalul î ntregii pagini , a unui obiect sau a unui text.
Background -image asoc iază o imagine ca fundal.
Background poate lua atributul de REPEAT care poate lua valoare pe a xa X sau Y sau NO REPEAT ,
adică imaginea nu se repetă .
Poziț ia.Background -position are valori ca : top, center, left , right, bottom.

STILURI PENTRU LISTE
list-style -type
Folosind eticheta ol din HTML creă m liste ordonate sau neordonate. Adăugând comenzi CSS în zona
HEAD putem adăuga pe lângă numere ș i cifre sau alte simboluri. Browserul Netscape nu permi te
asocierea comenzilor CSS decâ t pentru eticheta li.

CHENARE ȘI MARGINI
Fiecare element este incadrat în tr-o caseta care este compusă din urmatoarele elemente:

Margin este spațiul exterior chenarului până la celelalte elemente
Border este o bordura care înconjoară elementul
Padding stabilește distanța dintre conținut ș i chenar
Conț inutul include info rmația utilă (text, tabele, imagini, formulare, etc.)

Width ș i Height.

Lățimea și înălț imea unui element sunt stabilite în HTML prin atributele width ș i height.Aceste
atribute pot fi adă ugate sau suprascrise prin comenzi CSS.

Padding ș i Margin
Padding s tabilește distanța dintre obiect ș i chenar simulta n pentru toate laturile. Distanțele pot fi
stabilite ș i individual folosind padd ing-top, padding -bottom, padding -left sau padding -right.
Margin stabilește distanța dintre chenar ș i celelalte obiecte din pag ină simulta n pentru toate laturile.
Distanțele pot fi stabilite ș i individual folosind margin -top, margin -bottom, margin -left sau margin -right.
Border
Netscape si Internet Explorer afișează diferit chenarele. Comanda CSS pentru definirea chenarului
este bo rder avand proprietaț ile asociate width, style si color. Pentru a fi siguri c ă aceste proprietați
funcționează atât în Internet Explorer cât și î n Netscape trebuie s ă declar ăm pentru border cel puțin width
și style. Figure 2: Chenar

Border -Width stabileș te grosimea chenar ului și poate fi exprimată î n px (pixeli), pt (puncte), cm
(centimetri) sau î n (inci).
Border -Style stabilește tipul chenarului și poate fi dotted, dashed, solid, double, groove, ridge, inset și
outset.
Border -Color stabilește culoarea chenarului ș i poate fi exprimat ă prin valoare hexazecimală s au în
cuvinte.

Un exemplu de view, HomePage – pagina care prezintă un overview al produselor și posibilele acțiuni
care se pot face asupra acestora, în care au fost folosite cele două tehnologii poate fi văzut în imaginea
următoare:

Figure 3: Home page – view controller

CAPITOLUL 2 JAVASCRIPT SI jQuery.

INTRODUCERE

JavaScript (JS) este un limbaj de programare orientat obiect bazat pe conceptul prototipurilor.
Este folosit mai ales pentru introducerea unor funcționalități în paginile web, codul Javascript din aceste
pagini fiind rulat de către browser. Limbajul este b ine cunoscut pentru folosirea sa în construirea siturilor
web, dar este folosit și pentru accesul la obiecte încastrate în alte aplicații. A fost imbunătațit la început de
către Brendan Eich de la Netscape Communications Corporation sub denumirea de Mocha, după care
LiveScript, și în final numit JavaScript. Deși au un nume asemănător si anumite similarități de sintaxă,
între JavaScript ș i limbajul Java nu există niciun punct comun . JavaScript are o sintaxă asemănătoare de
cea a limbajului C, precum Java, da r deține mai multe puncte comun e cu limbajul Self decât Java.
În anul 2005, a fost ultima versiune aparută JavaScript 1.5, care concorda cu Ediția a 3 -a a ECMA -262,
ECMAScript, cu alte cuvinte, o ediție clasică de JavaScript. Versiunile de Mozilla începând cu 1.8 Beta 1
au deținut un suport pentru E4X, care este o prelungire a limbajului care are legatură cu XML, conceput
în standardul ECMA -357. Versiunea curentă de Mozilla, 1.8.1 (pe care sunt făcute Thunderbird versiunile
2.0 și Firefox ) acceptă versiunea 1.7 a JavaScript .
JavaScript este folosită cel mai des în programarea paginilor web. Script-urile folosite pentru diverse
activități precum verificarea datelor sau crearea de meniuri și alte efecte animate pot fi definite de către
porgramatori in paginile html.
Browser -ele rețin în memorie o reprezentare a unei pagini web sub forma unui arbore de obiecte și
pun la dispoziție aceste obiecte script -urilor JavaScript, care le pot citi și manipula. Arborele de obiecte
poartă numele de Document Object Model sau DOM. Există un standard W3C pentru DOM -ul pe care
trebuie să îl pună la dispoziție un browser, ceea ce oferă premiza scrierii de script -uri portabile, care să
funcționeze pe toate browser -ele. În practică, însă, standardul W3C pentru DOM este incomplet
implementat. Deși tendința browser -elor este de a se alinia standardului W3C, unele din acestea încă
prezintă incompatibilități majore, cum este cazul Internet Explorer.

O tehnică de construire a paginilor web tot mai întâlnită în ultimul timp este AJAX, abr eviere de la
„Asynchronous JavaScript and XML”. Această tehnică constă în executarea de cereri HTTP în fundal,
fără a reîncărca toată pagina web, și actualizarea numai anumitor porțiuni ale paginii prin manipularea
DOM -ului paginii. Tehnica AJAX permite co nstruirea unor interfețe web cu timp de răspuns mic, întrucât
operația (costisitoare ca timp) de încărcare a unei pagini HTML complete este în mare parte eliminată.

STRUCTURA
Javascript deț ine structuri de control care pot modifica fluxul secvențial al pr ogramului.Î ntre aceste
structuri de control putem g ăsi doua categorii :
1. Structuri de alegere/decizie
2. Structuri repetitive
Sintaxa structurii de decizie clasic ă este :
If (conditie)
{
Actiune 1
}
Else
{
Actiune 2
}

EXPRESII LOGICE

Putem folosi urmă torii oper atori de comparaț ie pentru a crea asemenea expresii : == ( egal
cu ), > ( mai mare ca ), < ( mai mic ca ) , <= ( mai mic sau egal cu ), >= ( mai mare sau egal cu ),
!= ( diferit de ) .
Pe lâ ngă aceș ti operatori, de asemenea putem folosi ș i operatorii logic i AND, OR si NOT.Î n
JavaScr ipt operatorul AND se reprezintă prin &&, OR cu || ș i NOT cu !.

STRUCTURI REPETITIVE
Alt tip de structuri care pot modifica cursul normal de executare al unui program sunt structur ile
repetitive , se mai numesc ș i bucle.Aceste structuri se folosesc pen tru a repeta un set de instrucți uni.
Folosind str uctura for, putem specifica numă rul de ori dorit pent ru a se repeta setul de instrucțiuni . Prin
urmare , trebuie să știm acest numă r .
for( expresie; condiție; operaț ie )
{
Acțiuni
}
Folosind structura while , putem repeta un set de intrucțiuni până când se îndeplinește condiț ia .
Sintaxa pentru structura while este urmatoarea :
while ( condiț ie )
{Acțiuni}

DEFINIREA UNEI FUNCȚII

Atunci c ând sarcina care trebuie să o îndeplinească un script este complex ă , este mai bine să
separăm o problema mare î n probleme mai mici , care sunt mai simplu de gestionat.
JavaScript permi te descompunerea unei probleme î n sarcini mai mici folosind conceptul de funcție.
O funcț ie nu este nimic mai mult d ecât un set de instrucțiuni care îndeplinesc o sarcină bine definit ă.
Pentru a putea folosi o funcție trebuie, mai întâ i, să o definim.Acest lucru îl putem îndeplini folosind
urmă toarea structur ă:

Funcțion numele_funcț iei(parametri)
{
Acțiuni
}

APELAREA FUNCȚIILOR

Forma prin care putem apela o functie este pur ș i simplu folosind numele acesteia și în cazul în care
aceasta deț ine parametri, s ă le trecem valorile.
În acest exemplu, funcția î ncearca s ă afle dac ă numă rul introdus de utilizat or este î ntre nume rele 1 și
20. Funcția întoarce o valoare boolean indicâ nd dac ă acesta este cazul.
Logic, dacă nu pă străm rezultatul într -un anumit loc , funcț ia nu ne folose ște.Mai jos se regăseș te un
exemplu unde:
if(validează(numă r))
{
document.write("Patratul numă rului ales : " + număr * numă r );

}
else{
document.write("Valoarea introdusa nu este în intervalul permis");
}
VARIABILE
Variabilele sunt de 2 tipuri :
-locală (se poate folosii în interiorul unei funcț ii)
-global ă (se poate fo losii ș i în interiorul și î n exte riorul unei funcț ii).
Îm interiorul unei funcții î ntotdeauna are prioritate variabila locală .
Prin urmare , trebuie să avem în vedere urmă toarele reguli :
– Variabilele globale se declar ă la nivel de script și se pot folosi în oricare parte a acestuia câ t și în
interiorul unei funcț ii.
– Variabilele locale se declar ă în interiorul unei funcții și nu pot fi folosite î n exteriorul acesteia.
– Dacă o variabil ă global ă are acela și nume cu una locală , atunci în interiorul unei funcț ii are
prioritate variabila locală .
– Un parametru acționeaza exact ca ș i cum ar fi o alta variabil ă local ă.
JQUERY
În dezvoltarea proiectului curent, a fost folosit alături de JavaScript clasic și librăria jQuery.
jQuery este o platformă de dez voltare 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 ver siunile de browsere importante
existente, și să respecte filosofia "Unobtrusive JavaScript". Biblioteca a fost lansată in 2006 de către John
Resig.
Ajax (sau AJAX), prescurtare pentru Asynchronous JavaScript and XML, este o tehnică de
programare pentru c rearea de aplicații web interactive. Intenția este să facă paginile web să devină mai
rapide și deci mai acceptate, prin schimbul în fundal al unor cantități mici de date cu serverul, astfel încât

să nu fie nevoie ca pagina să fie reîncărcată la fiecare ac țiune a utilizatorului. Aceasta are ca scop
creșterea interactivității, vitezei și ușurinței în utilizare a aplicațiilor web .
Ajax nu este o tehnologie în sine. Termenul este folosit pentru definirea aplicațiilor web ce folosesc un
ansamblu de tehnologii.
Un exemplu de utilizare AJAX se regăsește în figura următoare. Metoda Slider este regasit ă pe pagina
Home, pentru a derula produsele .

BOOTSTRAP

Bootstrap este un framework de frontend intuitiv ș i puternic, mobile first ce poate ajuta
dezvoltatorii să realizeze site -uri rapid și ușor folosind HTML, CSS si JavaScript.
Avantaje:
 Este Mobile First
 Este suportat de toate browser ele populare
 Ușor de învățat Figure 4: Slider produse

 Este responsive

Componente:
 Scaffolding : Boot strap vine cu o sistem de grile (grids), stiluri pentru link -uri, background -uri,
butoane, si multe altele.
 CSS: Bootstrap vine cu setări ce pot fi modificate din CSS si elemente prestabilite.
 Componente : Bootstrap conține o mulțime de elemente refolosibile precum icon -uri, dropdown –
uri, meniuri, alerte, pop -overs si multe altele.
 Plugin -uri JavaScript : Bootstrap conține o mulțime de plugin -uri jQuery care pot fi incluse in
funcție de necesitați, fie pe toate.

Capitolul 3 DEZVOLTAREA UNEI APLICAȚII PENTRU
CREAREA UNUI MAGAZIN VIRTUAL
Tehnologii utilizate
C#

Limbajul C# este un limbaj simplu, modern și orientat obiect, iar ca principal mediu integrat de
dezvoltare alegerea ideală este Visual Studio. Proiectele sunt fișiere XML care conțin următoarele
informații:
 lista fișierelor necesare, poziția pe disc a a cestora precum și modul în care vor fi utilizate
(compilate in cod executabil, incluse în executabil)
 lista de module externe referite
 mai multe seturi de parametri de compilare numite configurații (implicit sunt doar două – Debug
și Release – dar se pot defini și alte configurații)
 diverse opțiuni legate de proiect
Ce tipuri de aplicații pot fi dezvoltate cu ajutorul C#
Platforma .NET, și implicit C#, nu are restricții cu privire la tipurile de aplicații care pot fi create, dar
totuși cele mai comune t ipuri de aplicații sunt următoarele:
 Aplicații desktop – aplicații care au aspectul familiar Windows. Aceste aplicații sunt create
folosind modulul Windows Presentation Foundation (WPF) din .NET. Acest modul este de fapt o
bibliotecă de controale (cum ar f i butoane, bare de instrumente, meniuri și altele) care pot fi
folosite pentru a crea interfața utilizator Windows.
 Aplicații Windows Store – Windows 8 a introdus un nou tip de aplicații care sunt proiectate în
principal pentru dispozitivele cu ecran tacti l și care, de obicei, rulează în full screen și se bazează
pe simplitate.
 Aplicații Web – două posibilități: Active Server Pages sau ASP .NET MVC pagini web la fel ca
cele care pot fi vizualizate din orice browser. Framework -ul .NET include un sistem puter nic
pentru generarea conținutului web dinamic, personalizabil dar și de o securitate crescută. De

asemenea mai pot fi create și aplicații care rulează în browser -e cu Silverlight. Pentru
aplicația realizată s -a folosit ASP .NET MVC, iar acest framework, câ t și design pattern –
ul pe care se bazează vor fi prezentate mai pe larg in subcapitolul următor.
 Servicii WCF – acestea reprezintă un mijloc prin care pot fi create aplicații distribuite
versatile. Prin folosirea WCF pot fi transferate orice fel de date, ș i pe rețelele locale și pe
rețeaua Internet.
 Aplicații pentru telefoane mobile – Aplicații pentru Windows Phone 7, Windows Phone
8, Windows 10.
 Aplicații pentru Internet Of Things – cu ajutorul C# se pot crea și aplicații destinate IoT,
prin intermediul platformei .Net Microframework.
 Aplicații multiplatformă – Începând cu lansarea .NET Core, limbajul C# poate fi folosit
pentru dezvoltarea de aplicații multi -platformă.
ASP.NET MVC – Framework și design pattern

Pentru a prezenta mai bine acest framework, consider că este recomandat să înțelegem
mai întâi design pattern -ul ce stă la fundația acestuia. În continuare vor fi prezentate definiția
generală a design pattern -ului, cât și pentru Model View Controller – MVC.

Design pattern – definiții
Un design pat tern este o soluție generală și reutilizabilă a unei probleme comune în design -ul
software. Un design pattern nu este un design in forma finală, ceea ce înseamnă că nu poate fi transformat
direct în cod sursă. Acesta este o descriere a soluției sau un temp late ce poate fi aplicat pentru rezolvarea
problemei. În general pattern -urile orientate obiect arată relațiile și interacțiunile dintre clase sau obiecte,
fără a specifica însă forma finală a claselor sau obiectelor implicate.
Design Pattern -urile fac pa rte din domeniul modulelor și interconexiunilor. La un nivel mai înalt se găsesc
pattern -urile arhitecturale (engl. Architectural Patterns) ce descriu pattern -ul global utilizat al întregului
sistem.
Nu toate pattern -urile software sunt design patterns. D e exemplu, algoritmii rezolvă probleme
computaționale, nu probleme de design. Design pattern -urile au fost inițial grupate în următoarele

categorii: Creational patterns , Structural patterns și Behavioral patterns și au fost descrise folosind
conceptele de delegare, agregare si consultare.
Creational Patterns sunt pattern -uri ce implementează mecanisme de creare a obiectelor. În această
categorie se încadrează pattern -urile Singleton și Factory .
Structural Patterns sunt pattern -uri ce simplifică design -ul aplicației prin găsirea unei metode de a defini
relațiile dintre entități. In aceasta categorie se încadrează pattern -ul Decorator .
Behavioral Patterns sunt pattern -uri ce definesc modul în care obiectele comunică între ele. În această
categorie se incadrează pattern -urile Command , Visitor și Observer .

Model View Controller – MVC

Denumirea MVC este prescurtarea numelui Model –View –Controller, un pattern foarte des folosit
în mediul de dezvoltare Web. Structura de bază se poate observa în figura de mai jos:

Figure 5: Model de clase

Elementele componente au următoarele funcții de bază:
 Model
a. Conține clase cât mai simpliste
b. Folosit pentru transfer de date între mediul de stocare permanent și View, prin
intermediul Controller -ului
 View
a. Afișează datele primite de la Controller (date stocate în Model)
b. Nu conține nici un fel de logica de business, ci doar afișează ceea ce prim ește
 Controller
a. Conține logica de business, validări de date, operații de comunicare cu baza de date, etc.
b. Folosește Model -ul pentru a trimite date către View
În tabelul următor am încercat să prezint principalele avantaje și dezavantaje ale acestui de sign pattern.
Avantaje Dezavantaje
Reprezentarea aceluiași model prin vederi
multiple Creșterea complexității
Sincronizarea vederilor cu modelul printr –
un mecanism de propagare a modificărilor Poate duce la un număr excesiv de operații de
actualizare
Vederi și obiecte de control conectabile
modelului Cuplarea între vedere și obiectul de control
Potențial de utilizare pentru dezvoltarea
frameworkurilor Ineficiența accesării datelor – cereri multiple
efectuate de vedere pentru obținerea tuturor
datelor necesare

ASP.NET MVC
În cazul ASP.NET MVC modelul poate fi implementat prin clase .Net care modelează structurile
de date (de ex.: se poate folosi Microsoft Entity Framework), controller -ul trebuie derivat dintr -o clasă
specială (Controller), iar viewurile sunt implementate sub forma unor fișiere care conțin un amestec de
cod C# și HTML . În continuare este prezentat un exemplu de pagină web implementată în ASP.NET
MVC din aplicația dezvoltată pentru acest proiect.

View -ul nu face alt ceva decât să permită vizualizarea și editarea informației din model. Model
din spatele paginii conține proprietăți pentru fiecare câmp de pe ecran, în plus proprietățile sunt adnotate
cu atribute care descriu validări le ce trebuie să se execute asupra acelor câmpuri.
ASP.NET MVC, versiunea 1 a fost dezvăluită publicului în 2009, și spre deosebire de
framework -ul principal pentru dezvoltare web, oferit de Microsoft la acel moment a venit cu o abordare
total diferită a m odului de programare folosind C#. Prima versiune aducea concepte de rutare, concepte
de programare realizată pe baza de convenții. A doua versiune, a adus un nou model de validare bazat pe
atribute, suport pentru a -sincronitate, suport pentru partiționarea aplicațiilor mari în zone numite “area” .
ASP.NET MVC, versiunea 3, a adus un nou motor de randare a view -urilor, Razor, acesta fiind
folosit și în versiunea actuală de MVC pentru dezvoltarea aplicației prezentate.

Figure 6: Index

MYSQL Server

Un Sistem de Gestiune a Bazelor de Date , este un set complex de programe ce permite
organizarea, păstrarea, extragerea datelor din bazele de date. SGBD -urile utilizează anumite modele
conceptuale pentru a putea gestiona datele: ierarhic, rețea, relațional, obiectual și obiectu al-relațional.
Modelul relațional este și va rămâne o lungă perioadă de timp (după spusele mai marilor în ale
bazelor de date), cel mai utilizat model conceptual. Cel ce a dezvoltat acest model a fost Edgar Frank
"Ted" Codd (23 August 1923 – 18 Aprilie 200 3) – un specialist de origine britanică ce a adus contribuții
semnificative în știința calculatoarelor. Modelul relațional a luat naștere când E.F.Codd lucra la IBM (anii
’70), perioadă în care a publicat un articol „A Relational Model of Data for Large Sh ared Data Banks” în
care a enunțat treisprezece reguli ce vizează modelul relațional.
O bază de date reprezintă o colecție de date utilizată într -o organizație, colecție care este
automatizată, partajată, definită riguros (formalizată) și controlată la ni vel central.
Structura funcțională a unui SGBD :
Tranzacția este o mulțime finită și ordonată de operații: de citire, de scriere, de calcul și de
terminare într -o BD.
Utilizatorul exprimă o cerere sub forma unei tranzacții globale. Folosind dicționarul de date al
sistemului (DDS) se evaluează și se descompune în subcereri. Apoi, plasează fiecare subcerere nodului
care conține informațiile solicitate din BD locală pe care trebuie să o interogheze. Subcererea trebuie
adaptată SGBD -ului local care o va trata ca o cerere locală. Fiecare BD locală poate fi exploatată local de
utilizatorii locali prin intermediul unui SGBD local. Cererile de acces pot solicita date situate în noduri
diferite. Pentru supervizarea cererii, un nod trebuie să -și asume rolul de coordo nator (celelalte sunt
cooperante). Un nod poate fi în același timp și coordonator pentru cererile lansate de el și cooperant
pentru cererile lansate din alte noduri care solicită acces la acel nod. Execuția unei cereri se realizează în
două faze:
1. Pregăt irea execuției (citirea datelor, scrierea în jurnalele locale a datelor neactualizate și a
datelor actualizate);
2. Realizarea cererii, adică introducerea datelor actualizate în BD dacă sistemul
funcționează corect sau nerealizarea cereri dacă apare un inc ident.

O bază de date relațională (BDR) poate fi definită ca un ansamblu de tabele; fiecare tabel, alcătuit
din linii (tupluri), are un nume unic și este stocat pe suport extern (de obicei disc). La intersecția unei linii
cu o coloană se găsește o valoare atomică.
Bazele de date relaționale au evoluat ca un tip special de aplicații informatice, și anume cele care au
organizarea datelor în memoria externă conform unui model de date specific. De aceea, în metodologia de
realizare a BDR se parcurg, în cea mai mare parte, cam aceleași etape ca la realizarea unei aplicații
informatice, cu o serie de aspecte specifice. Pe de altă parte, în literatura de specialitate, sunt diferite
propuneri de metodologii de realizarea bazelor de date.
Un tuplu sau o linie este a lcătuit(ă) din mai multe câmpuri (coloane sau atribute) și regrupează
informații referitoare la un obiect, eveniment etc., altfel spus, informații referitoare la o entitate: o carte,
un student, o localitate, un angajat al unei firme, o factură emisă etc. Ordinea tuplurilor nu prezintă
importantă din punctul de vedere al conținutul informațional al tabelei.
Teoria relațională spune că într -un tabel, nu pot exista două linii identice. Identificarea unei linii
se face prin intermediul atributelor (câmpurilor) care o compun (valorile lor trebuie să fie unice). Cheia
primară a unei tabele este un atribut sau un ansamblu de atribute care identifică fără ambiguitate fiecare
înregistrare. Există și câteva restricții în privința cheilor primare: unicitate (să permit ă identificarea unui
singur tuplu dintr -o tabelă), compoziție minimală (în cazul în care cheia primară este compusă din mai
multe atribute, nici un atribut din cheie să nu poată fi eliminat fără a distruge condiția de unicitate a
înregistrărilor), valori n on-nule (numită și restricție a entității – valorile atributelor sau ansamblurilor de
atribute, nu pot lua decât valori ne -nule).
Sistemele relaționale îndeplinesc funcțiile unui SGBD cu o serie de aspecte specifice care rezultă din
definirea unui SGBDR. C aracterizarea SGBDR se poate face pe două niveluri: global (sistemele
relaționale sunt privite ca o categorie distinctă de SGBD) și particular (fiecare SGBDR are aspecte
individuale comparativ cu altele similare).
SGBDR oferă seturi de comenzi pentru descr ierea și manipularea datelor. Acestea pot fi incluse într -un
singur limbaj relațional (SQL, QUEL,QBE, SQUARE, ALPHA, ISBL) sau separate în LDD și LMD. În
ambele situații, comenzile pentru definirea datelor sunt distincte de cele pentru manipularea datelor.
Limbajele relaționale de definire a datelor (LDD) sunt simplificate, cu puține comenzi. Descrierea datelor
este memorată în BDR, sub formă de tabele, în dicționarul (metabaza) bazei de date. Facilități de

descriere sunt prezente în SGBDR prin comenzi, car e definesc anumite operații, lanivelurile: conceptual,
logic, fizic.
Aspectele privind protecția datelor sunt foarte importante pentru un sistem de bază de date și ele trebuie
implementate de către SGBDR. Protecția bazei de date se referă la integritatea datelor (integritatea
semantică, concurența la date, salvarea/restaurarea) și securitatea datelor (autorizarea accesului, viziunile,
procedurile speciale, criptarea). Integritatea semantic, definirea restricțiilor de integritate se face, conform
cerințelor modelului relațional și concurența la date (coerența), adica unitatea de lucru pentru asigurarea
coerenței datelor este tranzacția. Aceasta este un ansamblu de comenzi tratate unitar. Tranzacția se
execută în totalitate sau deloc. Coerența poate fi afecta tă la actualizarea concurentă sau la incidente.
Un alt lucru important în bazele de date relaționale îl reprezintă organizarea tabelelor. Procedeul
prin care datele sunt grupate pe tabele distincte, se numește normalizare. Acest procedeu presupune
parcurge rea unor etape de transformare succesive, până când baza de date este adusă la o formă
optimizată. Normalizarea nu este un proces ușor, iar lucrarea de fată nu își propune discutarea în detaliu al
acestui subiect. Putem spune doar că există cinci forme de normalizare, fiecare pas în normalizare
presupune aducerea bazei de date la o formă standard. Principalele obiective ale normalizării sunt
reducerea pe cât mai mult posibil a redundanței datelor și eliminarea anomaliilor apărute la inserare,
modificare, șt ergere.
 prima formă de normalizare presupune eliminarea câmpurilor compuse și pe cele repetitive;
 a doua formă de normalizare presupune eliminarea dependențelor funcționale parțiale;
 a treia formă de normalizare presupune eliminarea dependențelor funcționale tranzitive;
 a patra formă presupune eliminarea dependențelor mult valoare;
 a cincea formă elimină dependențele de joncțiune.
În concluzie, SGBDR este un sistem software complet c are implementeză modelul de date relațional și
respectă cerințele impuse de acest model. El este o interfață între utilizatori și baza de date.
Datele unei baze de date pot fi exploatate prin intermediul limbajului de interogare SQL
(Structured Query Langu age). Acesta este un limbaj standardizat ce este folosit de către mai toate
sistemele de gestiune a bazelor de date. Prin intermediul acestui limbaj se pot:
 crea baze de date și tabele;

 realiza indecși;
 stabili relații între tabele;
 extrage și modifica date;
 etc.
MSSQL Server
Microsoft SQL Server este sistemul de gestiune a bazelor de date produs de către compania
Microsoft. Pe o mașină fizică putem găzdui mai multe instanțe MSSQL.O instanță MSSQL poate găzdui
mai multe baze de date.
O bază de date în SQL Server poate fi compusă din mai multe fișiere:
• .mdf – întâlnite și sub denumirea de primary files sau main files. Acest fișier găzduiește
obiectele unei baze de date (tabele, proceduri stocate, declanșatori, etc.). O bază de date poate să aibă
maximu m un fișier .mdf.
• .ndf – secondary database file. În principal .ndf -ul este folosit în cazul optimizărilor. Spre
exemplu: anumite tabele pot fi salvate în fișiere .ndf, fișiere ce vor fi găzduite în locații diferite, pe discuri
diferite. O bază de date poate avea zero sau mai multe fișiere .ndf.
• .ldf – transaction log files – acest fișier va păstra un istoric al operațiunilor efectuate asupra
datelor bazei de date.
Microsoft SQL Sever folosește o variantă de SQL numită T -SQL, sau Transact -SQL, o
imple mentare de SQL -92 (standardul ISO pentru SQL) cu unele extensii. T -SQL în principal adaugă
sintaxa adițională pentru procedurile stocate și pentru tranzacții. Standardele SQL necesită ACID; acesta
este un acronim pentru cele 4 condiții pentru orice tranzac ție: atomicitate, consistență, izolare,
durabilitate. MS SQL Server suportă ODBC (Open Database Connectivity).

Entity Framework

Entity Framework este după cum îi sugerează și numele un framework „Object/Relational
Mapping” (ORM) care permite dezvoltatorilor să lucreze cu date relaționale ca obiecte specifice
domeniului, eliminând nevoia de a scrie codul de acces la baza de date. Interogările se fac utilizând
LINQ, obținând obiecte puternic tipizate. Folosind „Code First”, baza de date este cre ată pe baza
obiectelor create în C#.
Abordarea Code -First permite dezvoltatorilor să se concentreze pe conceperea claselor
domeniului, clase care răspund cerințelor din aplicație decât să creezi baza de date și apoi clasele
specifice domeniului. Astfel API -ul Code -First va crea baza de date bazată pe clasele și configurările
date.
Arhitectura Entity Framework conține următoarele elemente:
 Query and update pipeline – procesează interogări, filtrează si face update cererilor;
 Metadata services – gestionează meta datele legate de entități, relații si mapări;
 Transactions;
 Conceptual layer API – runtime -ul ce expune modelul de programare;
 Embedded database – include o baza de date incorporata pentru interogarea datelor relaț ionale;
 Design tools – simplifica tas k-ul de mapare a schemei conceptuale la schema relationala;
 Programming layer – expune EDM -ul (Entity Data Model) ca unități ce pot fi utilizate de
limbajul de programare;
 Object services – cod generat automat pentru clasele CLR ce dețin aceleași proprietă ți ca o
entitate, dând astfel posibilitatea instanției entităților ce obiecte .Net;
 Web services – expun entitățile ca servicii web;

Modele de programare folosind Entity Framework
1. Aplicație centrata pe baza de date – Baza de date este in centrul aplicați ei.
2. Aplicație centrata pe model – modelul este in centrul aplicației. Accesul la date este făcut pe baza
modelului conceptual, model ce reflectă obiectele problemei de rezolvat. In acest caz exista
posibilitatea de a folosi : Code first sau Model design f irst.

Modelul de programare centrat pe baza de date, presupune ca baza de date este creată și apoi se
generează modelul logic ce conține tipurile folosite in logica aplicației. Acest lucru se face folosind
mediul de dezvoltare VStudio. Se generează clasele POCO (EF versiune mai mare ca 4 si VS 2012/VS
2013) și fișierele necesare pentru nivelul conceptual, nivelul de mapare și nivelul de memorare.
Aplicația centrata pe model poate fi dezvoltată alegând una din variantele: Code First sau Model
design first.
In ca zul Code First, dezvoltatorul scrie toate clasele (POCO) modelului și clasa derivată din DbContext
cu toate entitățile necesare și apoi cu ajutorul mediului de dezvoltare se creează și generează baza de date,
tabelele din baza de date și informațiile adiți onale necesare pentru EF.
In cazul Model Design First, mediul de dezvoltare permite dezvoltarea unei diagrame a modelului
aplicației și pe baza acesteia se va crea și genera baza de date, tabelele din baza de date și informațiile
adiționale necesare pentr u EF.
Aplicația cre ată pentru acest proiect este centrată pe model cu ajutorul Code First.

Prezentarea aplicației dezvoltate
Din perspectivă funcțională
Principala cerință funcțională a aplicației este crearea unui magazin virtual si administrarea produselor ,
furnizorilor si clientilor.

Roluri utilizator
În cadrul aplicației Shop -Electronics au fost definite următoarele roluri utilizator:
 Administrator – rol de administrare
 Client – rol de utilizator normal
Pentru utilizatorii cu rol de “Administrator” aplicația va oferi următoarele funcționalități.
 Definirea de produse
 Definirea furnizorilor
 Definirea clientilor
 Vizu alizarea produselor (cantitate ș i preț )
 Vizu alizarea rezultatelor obținute în urma vâ nzărilor.
Pentru utilizatorii c u rol de “client” vor fi disponibile funcționalitățile următoare:
 Vizualizarea produselor
 Vizualizarea cantităților disponibile ș i prețului acestora
 Vizualizarea furnizorilor
 Posibilitatea de a adăuga produse î n coșul de cumpărături și de a finaliza o comandă .

Cerințe funcționale legate de operabilitatea aplicației
Aplicația va trebui să ruleze pe toate browser -ele moderne.

Cerințe funcționale legate de validare și securitate

Accesul în aplicație trebuie să fie unul controlat. Un utilizator cu un anum it rol nu va trebui să poată
avea acces la funcționalitățile destinate unui alt rol de utilizator; de exemplu un client nu va putea
modifica datele unui produs.

Cazuri de utilizare

În următoarea secțiune vor fi descrise principalele cazuri de utilizare a aplicației magazin virtual

Cazul 1 – autentificarea in aplicație
a. Utilizatorul deschide pagina de Login a aplicației
b. Utilizatorul introduce emailul și parola
c. Utilizatorul apasă butonul Autentificare
d. Aplicația va verifica dacă utilizatorul a introdus date le corecte pentru a accesa
paginile
e. În cazul în care datele introduse nu corespund unui cont valid de utilizator aplicația
va afișa un mesaj corespunzător
f. În cazul în care datele introduse aparțin unui cont valid de utilizator, acesta este
redirectat către pagina Home a aplicației.
Figure 7: Autentificare

Cazul 2 – înscrierea unui utilizator client nou
a. Clientul navighează pe pagina de î nregistrare
b. În această pagină va putea vedea o lista în care îș i complecteaz ă datele
c. Dupa complectarea datelor , client ul este redirecționat că tre pagina principal ă a site -ului,
d. Clientul revine pe pagina principală și trebuie să se autentifice pentru a putea începe
cumpără turile

Cazul 3 – clientul efectuează o comand ă
a. Dupa autentificare clientul este redirec ționat pe pagina principal ă
b. Pe pagina principal ă poate observa lista cu produse
c. Clientul selecteaz ă produsul dorit și cantitatea
d. Este redirecț ionat c ătre pagina „co ș de cumpără turi”
e. Pe aceast ă pagin ă se poate observa o lista în care trebuie să îș i introduc ă datele personale
(nume , prenume , adres ă, telefon , număr de card)

Figure 8: Inregistrare

f. Clientul apasă butonul „ creeaza ”.
Figure 9: Comanda produse

Diagrama bazei de date
Așa cum a fost menționat anterior, pentru baza de date a fost folosit motorul de baze de date MSSQL
Server. În figura de mai jos poate fi văzută o diagramă a tuturor tabelelor componente ale bazei de date
create pentru aplicația Shop -Electronics .

Figure 10: Diagrama bazei de date

În continuare se va face o analiză pentru a prezenta fiecare tabel și rolul acestuia.

1. Tabelul Products – conține datele despre produse .
Coloana PID reprezintă cheia primară a tabelei.
Coloana PName este un foreign key către tabelul AspNetUsers pentru a cunoaște utilizatorul
care a creat produsul .
Coloana Brand stochează descrierea producătorului .
Coloana UnitPrice memorează prețul produselor .
Coloana UnitsinStock memorează cantitatea prodselor.
Coloan a Category stochează categoria produselor.
Coloana Description stochează descrierea produselor.

Figure 11: Produse

2. Tabelul Customers – stochează toate datele despre clienți.
Coloana C id reprezintă ID-ul clientului.
Coloana Pname si Lname stochează numele și prenumele clientului.
Coloana Phone stochează numărul de telefon al clientului.
Coloanele Adress 1 și Adress 2 stochează adresa clientului.
Coloana Suburb stochează zona/cartierul .
Coloana Postcode stochează codul poștal al clientului.
Coloana State stochează Județul .
Coloana Ctype stochează tipul cardului.
Coloana Card No stochează numărul cardului.
Coloana Expdate stochează data expirării cardului.
Coloana Email stochează e -mailul clientului.

Figure 12: Clienti

3. Tabelul Orders – stochează datele de livrare a produselor.
Coloana OrderId reține id -ul comenzii.
Coloana Orderdate reține data comandării.
Coloana Deliverydate reț ine data sosirii comenzii.
Coloana CID reprezintă ID-ul clientului.

Figure 13: Comenzi
4. Tabelul Orderproducts reprezintă comandarea produsului.
Coloana Id reține id -ul comenzii.
Coloana OrderId reține ID -ul comandării produsului.
Coloana PID reține id -ul produsului.
Coloana Qty reține numărul de produse.
Coloana TotalSale reprezintă numărul total de vânzări .

Figure 14: Comanda produse

5. Tabelul Suppliers stochează informațiile despre furnizori .
Coloana StudentTestId este cheia primară a tabelului.
Coloana SId reține id furnizorului .
Coloana Sname reține numele furnizorului.
Coloana Phone stochează numărul de telefon al furnizorului.
Coloana Email stochează e -mailul furnizorului.
Coloanele Adress 1 și Adress 2 stochează adresa furnizorului.
Coloana S uburb stochează zona/cartierul .
Coloana State stochează Județul .
Coloana Postcode stochează codul poștal al furnizorului.

Figure 15: Furnizori

6. Tabela shop ingcartdatas stocheză datele coș ului de cumparaturi.
Coloana TempIdOrder reține id temporar al unei comenzi.
Coloana PID reține id -ul produselor.
Coloana Pname reține numele produsului
Coloana UnitPrice reține prețul produsului
Coloana Quantity reține cantitatea de produse .

Figure 16: Cos cumparaturi
7. Tabele specifice Asp.Net Identity – tabelele AspNetUserRoles, AspNetRoles, AspNetUsers,
AspNetUserLogins, AspNetUserClaims sunt responsabile pentru stocarea informațiilor despre
utilizatori, roluri și autentificarea utilizatorilor în aplicație.
Câteva cuvinte despre Identity
Identity este un API creat de Microsoft care ajută la administrarea utilizatorilor în aplicațiile .Net
și poate fi folosit cu orice framework ASP.NET cum ar fi ASP.Net MVC, Web Forms, Web API
sau SignalR.
Identity poate fi folosit în construirea aplicațiilor web, mobile, de tip storage sau hibride.
Autentificarea ASP.Net este bazată pe middleware -ul Open Web Interface for .Net (OWIN) și
poate fi folosită pe orice host bazat pe OWIN.
Acest API a fost ales deoarece este destu l de ușor de implementat cu ajutorul Visual Studio 2015
Community Edition, care oferă un template cu acest API deja inclus. Mai mult decât atât, privind
de la un nivel superior, API -ul prezintă următoarele beneficii:

 Un singur sistem de identitate – poate fi folosit pentru toate framework -urile ASP.NET
 Controlul persistenței – în mod implicit, Identity stochează toate informațiile utilizatorilor
într-o bază de date. Aceasta folosește Entity Framework Code -First pentru a implementa
toate mecanismele de persistență. Se pot adăuga cu ușurință diferite mecanisme de
stocare cum ar fi SharePoint, Azure Storage Table Service, baze de date de tip NoSql,
etc. fără a fi necesare schimbări majore.
 Furnizor de roluri – restricționează accesul la anumite părți din a plicație în funcție de
roluri.
 Bazat pe revendicări, engl. Claims – Identity suportă autentificarea bazată pe revendicări,
unde identitatea utilizatorului este reprezentată că un set de revendicări (claims), care
ajută dezvoltatorii să fie mult mai expresi vi în descrierea identității.
 Social login providers – pot fi adăugați cu ușurință furnizori pentru social log -în cum ar fi
Conturi Microsoft, Facebook, Twitter, Google la aplicație, și permite stocarea datelor
specifice utilizatorilor în aplicație
 Integrarea cu OWIN – autentificare bazată pe OWIN, poate fi folosit pe orice host bazat
pe Open Web Interface for .Net.

Figure 17: Asp net users

Privire asupra codului sursă al aplicației dezvoltate

Pentru dezvoltarea aplicației s -a folosit template -ul clasic de proiect nou Asp.Net Mvc disponibil în ide -ul
Microsoft Visual Studio 2017 Community Edition. În imaginea de mai jos se poate ved ea structura
proiectului, iar mai jos va fi prezentată fiecare componentă a acestui a.

Figure 18: Structura proiect

1. Folder -ul AppData – este un loc care poate fi folosit pentru a găzdui fișiere necesare
aplicației. De exemplu dacă aplicația noastră ar memora datele în fișiere și nu într -o bază de
date așa cum o face acum, acesta ar fi loc recomandat în care aceste fișiere să existe.
2. Folder -ul AppStart conține clasele responsabile pentru bundleling, pentru configurarea
filtrelor, pentru configurarea API -ului Identity și pentru configurarea rutelor.
3. Folder -ul Co ntent conține fișierele necesare aplicației, ca imagini, sau librarii externe precum
KendoUI sau Bootstrap. Acest folder mai conține și fișierele css ale aplicației.
4. Folder -ul Controllers conține toate clasele de tip Controller are aplicației.
5. Folder -ul D ataAcces conține clasa ElectricsOnlineDbContex , este necesară pentru ca
EntityFramework să poată funcționa în proiect. În clasa ElectricsOnlineDbContex sunt
definite, ca proprietăți fiecare DbSet (prin abstractizare poate fi privit ca un corespondent al
unui tabel din baza de date).
6. Folder -ul fonts, găzduiește fișierele de tip font necesare aplicației.
7. Folder -ul Migrations, conține fișierele Migrations care sunt de asemenea specifice
EntityFramework -ului. Un migration nou se definește atunci când apar modif icări în data
model. Cu ajutorul unei clase de migration se pot rula comenzi asupra bazei de date, pentru
ca modificările apărute să nu destabilizeze aplicația. Un alt exemplu, la adăugarea unei
coloane noi, se pot face operații de insert pe tabelul respec tiv și astfel în coloana nouă pot fi
deja adăugate date.
8. Folder -ul Models are în componență toate clasele de tip model ale aplicației. Prin folosirea
ORM -ului Entity Framework, trebuie creată câte o clasă model pentru fiecare tabel din baza
de date. O clas ă model va avea ca proprietăți toate coloanele existente în tabelul pentru care a
fost definită. Pentru orice proprietate se pot defini data attributes care caracterizează acea
proprietate; aceste attributes pot defini lungimea maxima admisă a coloanei, po t defini un
interval pe care valorile trebuie să îl respecte, dacă este vorba despre o coloană ce ține valori
de tip număr.
9. Folder -ul Scripts, conține fișiere JavaScript folosite în aplicație. Aceste fișiere pot fi ale unor
framework -uri, ca de exemplu jQu ery sau Kendo UI.
10. Folder -ul ViewModels conține clase model specifice view -urilor aplicației.
11. Folder -ul Views are în componență toate view -urile aplicației. Un view conține markup html
și legătura către modelul său.
12. Fișierul Global.asax conține entry point -ul aplicației. Metoda „ Application_Start”, este prima
metodă care se execută atunci când se pornește aplicația. În această metodă poate fi
configurat comportament -ul aplicației, se poate modifica sistemul de routing și nu numai.

13. Fișier -ul Web.config găzdui ește setările de rulare ale aplicației. Una dintre cele mai
importante setări este cea legată de conexiunea la baza de date. Aici se regăsesc și date despre
assembly -urile folosite. În acest fișier se mai pot configura și setări specifice pentru IIS, setăr i
legate de securitate sau de autentificare. Desigur că se pot adăuga și setări customizate, ca de
exemplu endpoint -ul unui alt sistem cu care aplicația noastră ar putea comunica și schimba
date.
În continuare vor fi adăugate câte o clasă reprezentativă di n folderele principale ale aplicației.
Fișierul BundleConfig.cs
using System.Web;
using System.Web.Optimization;

namespace ElectricsOnlineShop
{
public class BundleConfig
{
// For more information on bundling, visit
https://go.microsoft.com/fwlink/?LinkId=301862
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add( new ScriptBundle( "~/bundles/jquery" ).Include(
"~/Scripts/jquery -{version}.js" ));

bundles.Add( new ScriptBundle( "~/bundles/jqueryval" ).Include(
"~/Scripts/jquery.validate*" ));

// Use the development version of Modernizr to develop with and
learn from. Then, when you're
// ready for production, use the build tool at https://modernizr.com
to pick only the tests you need.
bundles.Add( new ScriptBundle( "~/bundles/modernizr" ).Include(
"~/Scripts/modernizr -*"));

bundles.Add( new ScriptBundle( "~/bundles/bootstrap" ).Include(
"~/Scripts/bootstrap.js" ));

bundles.Add( new ScriptBundle( "~/bundles/new -site").Include(
"~/Scripts/owl.carousel.min.js" ,
"~/Scripts/jquery.sticky.js" ,
"~/Scripts/jquery.easing.1.3.min.js" ,
"~/Scripts/main.js" ,
"~/Scripts/jquery.bxslider.js" ,
"~/Scripts/script.slider.js"
));

bundles.Add( new StyleBundle( "~/Content/css" ).Include(
"~/Content/bootstrap.css" ,
"~/Content/site.css" ,
"~/Content/ow.carousel.css" ,
"~/Content/style.css" ,
"~/Content/responsive.css" ,

"~/Content/font -awesome.min.css" ));
}
}
}

Fișierul ElectricsOnlin eDbContex .cs
using ElectricsOnlineShop.DataAccess.Models;
using MySql.Data.Entity;
using System.Data.Common;
using System.Data.Entity;

namespace ElectricsOnlineShop.DataAccess

{
// Code-Based Configuration and Dependency resolution
[DbConfigurationType( typeof(MySqlEFConfiguration))]
public class ElectricsOnlineDbContext : DbContext
{

public DbSet<Customer> Customers { get; set; }
public DbSet<Order_Products> Order_Products { get; set; }
public DbSet<Order> Orders { get; set; }
public DbSet<Models.Product> Products { get; set; }
public DbSet<ShoppingCartData> ShoppingCartDatas { get; set; }
public DbSet<Models.Supplier> Suppliers { get; set; }

public ElectricsOnlineDbContext()
: base(nameOrConnectionString: "DefaultConnection" )
{

}

// Constructor to use on a DbConnection that is already opened
public ElectricsOnlineDbContext(DbConnection existingConnection, bool
contextOwnsConnection)
: base(existingConnection, contextOwnsConnection)
{

}

protected override void OnModelCreating(DbModelBuilder modelBuilder)
{
base.OnModelCreating(modelBuilder);
//modelBuilder.Entity<Car>().MapToStoredProcedures();
}
}
}

Fișierul HomeController.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Mvc;
using ElectricsOnlineShop.DataAccess;
using ElectricsOnlineShop.DataAccess.Models;
using MySql.Data.MySqlClient;

namespace ElectricsOnlineShop.Controllers
{
public class HomeController : BaseController
{

public ActionResult Index()
{
List<DataAccess.Models.Product> products = _ctx.Products.ToList();
ViewBag.Products = products;
return View();
}

public ActionResult Category( string catName)
{
List<DataAccess.Models.Product> products;
if (catName == "")
{
products = _ctx.Products.ToList();
}
else
{
products = _ctx.Products.Where(p => p.Category ==
catName).ToList();
}
ViewBag.Products = products;
return View("Index");
}

public ActionResult Search( string searchText)
{
List<DataAccess.Models.Product> products;
if (string.IsNullOrWhiteSpace(searchText))
{
products = _ctx.Products.ToList();
}
else
{
products = _ctx.Products.Where(p =>
p.PName.Contains(searchText) ||
p.Description.Contains(searchText)
||

p.Brand.Contains(searchText)).ToList();
}
ViewBag.Products = products;
ViewBag.SearchText = searchText;
return View("Index");

}

public ActionResult Suppliers()
{
List<DataAccess.Models.Su pplier> suppliers =
_ctx.Suppliers.ToList();
ViewBag.Suppliers = suppliers;
return View();
}

public ActionResult AddToCart( int id)
{
addToCart(id);
return RedirectToAction( "Index");
}

private void addToCart( int pId)
{
// check if product is valid
DataAccess.Models.Product product = _ctx.Products.FirstOrDefault(p
=> p.PID == pId);
if (product != null && product.UnitsInStock > 0)
{
// check if product already existed
ShoppingCartData cart =
_ctx.ShoppingCartDatas.FirstOrDefault(c => c.PID == pId);
if (cart != null)
{
cart.Quantity++;
}
else
{

cart = new ShoppingCartData
{
PName = product.PName,
PID = product.PID,
UnitPrice = product.UnitPr ice,
Quantity = 1
};

_ctx.ShoppingCartDatas.Add(cart);
}
product.UnitsInStock –;
_ctx.SaveChanges();
}
}

public ActionResult About()
{
ViewBag.Message = "Your application description page." ;

return View();
}

public ActionResult Contact()
{
ViewBag.Message = "Your contact page." ;

return View();
}
}
}

Fișierul ManageViewModels .cs
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using Microsoft.AspNet.Identity;
using Microsoft.Owin.Security;

namespace ElectricsOnlineShop.Models
{
public class IndexViewModel
{
public bool HasPassword { get; set; }
public IList<UserLoginInfo> Logins { get; set; }
public string PhoneNumber { get; set; }
public bool TwoFactor { get; set; }
public bool BrowserRemembered { get; set; }
}

public class ManageLoginsViewModel
{
public IList<UserLoginInfo> CurrentLogins { get; set; }
public IList<AuthenticationDescription> OtherLogins { get; set; }
}

public class FactorViewModel
{
public string Purpose { get; set; }
}

public class SetPasswordViewModel
{
[Required]
[StringLength(100, ErrorMessage = "The {0} must be at least {2} characters
long.", MinimumLength = 6)]
[DataType(DataType.Password)]
[Display(Name = "New password" )]
public string NewPassword { get; set; }

[DataType(DataType.Password)]
[Display(Name = "Confirm new password" )]
[Compare( "NewPassword" , ErrorMessage = "The new password and confirmation
password do not match." )]
public string ConfirmPassword { get; set; }
}

public class ChangePasswordViewModel
{
[Required]

[DataType(DataType.Password)]
[Display(Name = "Current password" )]
public string OldPassword { get; set; }

[Required]
[StringLength(100, ErrorMessage = "The {0} must be at least {2} characters
long.", MinimumLength = 6)]
[DataType(DataType.Password)]
[Display(Name = "New password" )]
public string NewPassword { get; set; }

[DataType(DataType.Password)]
[Display(Name = "Confirm new password" )]
[Compare ("NewPassword" , ErrorMessage = "The new password and confirmation
password do not match." )]
public string ConfirmPassword { get; set; }
}

public class AddPhoneNumberViewModel
{
[Required]
[Phone]
[Display(Name = "Phone Number" )]
public string Number { get; set; }
}

public class VerifyPhoneNumberViewModel
{
[Required]
[Display(Name = "Code")]
public string Code { get; set; }

[Required]
[Phone]
[Display(Name = "Phone Number" )]
public string PhoneNumber { get; set; }
}

public class ConfigureTwoFactorViewModel
{
public string SelectedProvider { get; set; }
public ICollection<System.Web.Mv c.SelectListItem> Providers { get; set; }
}
}

Fișierul Customer ViewModel.cs
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace ElectricsOnlineShop.Models

{
public class CustomerViewModel
{
[Display(Name = "Id")]
public int CID { get; set; }

[Required(ErrorMessage = "Prenume este un camp obligatoriu" )]
[Display(Name = "Prenume" )]
public string FName { get; set; }

[Required(ErrorMessage = "Nume este un camp obligatoriu" )]
[Display(Name = "Nume")]
public string LName { get; set; }

[Display(Name = "Telefon" )]
[Required(ErrorMessage = "Telefon este un camp obligatoriu" )]
public string Phone { get; set; }

[Display(Name = "Adresa" )]
[Required(ErrorMessage = "Adresa este un camp obligatoriu" )]
public string Address1 { get; set; }

[Display(Name = "Adresa 2" )]
public string Address2 { get; set; }

[Display(Name = "Adresa: Zona/Cartier" )]
public string Suburb { get; set; }

[Required(ErrorMessage = "Cod postal este un camp obligatoriu" )]
public string Postcode { get; set; }

[Required(ErrorMessage = "Judet este un camp obligatoriu" )]
public string State { get; set; }

[Required(ErrorMessage = "Tip card este un camp obligatoriu" )]
[Display(Name = "Tip card" )]
public string Ctype { get; set; }

[Required(ErrorMessage = "Numar card este un camp obligatoriu" )]
[Display(Name = "Numar card" )]
[StringLength(16, ErrorMessage = "Numar card introdus nu este corect." ,
MinimumLength = 15)]
public string CardNo { get; set; }

[DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}" )]
[Required(ErrorMessage = "Data expirare card este un camp obligatoriu" )]
[Display(Name = "Data expirare card" )]
public DateTime ExpDate { get; set; }

[Display(Name = "Judet")]
public IEnumerable<SelectListItem> States { get; set; }

[Required(ErrorMessage = "Email este un camp obligatoriu" )]
[EmailAddress]
public string Email { get; set; }
}
}

Fișierul Index.cshtml
@{
ViewBag.Title = "Home Page" ;
}

iPhone <span class="primary"> X <strong></strong></span>

</h2>

<h4 class="caption subtitle"> Apple</h4>
</div>

</li>

<li>

<h2 class="caption title"> <span class="primary"> 50% <strong> promo</strong></span>
</h2>

<h4 class="caption subtitle"> Super oferta </h4>
</div>

</li>

<li>

<div class="caption -group">
<h2 class="caption title">
<span class="primary"> 30% reducere <strong></strong></span>
</h2>

</div>

</li>

<li>

<div class="caption -group">
<h2 class="caption title">
<span class="primary"> Acer
<strong>Predator </strong></span>
</h2>
<h4 class="caption subtitle"> Helios 300 </h4>

</div>

</li>

</ul>

</div>

<!– ./Slider –>
</div> <!– End slider area –>

@if (ViewBag.Products.Count == 0)
{
<br />
<div id="EmptyDataMsg" class="alert alert -info">
<strong>Ne pare rau! </strong> Nu au fost gasite produse care sa
corespunda criteriilor de filtrare.
</div>
}
else
{
<div class="container">
<div class="zigzag -bottom"></ div>
<div class="row">
<div class="col-md-6 col-sm-12">
<h2>Produse</h2>
</div>
</div>

<span>Filtreaza dupa Cat egorie:</span>

<option>– Selecteaza –</option>

<option value="">Toate</option>

<option value="Telefoane Mobile"> Telefoane Mobile </option>

<option value="Monitoare"> Monitoare </option>

<option value="Laptopuri"> Laptopuri </option>

</select>

</form>

</div>

<span>Filtreaza dupa cuvinte cheie: </span>

</form>

</div>

@foreach (var item in ViewBag.Products)

{

@if (string.IsNullOrEmpty(item.ImagePath))

{

}

else

{

}

</div>

<h2><a href="">@item.PName </a></h2>

<span class="p-brand">@item.Brand </span>

<ins>@String.Format( "{0:c}", item.UnitPrice) </ins>

</div>

@item.UnitsInStock

@if (item.UnitsInStock > 1 || item.UnitsInStock == 0)

{

<text>bucati</text>

}

else

{

<text>bucata</text>

}

</span>

@if (item.UnitsInStock > 0)

{

@Html.ActionLink( "adauga in cos" , "AddToCart" , "Home", new { id = item.PID },
htmlAttributes: new { @class = "add_to_cart_button" })

</div>

}

</div>

}

</div>

}

</div>

Concluzii

Evoluția tehnologiei a produs schimbări radicale ale acestui domeniu din toate punctele de vedere.
HTML -ul oferă posibilitatea de a partaja materiale în toate tipurile de formate, cum ar fi videoclipuri,
slideshow -uri, documente word sau pdf -uri.
HTML est e o formă de marcare orientată către prezentare a documentelor text pe o singură pagină,
utilizând un software de redare specializat, numit agent utilizator HTML. În esență, succesul său rezultă
din accesul prietenesc și eficient la informațiile și cunoștin țele cele mai noi, la formele cele mai evoluate
de prezentare, de asimilare și de evaluare a cunoștințelor.
Există o multitudine de sisteme software care pot defini o pagina web. Cu instrumentul potrivit,
pot fi automatizate diferite procese, cum ar fi def inirea textelor , imaginilor , videoclipurilor și creeri de
conținut.
În primul capitol au fos t prezentate noțiunile de HTML ș i CSS .
Apoi, a fost făcută o abordare a HTML -ului ș i CSS -ului din mai multe perspective împreună cu o
înțelegere a istoricului acestei noțiuni.
În partea finală a primului capitol s -au prezentat beneficiile H TML -ului ș i CSS -ului și diferite
implementări existente .
În cel de -al do ilea capitol, s -au prezen tat noțiunile de Java Script ș i jQUERY.
Apoi, a fost făcută o mică abordare a Java Script ș i jQUERY din mai multe perspective împreună
cu o înțelegere a istor icului acestor noțiuni ș i scurte exemple.
În cel de -al treilea capitol s -au prezentat tehnologiile de implementare a unui site web, dup ă care
s-a facut o introducere în Microsoft Visual Studio 2017 î n care a fost descris cu mici exeple site -ul
Magazinului virtual.
În ultima parte a lucrării, s -a prezentat structura aplicației, modelul de date creat pen tru această aplicație,
dar și detalierea responsabilității părților componente ale aplicației web .

Bibliografie

1. Resource Development Press.
2. Deitel Paul, Deitel Harvey, Deitel Abbey Android: How to Program, Ebook, 2012
3. Brockschmidt Kraig Programming Windows 8 Apps with HTML CSS and JavaScript, Microsoft
Press, 2012
4. Clark Dan, Beginning C# Object -Oriented Programming, Apress, 2011
5. Desjardins Patrick, Visual Studio Condensed, Apress, 2014
6. Jacobson Ivar, The Unified Software Development Process , Addison -Wesley Professional, 1999
7. Nagel C., Evjen B., Glynn J., Watson K., Skinner M., Professional C# 2012 And NET.4.5, John
Wiley & Sons, Inc., 2013
8. Dewson R. – Beginning SQL Server 2008 for Developers , Apress, 2009
9. Nielsen P., White. M., Uttam P., – Microsoft SQL Server 2008 Bible, Wiley Publishing Inc,
USA, 2009
10. Schneider R.D., Gibson D. Microsoft SQL Server All In One Desk Reference, Wiley Publishing
Inc, USA, 2009
11. Entity Framework . (2016, 11 13). Retrieved 11 13, 2016, from Entity Framework:
http://www.entityframeworktutorial.net/what -is-entityframework.aspx
12. Fluent Validation . (2016, 11 13). Retrieved 11 13, 2016, from Github:
https://github.com/JeremySkinner/FluentValidation
13. Frăsinaru, C. (2016). curs Programare Avansată. Iași: Facultatea de In formatică, Universitatea
„Alexandru Ioan Cuza” Iași .
14. Joudeh, T. (2014, Iunie 1). Token Based Authentication using ASP.NET Web API 2, Owin, and
Identity . Retrieved November 16, 2016, from Bit of technology:
http://bitoftech.net/2014/06/01/token -based -authe ntication -asp-net-web-api-2-owin -asp-net-
identity/
15. Microsoft .NET Core . (2016, 11 13). Retrieved 11 13, 2016, from Microsoft:
https://www.microsoft.com/net/core#windows
16. Microsoft . (2016, 11 13). Retrieved 11 13, 2016, from Microsoft: https://msdn.microso ft.com/en –
us/library/z1zx9t92.aspx
17. **** , Microsoft IIS. Disponibil la: http://www.iis.net/
18. **** , Wikipedia Web service. Disponibil la: http://en.wikipedia.org/wiki/Web_service

Copyright Notice

© Licențiada.org respectă drepturile de proprietate intelectuală și așteaptă ca toți utilizatorii să facă același lucru. Dacă consideri că un conținut de pe site încalcă drepturile tale de autor, te rugăm să trimiți o notificare DMCA.

Acest articol: Subsemnatul NEACȘU ALIN -GEORGEL, student la specializarea INGINERIA SISTEMELOR [631515] (ID: 631515)

Dacă considerați că acest conținut vă încalcă drepturile de autor, vă rugăm să depuneți o cerere pe pagina noastră Copyright Takedown.

Subsemnatul NEACȘU ALIN -GEORGEL, student la specializarea INGINERIA SISTEMELOR [631515]

Copyright Notice

LLR – LLE, Third year, First Semester [606490]

INFORMATICA, 2015, Vol. 26, No. 3, 407417 407 [628002]

Chelaru Andreea Adina Html,css(1) (1) [625003]

Auditul ecologic constituie un mecanism nou de acțiune în realizarea practică a [627524]

Microsoft Word – ghid_licenta_disertatie.doc [307749]

Psihologia și sociologia administra iei ț [616629]

Copyright Notice

Similar Posts