Realizarea unui site pentru o companie din domeniul IT [618292]
F 271.13/Ed.3 Fișier SMQ/Formulare
Anexa 8
MINISTERUL EDUCAȚIEI NAȚIONALE
UNIVERSITATEA PETROL – GAZE DIN PLOIEȘTI
FACULTATEA: ȘTIINȚE ECONOMICE
DEPARTAMENTUL: CIBERNETICĂ, INFORMATICĂ
ECONOMICĂ, FINANȚE ȘI CONTABILITATE
PROGRAMUL DE STUDII: INFORMATICĂ ECONOMICĂ
FORMA DE ÎNVĂȚĂMÂNT: (I F/FR/ID): IF
Vizat
Facultatea ȘTIINȚE ECONOMICE
(semnătura și ștampila) Aprobat,
Director de departament,
Lect. univ. dr. Tudorică Bogdan
George
LUCRARE DE LICENȚĂ
REALIZAREA UNUI SITE PENTRU O COMPANIE
DIN DOMENIUL IT
Conducător științific:
Lect. univ. dr. Dumitru Ileana
Absolvent: [anonimizat]
2018
F 272.1 3/Ed.2 Fișier SMQ/Formulare
UNIVERSITATEA PETROL – GAZE DIN PLOIESTI Anexa 9
FACULTATEA: ȘTIINȚE ECONOMICE
DOMENIUL: CIBERNETICĂ, STATISTICĂ ȘI INFORMATICĂ ECONOMICĂ
PROGRAMUL DE STUDII: INFORMATICĂ ECONOMICĂ
FORMA DE ÎNVĂȚĂMÂNT: IF/FR/ID: IF
Aprobat,
Director de departament,
Lect. univ. dr. Tudorică Bogdan
George Declar pe propria răspundere că voi elabora
personal proiectu l de diplomă / lucrarea de licență /
disertație și nu voi folosi alte materiale documentare
în afara celor prezentate la capitolul „Bibliografie”.
Semnătură student(ă):
DATELE INIȚALE PENTRU LUCRARE LICENȚĂ
Proiectul a f ost dat student: [anonimizat]: Brezeanu Alexandru Ion
1) Tema lucrării : Realizarea unui site pentru o companie din domeniul IT
2) Data eliberării temei: …..
3) Tema a fost primită pentru îndeplinire la data: ….
4) Termenul pentru predarea lucrării: 03.07 .2018
5) Elementele inițiale pentru lucrare: Structura lucrării, Cuprinsul, Note bibliografice
6) Enumerarea problemelor care vor fi dezvoltate:
INTRODUCERE
NOȚIUNI INTRODUCTIVE ÎN REALIZAREA SITE -URILOR WEB
APLICAȚII UTILIZATE PENTRU CREAREA SITE -URILOR WEB
REALIZAREA ȘI PREZENTAREA APLICAȚIEI
CONCLUZII ȘI PROPUNERI
BIBLIOGRAFIA
7) Enumerarea materialului grafic (acolo unde este cazul): … TABELE, … FIGURI
Figura 1. Implementarea paginilor dinamice pe partea de server
8) Consult ații pentru lucrare, cu indicarea părților din proiect care necesită consultarea: bilunare
Conducător științific: Student(ă)
Lect. univ. dr. Dumitru Ileana Brezeanu Alexandru Ion
Semnătura: Semnătura:
F 273.13/Ed.2 Fișier SMQ/Formulare
UNIVERSITATEA PETROL – GAZE DIN PLOIESTI Anexa 10
FACULTATEA: ȘTIINȚE ECONOMICE
DOMENIUL: CIBERNETICĂ, STATISTICĂ ȘI INFORMATICĂ ECONOMICĂ
PROGRAMUL DE STUDII: INFORMATICĂ ECONOMICĂ
FORMA DE ÎNVĂȚĂMÂNT: IF/FR/ID: IF
APRECIERE
privind activitatea absolvent: [anonimizat]: BREZEANU ALEXANDRU ION
în elaborarea lucrării de licență cu tema: Realizarea unui site pentru o companie din domeniul IT
Nr.
crt. CRITERIUL DE APRECIERE CALIFICATIV
1. Documentare, prelucrarea informațiilor din bibliografie
2. Colaborarea ritmică și efi cientă cu conducătorul temei proiectului de
diploma /lucrării de licență
3. Corectitudinea calculelor, programelor, schemelor, desenelor,
diagramelor și graficelor
4. Cercetare teoretică, experimentală și realizare practică
5. Elemente de originalita te (dezvoltări teoretice sau aplicații noi ale
unor teorii existente, produse informatice noi sau adaptate, utile în
aplicațiile inginerești)
6. Capacitate de sinteză și abilități de studiu individual
CALIFICATIV FINAL
Calificativele pot fi: nesatisf ăcător/satisfăcător/bine /foarte bine /excelent .
Comentarii privind calitatea lucrării :
________________________________________________________________________________________
____________________________________________________________________________ ____________
________________________________________________________________________________________
________________________________________________________________________________________
________________________________________________ ____________________ ____________________
Data:
Conducător științific
Lect. univ. dr. Dumitru Ileana
F 273.13/Ed.2 Fișier SMQ/Formulare CUPRINS
Introducere ………………………….. ………………………….. ………………………….. ………… 1
Capitolul 1. Noțiuni introductive în realizarea paginilor Web ………………………… 3
1.1. Utilizarea limbajului HTML în realizarea de site -uri ………………………….. 3
1.2. Utilizarea limbajului CSS în realizarea de site -uri ………………………….. ….. 5
1.4. Utilizarea limbajului PHP în realizarea de site -uri ………………………….. …. 8
1.3. Componente dinamice în realizarea paginilor Web ………………………….. … 9
1.3.1. Realizarea de pagini Web statice ………………………….. …………………… 9
1.3.2. Realizarea de pagini Web dinamice ………………………….. ……………… 11
1.3.3. Componente dinamice în componenta client a paginilor Web ……… 12
1.3.4. Componente dinamice în componenta server a paginilor Web ………… 14
Capitolul 2. Unelte utilizate pentru crearea site -urilor Web …………………………. 16
2.1. Utilizarea aplicației Notepad ++ pentru realizarea site -urilor Web ……… 16
2.4. Utilizarea limbajului SQL pentru realizarea site -urilor Web ………………. 19
2.2. Utilizarea MySQL pentru realizarea site -urilor Web …………………………. 21
Capitolul 3. Proiectarea site -ului Web ………………………….. ………………………….. 22
3.1 Descrierea aplicației ………………………….. ………………………….. ……………… 22
3.2. Proiectarea bazei de date ………………………….. ………………………….. ………. 23
3.2. Structura modulului de utilizator ………………………….. ……………………….. 25
3.2.1. Pagina d e Homepage ………………………….. ………………………….. …………. 25
3.2.2. Pagina de înregistrare ………………………….. ………………………….. ………… 26
3.2.3. Pagina de conectare ………………………….. ………………………….. …………… 27
3.2.4. Pagina cu toate produsele ………………………….. ………………………….. …… 28
3.2.5. Pagina unei ca tegorii de produse ………………………….. …………………….. 29
3.2.6. Pagina unei subcategorii de produse ………………………….. ………………… 30
F 273.13/Ed.2 Fișier SMQ/Formulare 3.2.7. Pagina produsului ………………………….. ………………………….. ……………… 30
3.2.8. Coșul de cumpărături ………………………….. ………………………….. ………… 31
3.2.9. Profilul meu ………………………….. ………………………….. ……………………… 31
3.2.10. Comenzile mele ………………………….. ………………………….. ………………. 32
3.2.11. Pagina unei comenzi ………………………….. ………………………….. ……….. 32
3.3. Structura modulului de administrator ………………………….. …………………. 33
3.3.1. Panoul de administrare ………………………….. ………………………….. ………. 33
3.3.2. Administrarea ut ilizatorilor ………………………….. ………………………….. … 34
3.3.3. Administrarea categoriilor ………………………….. ………………………….. …. 37
3.3.4. Administrarea subcategoriilor ………………………….. …………………………. 39
3.3.5. Administrarea produselor ………………………….. ………………………….. …… 42
3.3.6. Administrarea comenzilor ………………………….. ………………………….. ….. 44
1
Introducere
Proiectarea unui site, oricare ar fi acesta, este una complexă și trebuie tratată cu
seriozitate, mai ales când vine vorba de proiectarea unui site pentru o companie din
domeniul IT.
Tema pe care am ales -o are la bază proiectarea și implementarea unui site pen tru
o companie din domeniul IT ( un domeniu foarte puter nic tehnologizat în ultimii ani) cu
un mediu care se dezvoltă foarte rapid și foarte puternic. De asemenea, sectorul IT în
Rom ânia este unul foarte dezvoltat – ponderea sa în formarea PIB dublându -se în ulti mii
5 ani, potrivit datelor INS.
Principalul motiv al alegerii acestei teme are la bază prezentarea unui model de
interfață al unui site pentru o companie fictivă din sectorul informatic care să atragă cei
mai mulți dintre clienți i de pe piață și care să c oncureze la acelaș i nivel cu companiile
deja existente în acest sector. O metodă de a atrage clienți și de a promova compania o
reprezintă, în principal, existența acestui site. Tocmai de aceea, site -ul creat are o interfață
plăcută, făcută special în întâ mpinarea clientului, cu informații despre obiectivele
companiei, despre modul de lucru, clienți, modalităț i de contact, dar și legături că tre
pagina de socializare pentru a fi la curent cu mai multe știri și noutăți referitoare la
activitățile companiei și nu numai.
Având în vedere numeroasele modalități de proiectare a site -urilor si programele
folosite în acest sens, am ales să realizez proiectul cu 3 limbaje : HTML (Hypertext
Markup Language ), CSS(Cascading Style Sheets) și PHP (Hypertext Preprocesor) .
În ceea ce privește structura lucrării, aceasta este împărțită în capitole și
subcapitole, fiecare având rolul lor bine stabilit. Am încercat să scot în evidență la
începutul lucrării câteva informații în legătură cu utilizarea programelor menționate mai
sus, cât și conexiunea dintre acestea. De asemenea, am caracterizat câteva idei de bază
privind dinamica în pagina Web, un aspect foarte important de altfel, urmând ca după să
descriu câteva principii despre mediul de lucru și anume programul software utiliz at în
cadrul programelor principale. În cadrul mediului de lucru, am exemplificat, cu porțiuni
de cod, cum anume am folosit și am creat elementele specifice site -ului respectiv.
2
Prezentarea aplicației, metodele folosite, legăturile folosite între paginil e site -ului
cât și elementele de grafică sunt precizate într -un alt capitol, care evidențiază exact pașii
care au dus la realizarea completă a acestui site. În final, am redactat un capitol explicit
cu concluziile și propunerile aduse în vederea acestei lu crări de licență, cât și menționarea
surselor bibliografice.
Obiectivul concret al acestei lucrări este de a realiza un mijloc de promovare al
acestei companii fictive, un mijloc prin care clienții să fie atrași de originalitatea site -ului,
dar și de serv iciile oferite în comparație cu alte companii de pe ace eași piață.
Realizarea unui site nu este ușoară, mai ales când vine vorba despre prezentarea
unei companii din domeniul IT. Acesta trebuie să fie diferit față de un site obișnuit, trebuie
să aibă anum ite caracteristici și funcții speciale, care să permită utilizatorului sau
potențialului client să fie atras de ceea ce vede și să ia legătura cu compania prin
intermediul mailului sau numărului de contact. În plus, am creat o legătură specială către
cea m ai cunoscută rețea de socializare, anume Facebook, pentru a continua promovarea
acolo unde marea masă a utilizatorilor are acces și de unde se pot găsi mai multe
informații legate de activitatea firmei.
Ca și specializare a acestei companii, am optat pen tru realizarea de programe
software, fiind o cerință foarte căutată pe piață în ziua de azi, mai ales de către firmele
mari, dar și de cele nou înființate, care caută sa -și deschidă sau să -și lărgească afacerea
online prin intermediul unui sistem informati c. De asemenea, am introdus câteva principii
în lucrare prin care această companie este diferită de una obișnuită prin modul cum își
ajută clienții și de gradul de mulțumire pe care aceștia îl au referitor la calitatea serviciilor
și totodată am vrut ca ac eastă companie să fie una tânără, cu oameni ambițioși și care
caută să se dezvolte pe parcursul timpului, iar tocmai prin prisma acestui fapt, am creat
secțiunea “Cariere”, unde se află toate detaliile referitoare la etapele procesului de
recrutare, despre ce condiții trebuie să îndeplinească un candidat și cum poate aplica
respectivul, trimițând, printr -un simplu click, CV -ul la adresa de contact a companiei.
Tot o secțiune aflată în cadrul acestui site se numește “Parteneri ” în care se
prezintă marile fi rme cu care societatea IT colaborează și a căror reprezenta nți și-au lăsat
notată o impresie legată de modul de lucru al angajaților, despre timpul în care softurile
comandate au fost finalizate, cât și despre gradul de mulțumire referitor la produsul fini t.
3
Capitolul 1 . Noțiuni introductive în realizarea paginilor Web
1.1. Utilizarea limbajului HTML în realizarea de site -uri
HTML (Hyper Text Markup Language) este limbajul cel mai des folosit pentru a
proiecta pagini Web. HTML -ul a fost creat de Berners -Lee în anul 1991, dar HTML 2.0
a fost primul standard specificat care a fost publicat în anul 1995. HTML 4.01 a fost prima
mare versiune și a fost publicat în anul 1999. În prezent, cea mai frecvent utilizată este
versiunea HTML -5, publicată în 2012. Origi nal, acest program a fost creat în ideea în
care se definesc structurile documentelor ca antete, paragrafe, liste, cât și de a facilita
trimiterea de informații științifice între cercetători.
Din punct de vedere tehnic, HTML nu este definit ca fiind un lim baj de
programare, ci un limbaj de modelare folosit pentru construirea site -urilor Web.
Hypertext se referă la modul în care paginile Web (documentele HTML) sunt conectate.
De asemenea, link -ul existent pe o pagină web se numește Hypertext . Cum sugerează ș i
numele, HTML este un limbaj de modelare, ceea ce înseamnă că se folosește modelarea
prin tag -uri care sunt comunicate browserului Web cum să fie structurate în pagină.
Aceste tag -uri sunt incluse între paranteze unghiulare <Tag name> . Except ând câteva
tag-uri, majoritatea au tag -urile de închidere corespondente. Spre exemplu, <html> are
tagul de închidere </html> și <body> are tagul de închidere </body> etc.
Componența unui document HTML este:
versiunea HTML a documentului
zona head cu etichetele <head> și </head>
zona body cu etichetele <body> </body> sau <frameset> </frameset>
Orice fișier HTML are următoarea structură:
<html>
<head>
<title>Titlul</title>
</head>
<body>
</body>
</html>
4
Browserul web interpretează aceste tag uri afișând pe ecran rezultatu l. HTML -ul
este un limbaj care nu face deosebire între majuscule și minuscule. Pagina principală a
unui domeniu este fișierul „ index.html ”, putând fi setată să fie afișată automat la vizitarea
unui domeniu. De exemplu la vizitarea domeniului www.skysports. ro este afișată pagina
www.skysports.ro/index.html .
De asemenea, exista 3 tipuri de marcare a limbajelor HTML, prin care se pot edita
textele , folosind anumite taguri pentru a edita și a arăta în pagină ex act structura pe care
o dorește utilizatorul la momentul respectiv, anume :
Marcare structurală – tip de marcare care indic ă browserului Web
pentru a prezenta “Fotbal” ca pe cel mai important titlu. Acest tip de
marcare are stilul predefinit.
<h1>Fotba l</h1>
Marcare pentru prezentare – prezintă textul “îngroșat”, cu litere
groase
<strong>îngroșat</strong>
Marcare pentru hiperlink – leagă părți ale documentului cu alte
documente
<a href="http://ro.wikipedia.org/">Wikipedia Românească</a>
Site-ul Web este construit ca și o colecție legată de date și informații prezentate
sub forma acestor pagini Web, între care există anumite conexiuni. Publicarea unui site
local se referă la director, care împreună cu conținutul acestuia este transferat către s erver –
ul Web care conține progamul software prin care site -ul este transmis către browserul
conectat la Internet. Din momentul în care va fi publicat, site -ul local se transformă în site
Web.
Internetul , pe de altă parte, reprezintă un ansamblu de calcula toare interconectate,
un ansamblu de protocoale de comunicații care permit transferul datelor în diferite rețele.
Accesul la Internet reprezintă modul cum se face accesul, cât și la informațiile care se
transmit în rețea. Majoritatea societăților comercial e și nu numai au optat pentru
promovarea produselor și serviciilor pe Internet pentru mai multă ușurință în domeniul
publicității.
5
1.2. Utilizarea limbajului CSS în realizarea de site-uri
CSS (Cascading Style Sheets) reprezintă standardul care ajut ă la formatarea unui
document HTML prin intermediul stilurilor cărora se pot atașa fișiere externe cu ajutorul
elementului <style> . Acest limbaj de design se vrea a fi un proces de simplificare în
crearea paginilor Web, în ideea de a le face mai prezentabi le.
Prin acest program putem controla spre exemplu culoarea textului, stilurile și
fonturile, spațiul dintre paragrafe, cum anume sunt așezate coloanele în pagină, culoarea
backroundului dar și multe alte efecte, fiind ușor de învățat și dovedind a avea u n puternic
control asupra prezentării documentului HTML. De asemenea, acest program este
combinat cu limbajele de modelare HTML sau XHTML.
CSS-ul a fost inventat de Hakon Wium Lie pe 10 Octombrie 1944 și a fost
menținut de un grup de oameni cu ajutorul W 3C (World Wide Web Consortium) și care
se numea CSS Working Group, o organizație care creează documente numite specificații .
Când o specificație a fost discutată oficial și rectificată de membrii W3C, această
specificație devine o recomandare. Acestea sunt numite recomandări deoarece W3C nu
deține controlul asupra implementării actuale a limbajului.
Începutul CSS -ului este prezentat pe încă din decembrie, anul 1996, atunci când
se prezenta versiunea CSS1, care a reieșit ca o recomandare a W3C și care descr ia
limbajul CSS ca un simplu model de formatare al tuturor tagurilor HTML -ului. Pornind
de la aceasta variantă, CSS2 a fost lansat tot ca o recomandare a W3C -ului în mai 1998
și venea cu un update privind partea de suport pe partea de style sheets media, s pre
exemplu printerele și dispozitivele audio, fonturi care se pot descărca de pe Internet,
elemente de poziționare și tabele. Nu în ultimul rând, CSS3 a apărut în 1998, o versiune
care a fost divizată în documentații numite module și în care fiecare modul are noi extensii
definite în CSS2.
Sintaxa generală a unui document CSS este:
Selector { property: value }
Sunt multe motive de a utiliza CSS în corelație cu HTML atunci când vorbim de
realizarea unui site Web. În primul rând se face o economie de timp t ocmai prin prisma
faptului că se poate defini pentru fiecare element HTML și se poate aplica pe câte pagini
Web se dorește.
6
În plus, paginile Web se încarcă mult mai ușor pentru ca nu va trebui rescris
fiecare atribut de fiecare dată, aria acestora fiind mult mai largă decât la HTML și de
asemenea este indicată utilizarea acestui program în toate paginile HTML pentru a -l face
compatibil cu toate motoarele de căutare Web pentru că este posibil să fie stocate aplicații
local cu ajutorul unui cache offline. Cache -ul de asemenea asigură o în cărcare mai rapidă
și o mai bună performanță a Website -ului. CSS-ul și seturile sale de reguli sunt
interpretate de browser și sunt aplicate elemntelor corespondente ale documentelor în
document. O regulă de stil este forma tă din 3 părți:
Selectorul – un selector HTML este un tag pe care un stil poate fi aplicat.
Acesta poate fi un tag precum <h1> sau <table>
Proprietatea – O proprietate este un tip de atribut al tagului HTML.
Aplicându -l simplu, toate atributele sunt conve rtite în proprietăți CSS.
Acestea pot fi color, border , etc.
Valoarea – Valorile sunt asignate de proprietăți. Spre exemplu,
proprietatea color poate avea valoarea red sau #F1F1F1 etc.
Spre exemplu, se poate defini o bordură de tabel . În cazul următor, t abelul este
selector și bordura este proprietatea cu valoarea dată 1px solid #C00 .
table{ border :1px solid #C00}
O sintaxă generală în CSS este structurată pe 3 nivele și anume:
1. Tipul inline – Comenzile CSS de nivel 1 sunt folosite cel mai des, supr ascriind
orice alte comenzi CSS. Se pot găsi în interiorul etichetelor HTML aflate in zona
BODY și au forma:
<eticheta >
style="codul CSS dorit"> …textul sau obie ctul</eticheta>
2. Tipul embedded – Comenzile de nivel 2 sunt cele aflate între perechea de etic hete
<head> si </head> conform sintaxei :
<style type="text/css"> <!–… comenzi CSS … </style>
Style specifică unde începe și unde se termină blocul CSS iar type este folosit
pentru a ascunde de browserele vechi, care nu cunosc forma CSS, conținutul blocu lui
style.
7
3. Tipul externe – folosirea fișierului de nivel 3 la nivel extern este foarte accesibil
în mai multe cazuri, eliminând introducerea codului de mai multe ori și editarea
acestuia pentru mai multe fișiere. Legătura paginilor HTML cu fișierel e CSS se
face prin introducerea următoarei linii de cod:
<link rel="stylesheet" type=" text/css" href="fisier_css.css">
Id si class sunt comenzi care dau unei formatari CSS un nume. Se folo sesc atunci
cand dorim sa aplică m un style de formatare unei anume z one. Pentru compatibilitate cu
versiunile anterioare de browsere numele asociate zonelor nu vor contine caracterul _.
Elementul id se aplică unui style de format o singură dată sau la o singură etichetă
HTML, plasâ ndu-se un nume acelui style. Acest elemen t necesită existența comezilor
CSS în zona HEAD sau î ntr-un fiș ier extern. Exemplu :
</style>
</head>
<body>
<p id=”albastru”>Text albastru prin id “albastru”</p>
Elementul class este similar cu id dar spre deosebire de acesta poate fi folosit de
mai multe ori sau pentru zone mai mari. Ca și la id necesită existența comenzilor CSS î n
zona HEAD sau într-un fișier extern. Exemplu:
<body>
<p class="rosu">Primul text rosu introdus prin class "rosu"</p>
Text negru
<p class= "rosu">Al doilea text rosu introdus pri n class "rosu"</p>
</body>
Extensia acestor fișiere este .css, iar o legătură între paginile Web și aceste fișiere
externe se fac e prin link -uri. Modelarea acestor linkuri este un element foarte important,
acestea putând fi modelate după comportamentul lor , aplicând câte un stil dacă linkul
respectiv a fost accesat sau dacă punem deasupra linkului cursorul.
8
1.4. Utilizarea limbajului PHP în realizarea de site -uri
PHP este un limbaj de programare orient at spre programarea web dinamică . Se
poate folos i în combinație cu HTML, J avascript, CSS, AJAX, PERL si Mysql pentru a
realiza sit e-uri de o complexitate ridicată. La ora actuală toate site -urile dinamice sunt
realizate î n acest limb aj de programare sau în combinaț ie cu alte limbaje. Conform
statisticil or (Wikipedia) este instalat pe 20 de milioane de sit e-uri web si pe 1 milion de
servere web. Este un limbaj de programare gratis.
Acest limbaj de programare poate fi inclus în codul HTML sau poate fi folosit ca
template pentru sistemele web, pentru conți nutul paginilor de web management sau
frameworkuri web. Codul PHP este de obicei descifrat de un interpretor ca și un modul
în serverul web sau ca un executabil. Serverul web combină rezultatele a codului PHP
interpretat și executat, care poate fi orice ti p de dată, incluzând imagini cu pagina web
generată. Acest cod mai poate fi executat cu ajutorul interfeței a unei linii de comandă și
poate fi executat pentru a implementa aplicațiile grafice.
Pentru a defini dianmism paginilor web create, limbajul PHP n e va ajuta să
efectuăm acest lucru. Acest tip de limbaj este benefic pentru crearea aplicațiilor web
dinamice, unde se poate dezvolta și o interfață grafică pentru a veni în ajutorul
utilizatorului. Sintaxa PHP provine din limba engleză – Hypertext Preproc esor.
Tehnologia respectivă a devenit în ultimul timp cea mai interesantă unealtă nu
numai pentru dezvoltatorii web, ci și pentru programatorii începători, dezvoltând o foarte
mare simplitate în utilizare. Spre deosebire de Javascript, care este un limbaj de scripting,
PHP este un interpretor pe partea de server. Pentru a putea folosi această tehnologie avem
nevoie de un server web (Apache) și de instalarea pachetului PHP.
Acest tip de funcționalitate o putem observa foarte bine atunci când se încearcă
conectarea bazei de date efectuata în limbajul MySql prin interfața phpMyAdmin cu
limbajul HTML. Spre exemplu, în proiectul meu am realizat baza de date în
phpMyAdmin, iar după aceea cu ajutorul limbajului PHP am efectuat legătura dintre
aceasta și pagina we b unde vreau să mi se afișeze datele stocate în baza mea de date.
Spre exemplu, o formă generală a codului PHP arată în felul următor :
<?php
echo “Primul meu script PHP”;
?>
9
1.3. Componente dinamice în realizarea paginilor Web
Paginile Web dinamice se folosesc atunci când se dorește modificarea
dinami că, a conținutului paginilor . Paginile Web realizate în HTML sunt statice,
conținutul lor neputând fi schimbat odată ce au fost uploadate pe un server decât
aducându -le înapoi pentru a fi editate. Această op erațiune este foarte costisitoare, iar în
plus, lucrul cu baze de date nu este posibil în paginile statice.
Paginile dinamice își adaptează conținutul și/sau aspectul general î n funcție de
utilizatorul final sau modificările mediului informatic (modificări de utilizator, timp, bază
de date, etc). Conținutul poate fi schimbat de către client (prin calculatorul utilizatorului)
folosind limbaje script pentru client (JavaScript, JScript, Actionscript, plugin pentru
player media și cititoare PDF, etc) pentru a a ltera elementele DOM (DHTML). Conținutul
dinamic este adesea compilat pe server folosind limbaje script pentru servere (PHP, ASP,
Perl, Coldfusion, JSP, Python, etc). Amândouă modalități de abordare se folosesc în
aplicațiile complexe.
1.3.1. Realizarea de pagini Web statice
Site-urile Web se pot caracteriza după foarte mulți indicatori, dar cel mai
important indicator este subiectul de activitate (conținutul) site -ului. Tehnologic, site -ul
este alcătuit din tipuri de date și informații statice, produse și servicii, anunțuri, formulare
online, clipuri video, imagini statice, efecte dinamice și multe altele. Subiectul site -ului
Web diferă în funcție de ideea utilizatorul, spre exemplu: blog -uri, portalu ri Web, ziare
Web și aproape orice altceva.
Paginile statice nu schimbă conținutul și aranjarea generală la fiecare vizită atâta
timp cât nu intervine webmasterul sau programatorul pentru a le actualiza.
De asemenea paginile statice pot reprezenta documente HTML stocate ca și fișiere
în sistem și sunt dispo nibile în cadrul serverului HTTP (URL -urile care au terminația
“html” nu sunt întotdeaun a statice).
Totodată, intep retarea acestor termeni pot incl ude și paginile web stocate în b aza
de date și pot include pagini formatate incluzând template -uri și folosi te prin aplicația
server atâta timp cât pagina folosită nu poate fi schimbat ă și prezent ată în mod esențial .
10
Paginile sta tice sunt accesibile pentru conț inuturile care niciodată sau rareori au
nevoie să fie actualizate. Menținând un număr mare al pagi nilor statice ca fișiere poate fi
de nepracticat fără uneltele necesare, cum ar fi Static site generators care este descris în
sistemul template -ului Web . Orice personalizare sau inter activitate trebuie să ruleze tip-
client , fiind restrictivă.
Paginile We b statice sunt alcătuite din documente speciale, alcăuite la rândul lor
din text și limbaje de marcare. Pagina stocată în browser este de cele mai multe ori un
document hyper text marking language , afișată exact în forma concepută. Serverul are
rolul de a furniza pagina respectivă, fără ca aceasta să sufere schimbări. Acest gen de
pagini su nt create de obicei în F lash sau în HTML, neputând fi modificată fără intervenția
unui programator sau webmaster.
Site-ul static este definit printr -un număr limitat d e pagini și un format fix al
acestora. Fiecare pagină reprezintă un document separat, singura modalitate de a modifica
site-ul static este de a accesa separat paginile și să fie editat codul HTML.
Principalele caracteristici ale paginilor Web sunt:
Conțin numai elemente HTML
Codul sursă din browser este asemănător cu cel al fișierului st ocat
Nu oferă interactivitate
Avantajele folosirii unu i site static sunt următoarele:
Este potrivit companiilor mici
Configurarea se face foarte rapid
Costul acestui site e ste mai mic comparativ cu cel dinamic
Pe de altă parte, dezavantajele folosirii acestui tip de site constă în:
Nu poate fi actualizat de către utilizator
Costurile întreținerii unui astfel de site sunt foarte mari
Nu pot fi integrate forumuri, magazine online sau rețele de socializare
Persoanele care actualizează site -ul au nevoie de pregătire specială
În concluzie, paginile Web realizate în HTML au dezavantajul că sunt statice,
conținutul lor neputând fi modificat odată ce au fost încărcate pe un serve r decât
aducându -le înapoi pentru a fi editate. Pe de altă parte website -urile statice sunt procesate
mai repede pentru că nu solicită serverului alte operațiuni în afară de livrarea către
vizitatori a conținutului deja încărcat în fișiere.
11
1.3.2 . Realiza rea de pagini Web dinamice
Paginile Web dinamice sunt folosite când se dorește modificarea dinamică a
conținutului Web. Aceste tipuri de site -uri sunt mult mai flexibile și mai ușor de gestionat.
Configu rarea acestora este mai complexă deoarece se utilize ază limbajul de programare
PHP, însă odată configurat este mult mai ușor de modificat. Folosind CMS -ul (Content
Management System), conținutul site -ului poate fi modificat, actualizat, se pot crea noi
pagini, iar conținutul ales de către utilizator poate f i șters. Modificările se realizează rapid,
nu necesită cunoștințe de programare și se pot desfășura chiar și când un vizitator
accesează pagina respectivă.
Acest gen de pagini Web se caracterizează prin conținutul lor dinamic și poat e
diferi la mai multe accesări. D e exemplu la același URL conținutul paginii poate varia în
funcție de diferiți parametrii, spre exemplu locația geografică a utilizatorului, ora sau
paginile vizitate anterior .
Un site dinamic poate fi condus de către un utilizator printr -o inte rfață de
administrare, însă acel utilizator va trebui să aibă cunoștințe ale browserului Web
respectiv.
Prin intermediul acestui proces se pot efectua mai multe operațiuni de adăugare
sau modificare conținut (texte, imagini, mul timedia), de schimbare a la yout-ului, de
modelare a diferitelo r acțiuni din respectivul site ( validarea comentariilor, a site -urilor
introduse într -un director Web), de administrare a newsletter -ului (creare, editare
newsletter, trimiterea pe categorii de useri), cât și alte acțiuni în funcție de natura si te-ului
și de complexitatea lui.
Acest gen de site oferă utilizatoru lui o serie de avantaje precum:
Control deplin asupra site -ului
Posibilitatea de implementare a unui magazin online în interiorul site -ului
Diminuează cantitatea d e cod, generându -se tipuri diferite în funcție de situații
Pe de altă parte, dezavantajele utilizării unui site dinamic sunt:
Configurarea unui site dinamic necesită o perioadă mai lungă de timp
Costul inițial este mai ridicat
12
Actualizarea acesto r genur i de site -uri este foarte importantă deoarece la
proiectarea și implementarea acestor elemente trebuie luat e în considerare mai multe
aspecte, printre care modul în care vor fi actualizate datele și costurile operațiunilor de
actualizare periodică.
Pe de altă parte, comunicarea cu clienții este vitală pentru că această comunicare
se realizează prin site -ul respectiv, presupunând inserarea de formulare de e -mail pe
paginile site -ului. De asemenea, se poate folosi un autoreponder prin care se va trimite
automat către vizitator mesajul de răspuns și de asemenea mulțumindu -i pentru vizită.
În concluzie, trebuie cunoscut faptul că website -urile dinamice sunt consumatoare
mari de resurse din partea serverului, dar sunt mai accesibile în vederea conținutului.
Pentru a fi dinamic un site trebuie să ruleze un limbaj de programare bazat pe script -uri,
categoria numindu -se “Server -Side Scripting Language” care permite generarea dinamică
a conținutului afișat în funcție de solicitarea fiecărui vizitator în parte. În gen eral, orice
CMS instalat pe server, spre exemplu WordPress, Joomla, Drupal și multe altele va
genera un website dinamic. Acest tip de software folosește script -uri pentru a face
legătur a cu baza de date din care se vor extrage informațiile necesare alcătu irii site -ului.
În plus, pagina dinamică oferă posibilități de interacțiune în funcție de caracterul dinamic :
pagini dinamice pe partea de client și pagini dinamice pe partea de server.
1.3.3 . Componente dinamice în componenta client a paginilor Web
Sunt mai multe moduri prin care se permite realizarea paginilor dinamice pe partea
de client. Printre acestea se numără: scripturi pe partea de client (client side scripts),
DHTML (Dynamic HTML), Applet -uri Java, secvențe de program incluse în pagină care
se execută de către browser.
Applet -uri Java reprezintă aplicații de mici dimensiuni, scrise în limbajul Java.
Codul aplicației este descărcat pe mașina client de pe server binar și executat local în Java
(JVM). Aproape toate calculatoarele permit execuția app let-urilor, însă pentru
funcționarea acestora este necesară instalarea unei mașini virtuale Java. În cadrul paginii
HTML applet -urile sunt incluse prin marcatorii <APPLET> sau <OBJECT>. Din applet –
urile Java este interzis accesul la sistemul local de fiși ere și la rețea, astfel riscul ca aceste
aplicații să conțină cod greoi sunt reduse. Controalele ActiveX sunt componente binare
incluse în paginile Web pentru a oferi interactivitate.
13
Sunt asemănătoare applet -urilor, însă spre deosebire de acestea rulează pe
platforma Windows și au fost introduse în special pentru Internet Explorer.
Controalele ActiveX sunt incluse în pagina Web print intermediul marcatorului
<OBJECT>. În cazul în care o pagină conține controale ActiveX, printr -o fereastră de
dialog brows erul cere confirmarea utilizatorului pentru instalarea și rularea acestora.
Elemente multimedia sunt folosite în special prin produsul Macromedia Flash.
Acestea se prezintă sub forma de fișiere SWF multimedia și sunt incluse în pagina Web
prin intermediul marcatorului <OBJECT>. Pentru a le putea rula pe partea de client este
necesară instalarea unui plug -in denumit Macromedia Shockwave Player.
Secvențele de progam sunt definite prin marcatorul <SCRIPT>. Limbajele
folosite pentru a crea scripturi pe parte a de client sunt JavaScript, Jscript și VBScript , însă
aceste scripturi nu oferă acces la fișiere sistemului local. Aceste scripturi sunt folosite în
special pentru meniuri, validarea formularelor, pentru crearea diferitelor efecte și calcule,
elemnte de a nimație etc.
DHTML (Dynamic HTML) este o tehnologie dezvoltată de Microsoft care
combină HTML, foi de stiluri (CSS) și script -uri pentr u a realiza pagini Web dinamice.
De asemenea, această tehnologie este dedicată utilizatorilor să interacționeze cu pagina
fără a retri mite o cerere la serverul Web.
În perioada de început a aplicațiilor client -server, fiecare aplicație avea propriul
său program client care servea ca interfață utilizator și trebuia să fie instalat separat pe
fiecare calculator personal al ut ilizatorului. O actualizare pe server a aplicației necesita o
actualizare a fiecărei aplicații client instalate, adăugând costuri suplimentare și scăzând
productivitatea.
Pe de altă parte , aplicațiile web folosesc documente web scrise în formate standard
precum HTML, XHTML care sunt suportate de o varietate de browsere web.
În general, în orice aplicație individuală este livrată clientului ca document static,
dar secvența paginilor poate oferi o experiență interactivă, întrucât intrarea utilizatorului
este returnată prin elementele de formulare web incluse în marcarea paginii. În timpul
sesiunii, browserul web interpretează și afișează paginile și acționează ca și client
universal pentru oricare aplicație web.
În 1955, Netscape a introdus un scripting clie nt denumit JavaScript, care permitea
programatorilor să adauge elemente dinamice interfeței utilizatorului care rula pe partea
clientului. Până atunci, toate celelalte trebuiau trimise spre server pentru procesare, iar
rezultatele erau livrate prin pagini HTML statice trimise înapoi clientului.
14
Conformitatea diferitelor browsere cu standarde W3C presupune o acceptare pe
scară largă a XHTML și HTML împreună cu Cascading Style Sheets (CSS) pentru a
poziționa și manipula elementele paginilor web. Ultimele sta ndarde și propuneri încearcă
să lase la latitudinea diferitelor browsere modul de livrare a marii varietăți de elemente
media și opțiuni de accesare pentru client fără a mai fi nevoie de plugin -uri.
Fișierele multimedia Flash se realizează sub forma unor filme, videoclipuri
proiectate . Acestea oferă diverse efecte multimedia și permit interactivitatea cu
utilizatorul. Sunt utilizate pentru meniuri, jocuri, filme de animație etc. Ele permit ș i
programare prin intermediul limbajului Action Script.
Internetul este o mare colecție de computere și servere client interconectate.
Hypertext Transfer Protocol (HTTP) facilitează co municarea și transferul de date. În
cazul în care conținutul solicitat de computerul client este disponibil, componentele site –
ului sunt trimise browserului web în format HTML prin HTTP, iar apoi browserul web
recreează site -ul web pe computerul client și îl afișează.
1.3.4. Componente dinamice în componenta server a paginilor Web
Interpretorul de scripturi tip server -side are rolul de a executa scripturi la cererea
serverului de Web, de cele mai multe ori de a prelua rezultatul unor interogări la nivelul
bazelo r de date și de a trimite spre serverul Web rezul tatul execuției scripturilor sub forma
de conținut HTML pentru a putea fi afișat de către navigator. În momentul în care
serverului Web i se solicită rularea unui script, acesta identifică în funcție de extensia
fișierului care din compilatoare trebuie să ruleze scriptul respectiv .
Fiecărui interpetor de scripturi se asociază unui lim baj de serverside scripting.
Limbajele populare ale momentului sun t: PHP (Personal Home Pages), ASP (Active
Server Pages), ASP.NET și JSP (Java Server Pages).
Tehnologia Active Server Pages (ASP) dezvoltată de Microsoft permite realizarea
de scripturi pentru server și este folosită pentru crearea și rularea în mod dinamic a
aplicațiilor Web server interactive. Cu ASP se pot combina pagini HTML, comenzi de
script și controale ActiveX pentru crearea de pagini Web interactive sau aplicații Web
complexe. Când serverul primește o cerere pentru un fișier ASP, prelucrează scriptul
conținut în fișier pentru a construi pagina de Web care este trimisă apoi la navigator.
15
ASP oferă totodată posibilitatea de a stoca informația dintr -un formular HTML
într-o bază de date, de a personaliza site -uri Web, oferind diverse opțiuni pentru vizitatorii
site-ului sau de a folosi diferite caracteristici HTML bazate pe navigator.
ASP e ste proiectat independent de limbaj, deci se poate utiliza orice limbaj pentru
care există instalat un compilator compatibil COM. ASP are înglobate limbajele
VBSscript și JScript., dar se pot instala și compilatoare pentru limbajele Perl, Rexx sau
Python. Totodată, ASP oferă o cale flexibilă pentru a crea pagini Web și de a dezvolta
aplicații Web într -un limbaj de programare ca Visual Basic, C++ sau Java. Se poate
include și o siglă a aplicației în module care vor fi apelate și executate de către alte
componente sau programe. Un fișier ASP este un fișier text cu extensia . asp, ce conține
orice combinație a următoarelor elemente: text, marcatori HTML, comenzi de script ASP .
Dacă se dorește adăugarea unor scripturi la o pagină HTML, mai întâi va trebui să
se redenumească fișierul, atribuindu -i extensia .asp. Pentru a -l face accesibil utilizatorilor
Web, este necesară activarea permisiunii de script sau de execuție pentru directorul unde
se află fișierul respectiv.
Caracteristicile generale ale paginilor Web d inamice generate pe partea de server,
indiferent de limbajul de scripting folosit sunt: necesită un procesor pentru paginile
dinamice sau un mediu de execuție într -o pagină de script (ASP, JSP, PHP), pot fi
îmbinate limbajul HTML și secvențe de cod secvenț ele de cod care sun t executate pe
partea de server înainte de a trimite pagina la client există astfel posibilitatea de a
particulariza paginile în mod dinamic , oferă posibilitatea de intera cțiune cu baze de date
diferite, au acces la toate resursele serve rului Web (fișiere, rețea). În mod uzual prin
intermediul scripturilor sunt prelucrare informațiile din câmpurile formularelor
(<FORM>) din cadrul paginilor Web .
Figura 1. Implementarea paginilor dinamice pe partea de server
16
Capitolul 2 . Unelte utiliz ate pentru crearea site -urilor Web
2.1. Utilizarea aplicației Notepad ++ pentru realizarea site -urilor Web
Notepad++ este un editor de text și un edit or de cod sursă folosit împreună cu
Windows Microsoft. Acest program suportă editarea multiplă, unde se p ermite să se
lucreze în aceeași fereastră cu mai multe fișiere deschise.
Acest editor de text este distribuit ca un software gratuit, la început fiind găsit pe
SourceForge.net, unde a fost descărcat de peste 28 de milioane de ori. Notepad ++ a fost
creat d e către Don Ho în Septembrie 2003. Inițiatorul acestui software a folosit un editor
de text bazat pe Java la început, dar , dezamăgit de performanța scăzută, a început să
folosească un editor de text scris în C++ cu Scintilla. După cum a considerat autorul ,
această aplicație a fost construită ca una de tip Windows , fiind respinsă spre a fi portată
și pentru sistemele de operare Mac OS X și Unix.
Notepad ++ a fost lansat pentru prima oară pe SourceForge la 25 noiembrie 2003,
ca aplicație numai pentru Windows . Se bazează pe componenta editorului Scintilla și este
scrisă în C ++ numai cu apeluri API Win32 care utilizează numai STL pentru a crește
performanța și a reduce dimensiunea programului.
În ianuarie 2010, guvernul american a obligat gazdele softului din Statele Unite
ale Americii să -și refuze accesul de la Cuba, Iran, Coreea de Nord, Sudan și Siria pentru
a se con forma legislației din S.U.A. Ca răspuns , Notepad ++ a creat o ve rsiune pe
TuxFamily, în Franța, deoarece s -a dovedit a fi o încălcare a filozofi ei software -ului liber
și a sursei deschise (FOSS), în iunie 2010, Notepad ++ s -a mutându -se în afara jurisdicției
teritoriale americane, eliberând și tracker -ul de erori) după care au rămas pe Sourceforge
până în 2015, când Notepad ++ a lăsat complet Sour ceforge.
În 2011, Lifehacker a descris Notepad ++ drept "Cel mai bun e ditor de text pentru
Windows", afirmând că "dacă preferați un editor de programare simplu, ușor și extensibil
de programare, prima noastră ale gere este Notepad ++ gratuit."
În 2014, cit itorii Lifehacker au votat Notepad ++ ca "Editorul cel mai popular de
text", în timp ce 40% dintre cei 16.294 de respondenți l -au specificat d rept cel mai iubit
editor. Echipa Lifehacker a rezumat programul ca fiind "rapid, flexibil, plin de
caracteristici și complet gratuit" .
17
Notepad ++ este un editor de cod sursă. Dispune de evidențierea sintaxelor, de
plierea codurilor și de completarea automată limitată pentru limbile de programare,
scripting și markup, dar nu completarea codului inteligent sau verifi carea sintaxei. Ca
atare, este posibil să evidențieze în mod corespunzător codul scris într -o schemă
accepta tă, dar dacă sintaxa internă este solidă sau compilabilă, nu poate fi verificată. Lista
de limbi afișează, de asemenea, două elemente speciale pentr u text simplu obișnuit: "Text
normal" (implicit) sau "Stil MS -DOS", care încearcă să imite editorii de text din DOS.
Notepad ++ are caracteristici pentru a consuma și a crea fișiere de text simplu de
tip cross -platform. Recunoaște trei reprezentări noi (CR , CR + LF și LF). În plus, acceptă
reinterpretarea fișierelor de text simplu în diverse codări de caractere și le poate converti
în ASCII, UTF -8 sau UCS -2. Ca atare, poate rezolva un text simplu care pare sănătos
numai pentru că acea codare a caracterului nu este detectată corespunzător.
Notepad ++ are, de asemenea, caracteristici care îmbunătățesc experiența de
editare a textului simplu, în general, cum ar fi: salvare a automată , găsirea și înlocuirea
șirurilor de text cu expresii regulate , indentarea ghid ată, marcajul liniei , macrocomenzi ,
editare simultană , editare ecran separat și derulare sincronizată , operațiuni liniare,
inclusiv sortarea, conversia casetelor (majuscule, litere mici, cămăși, caz de frază) și
eliminarea spațiilor libere redundante , tabela de interfață pentru documente .
Ca și alți editori de coduri, Notepad ++ este un proiect open source. Utilizatorii
pot contribui în mai multe feluri:
Trimiterea de rapoarte de erori și cereri de caracteristici
Manipularea în reparații și corecții
Iniție rea asistenței online
Traducerea editorul
Distribuirea pluginurilor, temelor și fișierelor de completare automată
În consecință, editorul este complet gratuit . În plus, în timp ce programul este creat
pentru Windows (unde înlocuiește Notepad -ul standard) , acesta poate rula și pe Linux,
Unix și poate fi portat pentru MacOS X.
Ca și beneficii ale utilizării acestui editor de cod trebuie menționat aspectul
standard și solid al caracteristicilor, în ideea în care Notepad ++ are aceste caracteristici
standard, c are suportă mai mult de 50 de limbi de programare, scripting și markup .
18
Împreună cu auto -completarea pentru cuvinte, funcții și parametri de funcții,
precum și indentarea auto mată și evidențierea bretelelor, Notepad ++ face tot ce poate
pentru a face c odifi carea mai rapidă și mai ușoară.
Apoi, există funcția de căutare și înlocuire cu multe opțiuni diferite și posibilitatea
de a căuta în mai multe documente. Sunt incluse și operațiile de linie cum ar fi împărțirea,
alăturarea, sortarea și mutarea. Ce se observă imediat când intri în program este linia
butoane de acțiun e din partea de sus. Aici se găsesc o mulțime de operații standard cum
ar fi crearea unui document nou, închiderea tuturor ferestrelor, copierea și lipirea,
anularea / refacerea, mărirea / micșorarea și mai mult. În timp ce alți editori de coduri trag
pentru minimalism, Notepad ++ oferă cât mai multă funcționalitate posibil într -un singur
ecran.
Interfața Notepad ++ este reglabilă în multe moduri diferite. Pentru unul, puteți
controla dacă f ilele se aliniază vertical, orizontal și / sau în spatele celuilalt. Se poate lucra
cu un ecran separat cu mai multe fișiere și cu modul ecran complet
Adăugarea dosarelor de proiecte se realizează prin File> Open Folder as
Workspace. După aceasta, se pot deschide fișierele conținute în dosar cu un dublu clic
pentru a începe să le editați. Ele se vor deschide automat în file noi .
În plus, editorul vine cu 20 de teme pe care le puteți activa în Setări> Configurator
de stil. Ce trebuie menționat ar fi faptul că temele modific ă doar partea în care se codifică ,
în timp ce restul interfeței utile este neatins. Cu toate acestea, în același loc ca și temele
se găsesc opțiuni pentru a controla culoarea de fundal și prim -plan, fonturile, stilurile de
fonturi și mult e altele pentru a crea propria temă. Lucrul nebun este că se pot efectua nu
numai schimbări globale, ci se poate controla aceste lu cruri pe fiecare limbă.
În plus, dacă se dorește, se poate adapta stilul la nevoile utilizatorului pentru
fiecar e limbaj de programare separat.
Una dintre caracteristicile Notepad -ului ++ este abilitatea de a utiliza mai mulți
cursori pentru a face schimbări de cod în mai multe locuri simultan. În acest program
funcționalitatea este ascunsă în meniul de preferințe (Setări> Pre ferințe> Editare și apoi
trebuie să se bifeze Activare în Setări de editare multiplă).
19
2.4. Utilizarea limbajului SQL pentru realizarea site -urilor Web
Termenul de SQL provine de la traducerea în limba engleză și anume Structured
Query Language. Acest a este un limbaj de programare special folosit pentru manipularea
bazelor de date relaționale (RDBMS) . Acesta are ca scop introducerea datelor, folosirea
interogării datelor, actualizarea, ștererea, editarea datelor aflate în baza de date cât și
controlul accesului la baza de date respectivă. Este cel mai popular limbaj utilizat în ceea
ce privesc sistemele de gestiune a bazelor de date (SGBD) relaționale.
Ca o prezentare a unui scurt istoric, limbajul SQL a fost dezvoltat de către
compania IBM în anul 1974, iar ulterior la finalul anilor ’70 compania Relational
Software, Inc., în prezent Oracle Corporation a văzut potențialul acestui limbaj și și -a
dezvoltat propriul SQL. Duupă implementarea în anul 1979 a primei variante comerciale
de SQL de către Orac le, cei de la IBM au apărut și ei cu propriile variante pe piață.
Am definit mai jos cele mai importante funcționalități ale limbajului:
Se pot executa interogări împotriva bazei de date
Se pot recupera date din cadrul bazei de date
Se pot insera, actualiz a și șterge date din baza de date
Se pot crea mai multe baze de date și tabele
Se pot crea proceduri stocate în baza de date
Se pot seta permisiuni pentru a vizualiza anumite tabele sau proceduri
Limbajul SQL este divizat în mai multe elemente unde se reg ăsesc:
1. Clauzele , care sunt componente ale instrucțiunilor și ale interogărilor. La
fel ca o propoziție, o instrucțiune SQL are clauze. Fiecare clauză
efectuează o funcție pentru instrucțiunea SQL. Mai jos le -am definit pe
cele mai importante.
SELECT – listează câmpurile care conțin date de interes
FROM – listează tabelele care conțin câmpurile listate în SELECT
WHERE – criteriile de câmp ce trebuie îndeplinite de fiecare
înregistrare pentru ca aceasta să fie inclusă în rezultate.
ORDER BY – Specifică mod alitatea de sortare a rezultatelor
GROUP BY – într-o instrucțiune SQL care conține funcții agregate,
listează câmpurile care nu sunt rezumate în clauza SELECT.
HAVING – definește condițiile de la SELECT
20
2. Instrucțiuni le, care sunt formate din cuvinte rezerva te și cuvinte definite
de utilizator. Acestea sunt clasificate la rândul lor din mai multe puncte de
vedere:
A. Instrucțiuni de definire a datelor – permit descrierea structurii
bazei de date. Spre exemplu:
CREATE DATABASE nume_bd
B. Instrucțiuni pentru selecți a datelor – cuvântul cheie este SELECT
SELECT [domeniu] listă_selecție
C. Instrucțiuni pentru manipularea datelor – implementarea acestora
se face prin interogările de acțiune. Cele mai importante sunt:
CREATE,INSERT, UPDATE și DELETE
INSERT INTO nume_tabel ( câmp1, câmp2…)
VALUES (valoare1, valoare2…);
3. Termenii SQL – fiecare clauză este formată din termeni comparabile cu
părțile de vorbire. Spre exemplu:
Identificator – Un nume pe care îl utilizați pentru a identifica un
obiect din baza de date, cum ar fi un nume de câmp .
Operator – Un cuvânt cheie care reprezintă o acțiune sau care
modifică o acțiune.
Constantă – o valoare care nu se modifică, precum un număr sau
o valoare NULL
Expresie – O combinație de identificatori, operatori, constante și
funcții car e se evaluează la o singură valoar e
Cele mai importante comenzi pe care limbajul SQL le folosește sunt:
SELECT Selectează înregistrări din BD
UPDATE Actualizează datele din BD
DELETE Șterge date din BD
INSERT INTO Inserează o nouă înregistrare în BD
CREATE DATABASE Creează o nouă bază de date
ALTER DATABASE Modifică o bază de date
CREATE TABLE Creează un nou tabel
ALTER TABLE Modifică un tabel
DROP TABLE Șterge un tabel
CREATE INDEX Creează un index
DROP INDEX Șterge un index
21
2.2. Utilizarea MyS QL pentru realizarea site -urilor Web
MySql este un sistem de gestiune a bazelor de date relațional, produs de compania
suedeză MySQL AB și distribuit sub Licența Publică Generală GNU. Este cel mai popular
SGBD open -source la ora actuală. Deși este folosit foarte des împreuna cu limbajul de
programare PHP, cu MySQL se pot construi aplicații în orice limbaj major.
Există multe scheme API disponibile pentru MySQL ce permit scrierea
aplicațiilor în numeroase limbaje de porgramare pentru accesarea bazelor de da te
MySQL, cum ar fi: C, C++, C#, Java, Perl, PHP, Python, FreeBasic, fiecare dintre acestea
folosind un tip specific API. MySQL vine cu o interfață grafică destul de interactivă atât
pentru începători cât și pentru avansați numit phpMyAdmin.
Pentru a admin istra bazele de date MySQL se poate folosi modul linie de comandă
sau, prin descărcare de pe internet, o interfață grafică MySQL Administrator și MySQL
Query Browser. Un alt instrument de management al acestor baze de date este aplicația
gratuită, scrisă î n PHP, phpMyAdmin.
.Limbajul MySQL are multe funcții, dar printre cele mai importante se regăsesc:
Este un sistem de baze de date folosit în paginile web
Este un sistem de baze de date care rulează pe un server
Este ideal și pentru aplicațiile dezvol tate dar și pentru cele mai puțin
dezvoltate
Este foarte rapid, de încredere și ușor de folosit
MySQL folosește limbajul SQL standard
Limbaj de programare avansat care rulează pe un număr de platforme
Este gratuit pentru descărcare și utilizare
Este dezvol tat și distribuit de Oracle Corporation
Datele folosite în baza de date MySQL sunt stocate în tabele. Un tabel este definit
printr -o colecție de date și conține un anumit număr de coloane și de rânduri. Bazele de
date sunt folositoare pentru a stoca infor mația pe categorii .
22
Capitolul 3. Proiectarea site -ului Web
3.1 Descrierea aplicației
Scopul acestei aplicații este acela de a gestiona activitatea unei companii din
domeniul IT care vinde produse , iar aici mă refer că, spre deosebire de alte aplicați i, se
pot modifca datele din baza de date realizată în phpMyAdmin direct din cadrul aplicației.
Avantajul acestei aplicații este ace la că se poate diferenția modul de vizualizare din 2
perspective diferite și anume: perspectiva clientului, care se poate în registra, poate
vizualiza produsele și care își poate seta anumite comenzi, cât și perspectiva
administratorului de aplicație, unde spre deosebire de funcțiile pe care clientul le poate
efectua, acesta poate adăuga, modifica sau șterge datele din baza de d ate.
Pentru modificarea datelor din cadrul aplicației am folosit mai multe tehnologii
care m -au ajutat în acest sens, iar aici am încercat să scot în evidență folosirea limbajului
PHP și a sistemului de gestiune a bazelor de date MySQL.
În ceea ce priv ește designul aplicației am vrut ca aceasta să aibă o interfață
“prietenoasă ”, cu un meniu care permite accesarea rapidă a produselor și cu împarțirea
acestora pe categorii și pe subcategorii. În plus, aplicația deține un motor rapid de căutare,
cât și inf ormații despre fiecare produs în parte și totodată paginile de înregistrare și de
logare sunt foarte ușor de completat ceea ce face ca utilizatorul să se logheze rapid în
cazul în care acesta dorește să efectueze o comandă spre exemplu. Clientul are
posibi litatea de a -și vedea coșul de cumpărături în care au fost adăugate produsele alese
de acesta, cât și valoarea totală a cumpărăturilor, iar pentru deconectarea din modul de
utilizator acesta poate accesa butonul de deconectare din cadrul men iului, buton af lat
lângă numele celui logat.
Diferența se poate observa la logarea administratorului aplicației. În primul rând,
la încercarea de logare a administratorului se verifică în baza de date dacă datele introduse
sunt corecte. Din acel moment, administratorul deține anumite privilegii și are acces la
anumite funcții speciale din cadrul aplicației. Cu ajut orul unui anumit panou de
administrare prin care se evdențiază mai multe funcții, acesta reușește gestionarea
aplicației direct din cadrul acesteia.
23
3.2. Proiectarea bazei de date
Baza de date reprezintă o unealtă cu ajutorul căreia se realizează organizarea și
stocarea informațiilor. Cu ajutorul acesteia putem stoca o cantitate mai mare de informații
regăsindu -le în mod eficient în cadrul acesteia.
Spre exemplu, p entru proiectarea acestei baze de date, am folosit mai multe tabele,
iar exemplificarea legăturilor între acestea sunt prezentate în figura de mai jos , tipul de
legătură prezentă fiind de unu -la-mai-mulți.
Figura 2 . Proiectarea relațiilor într e tabele
Tabela Categorie cuprinde informații despre id-ul categoriei de produs , numele,
cât și imaginea asociată acesteia. Cheia primară este reprezentată de id_categorie , câmp
care apare și în tabela Subcategorie tocmai pentru a se putea efectua legătura între acestea
(legătură de tip unu -la-mai-mulți).
Tabela Subcategorie exemplifică o formă de filtrare prin care se afișează
produsele pe mai multe tipuri. La fel ca în tabela anterioară, aceasta prezintă doar 3
câmpuri, din care doar unul este cheie prima ră și anume id_subcategorie .
Tabela Produse prezintă exact carcacteristicile de prezentare a unui produs, iar
aici mă refer la lucrurile care îl definesc: denumirea produsului, specificațiile acestuia,
prețul, dar și din ce categorie respectiv subcategori e face parte.
Tabela Coș_cumpărături cuprinde exact câmpurile de care este nevoie pentru ca
utilizatorul să plaseze comanda în pașii următori. În consecință este nevoie de un utilizator
pentru a plasa produse în coș și pentru a valida comanda.
24
Tabela Conținut_coș identifică produsul sau produsele adăugate în coșul de
cumpărături, cât și cantitatea selectată pe fiecare produs.
Tabela Comandă cuprinde următoarele date: data și ora comenzii, adresa livrării,
metoda de plată a comenzii, statusul acesteia cât și totalul de plată.
Tabela Utilizatori este formată din toate datele de identificare, unele dintre acestea
fiind solicitate la pasul de înregistrare. Id_utilizator reprezintă cheia primară și în plus
față de elementele de îmregistrare, se pot observa câ mpurile avatar și rol. Primul câmp
se referă la imaginea personalizată pe care fiecare dintre utilizatori o va avea, iar câmpul
rol se referă la calitatea de client sau de administrator.
Odată cu proiectarea relațiilor între diferitele tabele aflate în b aza mea de date în
modelul Acces , am încercat să implementez această proiectare și în aplicația
phpMyAdmin. Structura bazei de date se poate observa în figura de mai jos.
Figura 2.1 . Structura bazei de date în phpMyAdmin
Odată cu crearea tabelelor, cu câmpurile specifice și cu legăturile stabilite între
acestea am realizat conexiunea dintre baza de date și aplicația web.
Figura 2.2 . Conexiunea la baza de date
25
3.2. Structura modulului de utilizator
3.2.1. Pagina de Homepage
La accesarea primei pagini a site -ului putem vizualiza în secțiunea de header logo –
ul companiei . Tot în secțiunea respectivă putem distinge bara de căutare a produselor
unde utilizatorul poate găsi mai ușor produsele de care are nevoie cât și a butoanelor de
conectare și de înregistrare.
După conectare, butoanele sunt înlocuite de secțiunea utilizatorului și de un buton
pentru coșul de cumpărături. Prin secțiunea utilizatorului se poate accesa pagina
profilului, istoricul comenzilor și se poate realiza deconectarea.
În cazu l în care utilizatorul are rolul de administrator va putea accesa panoul de
administrare.
Figura 3. Pagina de homepage
În partea din stânga a paginii există bara laterală unde se poate efectua accesarea
categoriilor de produse , iar în partea din mijlo c putem vedea anumite promoții și reclame.
Totodată, accesarea categoriilor de produse se poate efectua și prin taburile specifice unde
putem deosebi o imagine de fundal aferentă fiecărei categorii în parte.
26
3.2.2. Pagina de înregistrare
Prin înregis trarea unui nou cont, utilizatorul va putea avea acces la toate
funcționalitățile site -ului unde poate adăuga produse în coșul de cumpărături și își poate
plasa propriile comenzi.
Figura 3.1. Pagina de înregistrare
O înregistrare simplă reprezintă pract ic modalitatea prin care se creează un nou
cont pe site -ul companiei. Numele, prenumele, adresa de mail și setarea unei parole sunt
singurele date solicitate și tocmai de accea, după ce informațiile respective sunt introduse
și verificate de către sistem, se va trece automat către pagina de autentificare pentru a se
realiza logarea.
În cazul în care utilizatorul are deja cont, acestuia i se oferă posibilitatea să treacă
la pagina de conectare prin simpla accesare a linkului de la sfârșitul formularului.
27
3.2.3. Pagina de conectare
Conectarea utilizatorului deja înregistrat în baza de date se va efectua cu adresa
de mail și cu ajutorul parolei setate la pasul de înregistrare. Aplicația va căuta în baza de
date adresa de mail și parola setate pent ru a verifica dacă respectivul utilizator și -a
înregistrat în mod corect datele.
În cazul în care informațiile respective nu sunt corect introduse, aplicația va
întoarce un mesaj de eroare.
Figura 3.2. Prezentarea paginii de conectare
Pagina unde se va efectua logarea utilizatorului se începe cu un mesaj de bun venit
și cu solicitarea informațiilor pentru logare. De asemenea, în cazul în care utilizatorul nu
deține încă un cont, acesta este invitat pentru a se înregistra printr -un link care face
legătur a cu pagina de înregistrare.
28
3.2.4. Pagina cu toate produse le
Pagina cu toate produse le poate fi accesat ă prin butonului “Toate produsele ” din
pagina de Homepage în care se vor prezenta în mod aleator toate produsele disponi bile.
În dreptul fiecărui produs va fi afișat ă o imagine cu produsul, numele acestuia și prețul
respectivului produs.
Figura 3.3. Prezentarea paginii cu toate produsel e
Totodată, aferent fiecărui produs în parte e ste disponbil butonul “Adaug ă în coș ”
prin care clientul își poate adăuga ce produs dorește în coșul de cumpărături. Din
momentul în care produsul este adăugat în coșul de cumpărături, clientul poate plasa o
comandă cu produsele respective
29
3.2.5. Pagina unei categorii de produse
În pagina unei categorii sunt prezent ate produsele aferente acelei categorii,
împreună cu imaginile, detaliile și prețul acestora.
După ce clientul vizualizează și eventual alege să in troducă în coș produsele alese
de acesta, are posbilitatea de a se întoarce înapoi pe pagina principală, ulterior de a vedea
toate produsele sau să vizualizeze altă categorie.
Figura 3.4. Prezentarea paginii unei categorii de produse
30
3.2.6. Pagina unei subcategorii de produse
Pagina unei subcategor ii de produse va putea fi aleasă doar atunci c ând utilizatorul
se va afla pe pagina unei categorii. Astfel utilizatorul poate filtra mai ușor produsele pe
care le caută.
Figura 3.5. Preze ntarea paginii unei subcategorii de produse
3.2.7. Pagina produsului
Pagina unui produs afisează mai multe detalii despre produs. În aceasta veți regăsi
următoarele in formații : numele, imaginea produsului, prețul acestuia, o scurtă descriere
și butonul “Adaug ă în coș ”.
Figura 3.6. Prezentarea paginii unui produs
31
3.2.8. Coșul de cumpărături
În coșul de cumpărături vom regăsi toate produsele adăugate de client, detalii
despre acestea și suma totală a comenzii . Mai jos clientul poate introduce date pentru
finalizarea comenzii.
Figura 3.7. Prezentarea paginii coșului de cumpărături
3.2.9. Profilul meu
În momentul în care clientul își va accesa pagina de profil, acesta își poate vedea
și edita datele cu care s -a înregistrat în sistem, avatarul, cât și datele de contact.
Figura 3.8. Prezentarea paginii de profil
32
3.2.10. Comenzile mele
După finalizare a unei comenzi , clientul poate acesa istoricul comenzilor sale pe
pagina Comenzile m ele. Aici vom gasi toate detaliile de spre comenzile trecute.
Figura 3.9. Prezentarea paginii Comenzile mel e
3.2.11. Pagina unei comenzi
În această pagin ă clientul poate vedea toate detaliile legate de o comandă: numărul
comenzii, data creeri acesteia, prețul total, statusul comenzii , cât și o listă cu produs ele
plasate.
Figura 3.10. Prezentarea paginii unei anumite comenzi
33
3.3. Structura modulului de administrator
3.3.1. Panoul de administrare
Prin intermediul panoului de administrare se pot efectua modificări î n cadrul bazei
de date. Spre exemplu, atunci când se dorește adăugarea unui nou client se accesează
tabul de utilizatori și se adaugă manual un nou client. După salvarea cu succes a noii
înregistrări, putem observa că modificarea apare și în cadrul bazei d e date aflată în
phpmyAdmin .
Prin meniul din partea stâng a sau prin taburi le colorate, administratorul poate
accesa diferite sectiuni de administrare pin c are poate adauga, modifica și vizualiza datele
din baza de date .
Figura 4. Panoul de adminis trare
34
3.3.2. Administrarea utilizatori lor
În cadrul acest ei secțiuni putem vizualiza lista tuturor utilizatorilor înregistrați în
cadrul aplicației. Pentru fiecare utilizator există, conform bazei de date create, pe lângă
datele generale de identi ficare, un ID al fiecărui utilizator, un avatar personalizat cu
inițialele, o adresă de mail, un număr de telefon, cât și specificarea rolului pe care
respectivul îl deține (client/admin).
Totodată, în cazul în care vor exista foarte mulți utilizatori , prin bara de căutare
se poate găsi î n mod rapid un anumită persoană.
După căutare, d acă se dorește revenirea la formularul inițial în care sunt enumerați
toți clienții, pur și simplu se apasă pe butonul de resetare situat lângă bara de căutare, iar
toate perso anele vor fi afișate instant.
Figura 4.1. Administrarea itilizatori lor
35
Din cadrul acestei pagini de administrare se pot adăuga noi utilizatori prin butonul
“Adau gă uti lizator”. Prin accesarea acestui buton aplicația trim ite administratorul pe o
nouă pagină unde se vor introduce datele noului client .
După introducerea corectă a datelor, noul utilizator va fi creat și regăsit în
secțiunea principal ă cu toți utilizatorii și automat în baza de date.
Figura 4.2. Adăugarea unui nou utilizator
Administratorul poate efectua modificări în cadru l aplicației pe care o deține. Spre
exemplu, în acest caz administratorul poate edita informațiile unui un utili lizator .
36
Editarea unui anumit utilizator se face prin creionul din dreptul fiec ăruia. Atunci
când se execută instrucțiunea, aceasta generează o nouă pagină prin care se afișează
câmpurile utilizatorului și de unde putem schimba unul sau mai multe câmpuri.
Figur a 4.3. Editarea unui utilizator
Dacă se dorește ștergerea un anumit utilizator, apăsăm pe ico nița de ștergere . Va
fi afișat un dialog de confirmare de unde se poate valida ștergerea sau se poate închide
dialogul .
Figura 4.4. Ștergerea unui utilizator
37
3.3.3. Administrarea categorii lor
În această sectiune putem vizualiz a informații despr e categoriile produselor.
Fiecare cat egorie deține un ID, o denumire și o imagine.
Din câte putem observa și aici există aceeași bară rapidă de căutare, unde putem
filtra categoriile pentru a fi mai u șor de gasit.
Figura 5. Adninistrarea categorii lor
Din cadrul acest ei secțiuni putem ad ăuga, modifica și șt erge una sau mai multe
categorii .
38
Pagina de adăugare categorie oferă administratorulu i posibilitatea adăugării unei
unei noi categorii de produse . Singurele i nformații necesare sunt denumire categoie si
uploadarea unei imagini de categorie, vizibile pe pagina de Homepage.
Figura 5.1. Adăugarea unei noi categorii
Editarea unei categorii este asemănatoare secțiunei de utilizatori . Prin această
pagină administratorul poate edita denumirea categoriei sau imaginea acesteia.
Figura 5.2. Editarea unei categorii
39
În cazul în care administratorul dorește ștergerea unei anumite categorii se poate
realiza din sectiunea principala de administrare a categoriil or. Aplicația va genera un
dialog de confirmare.
Figura 5.3. Ștergerea unei categorii
3.3.4. Administrarea subcategorii lor
Această s ețiune de administrare conține informații despre subcatego riile
produselor din aplica ție.
Figura 5.4. Administrarea subcategorii lor
40
În figura 5.4. este ilustrat ă secțiunea de administrare a subcategorii lor unde se
regăsește o lista a sub categoriilor cu urmatoarele informații: ID-ul subcategorie i,
denumire a, dar și numele categoriei din care face parte.
Asemănător secțiunilor anterioare, există bara rapidă de căutare unde
administratorul poate filtra subcategoriile .
Figura 5.5. Adăugarea unei subcategorii
În pagina d e adăugare subcategorie , administratorul poate adauga noi subcategorii
introducând denumirea noii subcategorii și categoria din care face parte .
Figura 5.6. Editarea unei subcategorii
41
Adm inistratorul are posibilitatea modificării subcategoriilor . La efectuarea cu
succes a editării va fi afișat un mesaj de succes in partea de sus a aplicației. În cazul in
care există erori, va fi afișat un mesaj de eroare cu datele ce trebuie completate.
O altă funcție care poate fi accesa tă este aceea de șterge re a unei anumit e
subcategori i. Similar cazurilor anterioare, în situația în care se administratorul va
apăsa ”DA”, respectiva subcategorie va fi ștearsă, iar înregistrarea nu va mai apărea în
lista de subcategorii.
Figura 5.7. Ștergerea unei subcategorii
42
3.3.5. Administrarea produselor
În cadrul aceste i secțiuni , pe lângă elementele deja familiare și prezen te în
secțiunile anterioare , este prezentată lista de produse disponibile . Fiecărui produs este
disponibil un ID, o denumire, o clasificare a fiecărui produs pe subcategorii, dar și
prețurile acestora.
Figura 6. Administ rarea produs elor
Prin apăsarea butonului “Adaugă produs ” se va deschide o nouă pagină web unde
se vor completa denumirea noului produs, categoria și subcategor ia din care face parte,
descrie rea, prețul și o imagine asociată acestuia.
Figura 6.1. Adăugarea unui nou produs
43
În pagina de editare, administratorul poate face modicări unui produs : schimbarea
denumirii produsului, a categoriei și a subcategoriei din care acesta face parte, cât și a
denumirii, prețului și a imaginii selectate. D in momentul în care câmpurile au fost
completate corect, aplicația va întoarce mesajul “Editarea produsului s -a efectuat cu
succes.”
Figura 6.2. Editarea unui produs
Administratorul are posibilitatea de a șterge un anumit produs , dar numai după
confirmarea dialogulu i.
Figura 6.3. Ștergerea unui produs
44
3.3.6 . Administrarea comenzilor
În această secțiune administratorul poate vizualiza toate comenzile facute de
utilizatori . Prin bara de cău tare se pot filtra comenzile, putând fi gasite mai u șor de
administratorul aplicației .
Figura 7. Administ rarea comenzilor
În pagina de editare comandă , administratorul poate modifica statusul unei
comenzi , pentru a pu tea informa clienții cu privire la comenzil e realizate de ace știa.
Figura 7.1. Editare comandă
45
În secțiunea de administrare a comenzilor, administratorul are opțiunea de șt ergere
a unei comenzi.
Figura 7.2. Ștergere comandă
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: Realizarea unui site pentru o companie din domeniul IT [618292] (ID: 618292)
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.
