Crearea unui magazin on-line specializat în vânzarea de roboții de jucarie [306035]

UNIVERSITATEA “CONSTANTIN BRÂNCUȘI” [anonimizat]

––––––––––––––––––––––––––-

[anonimizat]:

Șef Lucrări dr.ing.Gîlcă Gheorghe

Absolvent: [anonimizat]

2019

CUPRINS

Introducere … 4

Internetul, site-[anonimizat]

“[anonimizat] “ … 5

1.1. Internetul-primii pași … 5

1.1.1  Internetul-primii pași. …5

1.1.2 Internetul- de la definiție la administrare …6

1.1.3 Conectarea la Internet …9

1.2. Despre Site web … 10

1.2.1 Site web …10

1.2.2 Site-[anonimizat] …11

1.2.3 Despre motoare de cautare …12

1.3. De ce este importantă crearea paginilor web …14

2. Tehnologii folosite pentru crearea site:

[anonimizat] … 15

2.1. HTML-HyperText Markup Language …15

2.1.1. Notiuni generale …15

2.1.2. Formatarea textelor …16

2.1.3. Link-ul       …18

2.1.4. Imagini …18

2.1.5. Tabele …19

2.1.6. DIV-uri … 20

2.1.7. Formulare …20

2.2. CSS- Cascading Style Sheets …23

2.2.1.La ce folosește CSS? …23

2.2.2.Noțiuni de bază …23

2.2.3.Sintaxa …24

2.2.4.Class și Id …27

2.2.5.Background …28

2.2.6.Formatarea textului …29

2.2.7.Margins, Border, Padding …30

2.2.8.Bara de navigare …32

2.3. PHP- Hypertext Preprocessor

2.3.1 Introducere …33

2.3.2  PHP-Puncte forte …34

2.3.3  Sintaxa PHP …35

2.3.4  Variabile …35

2.3.5 Tipuri de date …36

2.3.6  Operatori …37

2.3.7  Instructiuni în PHP …39

2.3.8 Functii …41

2.3.9. MySQL …42

3.   Crearea site: Magazin on-line specializat în vânzarea de roboții

de jucarie- Descrierea și realizarea site-ului

3.1 Descrierea site-ului … 47

3.1.1 Proiectarea în ansamblu        …48

3.1.2 Structura bazei de date …49

3.1.3 Aplicatiile software folosite …50

3.1.4  Functii utilizate în aplicatie …52

3.1.5  Publicarea site-ului …53

4. Utilizarea site-ului

4.1 Sectiunea destinata vizitatorilor …53

4.2  Sectiunea de administrare …60

5. Concluzii …61

6. Bibliografie …62

Introducere

Pentru înțelegerea modului de realizare și publicare a unui site WEB, în cazul de față „Crearea unui magazin on-line de vanzare roboți de jucărie”, prin lucrarea de față voi prezenta o serie de informații generale și particulare.

Aplicația realizată este un site dinamic, construit utilizand tehnologiile HTML, CSS  si PHP.

Site-ul prezentat în această lucrare este destinat unui magazin on-line specializat în vânzarea de roboții de jucarie .

Prezentarea  roboților de jucărie expuși la vânzare, informații(contact,preț, dimensiuni etc.), transmiterea comenzilor de cumpărare din partea clienților, centralizarea acestora în baza de date constituie motivația realizării acestui site, în scopul realizării de câstiguri suplimentare prin prezentare și reclama făcută produselor(în cazul nostru a roboților de jucărie).

Site web prezentat are cateva aspecte care se referă la oferirea informatiilor importante: siteul prezintă magazinul destinat vânzării roboților de jucărie, adresa,date de contact,înregistrare a clienților precum și oferta online, efectuare de comenzi de către clienți. De asemenea, site-ul este bine organizat fiind conceput și proiectat utilizând produse precum: Notepad++, Atom, Adobe Phothoshop, Xampp, MySQL.

Vizualizarea site-ului este permisă tuturor vizitatorilor, adaugarea informații,observații este permisă doar membrilor site-ului, pentru aceasta fiind implementat un mecanism de înregistrare și logare.

Lucrarea este alcătuită din  cinci capitole, si anume:

În capitulul 1, Internetul  am prezentat informații generale despre istoria acestuia si modul de conectare la internet.

Capitulul 2, Tehnologii folosite pentru crearea site-ului  cuprinde informații despre limbajele de programare folosite-HTML,CSS și PHP, cu exemple din site-ul creat.

În capitolul 3, Descrierea și realizarea site-ului am prezentat structutra claselor, a bazei de date, aplicațiile folosite în realizarea site-ului și câteva dintre funcțiile PHP folosite cel mai frecvent.

Capitolul 4, Utilizarea site-ului descrie utilizarea aplicației, iar capitolul 5, Concluzii  prezintă concluziile privind realizarea acestui site.

Internetul, site-uri web și tehnologii folosite pentru realizarea site-ului

“Crearea unui magazin on-line specializat în vânzarea de roboții de jucarie “

1.1. Internet-ul

1.1.1.  Internetul-primii pași

Internetul a apărut la mijlocul anilor 60 sub forma unei rețele de computere între unele instituții americane, ce lucrau pentru ARPA(Advanced Research Projects Agency Net) -, un departament de cercetare din cadrul Pentagonului pus în funcțiune ca urmare la succesul sovietic al lansarii satelitului Sputnik în spatiu. Unul din obiectivele ARPA-net era realizarea unei rețele sigure, indestructibilă în urma unui atac militar, scenariul luat în calcul ere lansarea unei bombe sau un atac nuclear la care calea de comunicație(rețeaua) să reziste.

Astfela fost realizat un proiect de rețea, unde rețeaua era mereu în pericol de atac.

În consecință:

– doar un minimum de informații era cerut de la computerele client în rețea,

– oricand transmisia de date întalnea un obstacol, sau una dintre adrese era de negăsit, se gasea o altă cale catre adresa cautată.

Astfel, a fost realizat un protocol care reglementa transmisia de date pe Internet. Acesta era TCP/IP (Transmission Control Protocol / Internet protocol), care este și acum baza Internetului. TCP/IP face posibil ca modele diferite de calculatoare(Mac, IBM….), folosind sisteme diferite de operare, cum ar fi Windows, MacOS, UNIX, etc. să se 'înteleaga'(devină compatibile) unele cu altele. În acest fel, Internetul devenea o platformă-independentă.

Internet-ul 'civil' a debutat ca o rețea de patru computere între Universitatile din Santa Barbara, Utah, și Los Angeles și Institutul de Cercetare din Stanford, cercetatori din alte instituții manifestându-și dorința de a se alătura unui astfel de proiect. Computerelor fiind destul de scumpe, folosirea în comun a unei rețele de calculatoare constituia un avantaj deosebit.

La sfarsitul anilor 60 Internetul numara în jur de 50 de computere care au dezvoltat unele servicii pentru transferul informației, folosite înca si azi:
– E-Mail pentru trimiterea mesajelor personale;

– File Transfer Protocol pentru trimiterea și regăsirea fisierelor ;

– Telnet pentru accesarea și folosirea bazelor de date, a bibliotecilor și a cataloagelor din toata lumea.

Cu noi grupuri de utilizatori care se alaturau în urmatoarea decada internetul era in mod categoric în ascendența. Acesta a crescut la o rețea de 200 de computere. Partea militara- Milnet era organizată într-o retea separată.

Au aparut și alte rețele, mai ales în sectorul academic. Importanta printre acestea era (și este) USENET sau Users' Network, înființată în 1979, când câteva calculatoare tip UNIX au fost conectate împreuna.

Oamenii faceau schimb de noutăți și imagini, în ciuda distanțelor și a hotarelor. De-a lungul USENETului s-au dezvoltat și alte rețele. Toate formau un spatiu de comunicatie radical democratic. Înaintea unei noi discuții pe care grupul o începea, comunității Netului i se cerea un vot de accept. Grupurile de discuții jucau un rol mare pe Internet.

Internetul a început să fie un factor de luat în considerare în politica, la zece ani dupa ce USENET îsi începuse dezvoltarea, Internetul a crescut la 80.000 de computere. Și curand, expresia internetul-“autostrada informatiei” a devenit uzuală. Internetul era vazut ca o importantă infrastructură pentru transportul informațiilor.

La începutul anilor 90, când Internetul era folosit doar de un numar mic de cercetători, principalele aplicații erau atunci posta electronica și grupurile de discuții (Newsgroups) plus diverse rutine de căutare și mecanisme de transfer al fisierelor, o lume UNIX, în care toate comunicațiile existau doar ca text sau numere, liniile de comanda trebuiau memorate și tipărite.

Cand posta electronică, programele de căutare și de transfer al fișierelor au trebuit sa facă fată unor cerinte mai complexe, s-au realizat noi programe de navigație. Software-ul pentru fiecare navigator trebuia sa fie obtinut si configurat separat. Folosirea fiecarui soft trebuia sa fie învatată.

În concluzie, folosirea Internetului în acea perioadă, datorită metalimbajului foarte dificil, era restransă la un mic grup de cercetători din universităti și institute de cercetare.

1.1.2. Internetul- de la definiție la administrare

Internet-ul este o retea vastă de calculatoare care leagă milioane de rețele mai mici din lumea întreaga.

O rețea este alcătuită dintr-un grup de calculatoare și de echipamente de calcul conectate pentru a primi/ceda informații și a gestiona resurse. Într-un birou calculatoarele sunt interconectate pentru a putea utiliza aceleași fisiere și aceiași imprimantă(ploter…). Calculatoarele legate în rețeaua Internet pot schimba informații între ele.

Putem spune că o rețea  este un ansamblu: echipamente de tehnică de calcul (hardware), de programe (software) și infrastructură de comunicație necesară, dedicate interconectării calculatoarelor în vederea partajării resurselor și serviciilor.

Definirea unor elemente de internet

Clienții/ Servere: În Internet există doua categorii importante de calculatoare: cele care solicită accesul la informații și le utilizează se numesc clienți și cele care înmagazinează, sortează și distribuie informațiile se numesc gazde sau servere.

Liniile  telefonice: sisteme telefonice private și publice sunt rețelele ce pot face parte din Internet, pot trimite și primi informații prin linii telefonice, acestea variaza la cabluri din fibra optică pană de la cabluri din fire de cupru. Prin cablurile din fibra optică se pot transmite mai multe date și cu viteza mai mare (de cca. 1000 de ori mai repede decat prin liniile telefonice din cupru).  Unele retele pot fi legate și prin unde  radio. Retelele din țari și continente diferite sunt deseori legate prin sateliți sau cabluri subacvatice.

Legaturile: Calculatoarele folosite de instituțiile mari: universități, mari companii etc. au o legatura la Internet „dedicată”,  ele sunt  legate  la Internet tot timpul. În general, persoanele care folosesc calculatoare la birou sau acasa nu au legături „dedicate”. Ele pot să solicite accesul la Internet folosind telefonul local și o procedura speciala (programe specifice pentru calculator). În felul acesta calculatorul de acasa sau de la birou intră în legatură, la cerere, cu un calculator deja „legat” (on-line) la Internet.

Prin urmare Internet-ul este:

Un mijloc de comunicare (foarte rapid) între oamenii acestei lumi;

modalitatea prin care oamenii aflați oriunde pe Glob pot comunica și schimba informații cu multa usurință;

oferta “de toate pentru toți”, remarcându-se prin usurința cu care orice utilizator poate avea acces la informație;

este o rețea de rețele.

O rețea este un grup de calculatoare care au fost conectate astfel încat să facă schimb de informații. Ele pot transmite informații unul altuia și le pot folosi în comun sub formă de fisiere.

Tipurile de rețele dezvoltate până în prezent sunt:

Local Area Network – LAN –  are dimensiuni relativ restrânse( cateva sute de metri), ceea ce înseamna că timpul de transmisie în cazul cel mai defavorabil este limitat și cunoscut dinainte. Având în vedere aceasta limită, este posibil sa se implementeze anumite tehnici simple care altfel nu ar fi fost posibile. Se simplifică și administrarea retelei.

Metrropolitan Area Network- MAN  –  are grad de extindere la nivelul unui oraș. Această rețea folosește cel mai des tehhologia wireless sau fibra optica pentru realizarea de conexiuni.

Wide Area Network- WAN  – sau rețea natională. Este folosită pentru interconectarea mai multor LAN-uri și a altor tipuri de rețele, scopul fiind comunicarea între persoane și computere situate la mari distanțe unele fata de altele.

INTERNET este o  interconectate  de LAN-uri, MAN-uri si WAN-uri prin legături rapide (satelit, circuite comunicație digitală-fibră de sticlă etc.).

Toate  calculatoarele dintr-o rețea comunică între ele pe baza unui limbaj, denumit protocol ( set de reguli fixe)care s-a standardizat  și se numeste  Transmission Control Protocol / Internet Protocol- TCP/IP .

Pentru a folosi  Internet-ul, un utilizator trebuie sa conecteze calculatorul sau la una dintre sub-retelele precizate mai sus. In acest fel, calculatorul devine nod în rețea și prin utilizarea protocolului TCP / IP  va putea folosi diverse programe cu rol de client pentru a transfera informații de la alte calculatoare server conectate la Internet.

Nu există persoană, sau companie care sa impună o serie de reguli în administrarea Internetului. Singurele reguli care guvernează internet-ul sunt cele ale bunului simt.

Exista o organizație a utilizatorilor internet-ului numită ISOC (INTERNET SOCIETY), care are obligația să standardizeze tehnologia folosită și să gestioneze din punct de vedere tehnic internet-ul.

1.1.3. Conectarea la Internet

Există patru moduri principale de conectare la INTERNET:

Legatura prin poșta electronică,

Legatura prin modem și terminal (dial-up terminal connection),

Legatura directă prin modem (dial-in direct connection),

Legatura permanentă (permanent connection).

Servicii disponibile în INTERNET

Schimbul de informații în INTERNET se desfășoară prin “servicii”, care permit cautarea și exploatarea de informații din retea. Pentru aceste servicii există un calculator care solicită informații (client al serviciului) de la un alt calculator care furnizează informațiile, numit calculator server. Calculatoarele legate în retea, pot fi atât client cât și server.

World  Wide Web (WWW)este cel  mai  utilizat  serviciu  în INTERNET .

World  Wide Web este un sistem cu hipertext  care ne ajută să cautăm informații pe cale electronică în jurul lumii. Pentru a utiliza serviciul WWW,  avem nevoie de un browser Web, acesta fiind un program care afiseaza documente Web.  (Google Chrome,Mozila Firefox, Internet Explorer, etc).

Azi un număr foarte mare de persoane au propria pagina Web, în care      publică  informații  utile. O mare parte din paginile de Web au un aspect comercial, informatia cu adevarat folositoare fiind în permanența scădere. Acest fapt nu este îngrijorător deoarece acolo unde exista aspect comercial, apare și legea concurenței. Astfel doar firmele cele mai  “capabile” vor reusi să se mențină.

Utilizatorii percep în ultimul timp o scadere a calității serviciilor datorată în special aglomerării rețelei deși creșterea capacității și nivelul de performanța al rețelei INTERNET au crescut.

Factorii care determină  aglomerarea rețelei  INTERNET  sunt:

–  asaltul amatorilor care manifestă un comportament  irațional  și care contribuie la “poluarea”  Internet-ului;

–  imperfecțiunea pieței serviciilor INTERNET, structura ei reflectându-se asupra prețului și vitezei de comunicare;

–  inexistența unor soluții tehnice de acces care să facă o diferentiere a serviciilor solicitate și să permită acordarea priorității diferențiate de servicii.

Informații necesare pentru conectare la INTERNET.

Tipul de legatură la Internet : SLIP (Serial Line Internet Protocol) sau PPP(Point-to-Point Protocol);

Denumire utilizatorului;

O parola;

Numărul de telefon al furnizorului;

Adresa IP(Internet Protocol) pentru Domain Name Server – DNS este metoda folosită de INTERNET pentru a crea denumiri unice pentru fiecare server de retea;

Tehnica de autentificare (denumirea pentru conectarea și parola ).

Observație:

Universal Resource Locator (URL – sistem universal pentru localizarea resurselor) este adresa unică prin care se identifica paginile WEB .

Adresele retelei WWW  sunt: http://  .

“http” reprezintă prescurtarea de la Hyper Text Transfer Protocol.

1.2.Despre Site web

1.2.1.Site web-ul

Termenul de site web are radacina în limba engleza -web site și desemnează o grupă de pagini  multimedia continând texte, imagini fixe, animații etc., accesibile în Internet, de catre oricine și care sunt conectate între ele prin hiperlinkuri. Site-urile web pot fi create de catre o organizație, o persoană particulară, instituții publice .

Notiunea de site web apare în limba română scrisă sub trei forme:

–  site ca în limba engleza;

– sait noțiune propusă de lingvistul George Pruteanu;

–  sit.

Site-ul web este administrat (creat, întreținut și actualizat) de catre un asa-numit webmaster(administrator de site), dar nu numai:

–  site-ul web se poate actualizeaza automat și permanent cu ajutorul unei baze de date;

–  paginile site-ului pot fi create în mod dinamic și automat;

– site-ul web se poate realiza și administra chiar de catre utilizatori.

1.2.2. Site Web-Tipuri

Paginile HTML (Hypertext Markup Language) este, în general, cel mai ieftin mijloc de a publica informatii în Internet.

Pagina inițiala( Home page) reprezintă un document HTML care serveste ca punct de intrare în  site-ul web.

Pagina inițiala conține informații cu caracter general și introductiv precum și hiperlegaturi .

O pagină contine butoane de navigare, care ajută utilizatorul să se deplaseze printre numeroasele pagini la care are acces.

Există patru tipuri de site-uri Web:

a)  cu pagini statice

b) cu pagini dinamice

c) dezvoltate pe baze de date

d) tip magazine virtuale

a)   Site-urile cu pagini statice – sunt folosite drept panouri publicitare, clienții doresc transpunerea în format HTML a principalelor pliante de prezentare. Acest tip de site este usor și ieftin de construit.

b)   Site-uri cu pagini dinamice – necesită o actualizare zilnica sau saptamanală a elementelor specifice. La proiectare trebuie ținut cont de urmatoarele elemente:

– modul în care vor fi actualizate datele ,

– costurile operatiunilor de actualizare .

Comunicarea cu utilizatorii care apeleaza un astfel de site, se poate face prin inserarea de formulare de e-mail, pe paginile site-ului. Astfel se poate lua în considerare folosirea unui autoresponder pus la dispozitie de catre ISP(furnizorul serviciilor de internet).

În felul acesta se va transmite automat un mesaj de raspuns vizitatorului site-ului, înștiințându-l astfel de primirea mesajului transmis și multumindu-i pentru vizită.

c)   Site-uri dezvoltate pe baze de date – aceste site-uri impun metode și tehnici deosebite pentru realizare, necesitand actualizări frecvente ale elementelor componente. Aceste site-uri se bazează pe o baza de date (de exemplu: MySQL, Oracle), care poate fi actualizata în mod regulat prin intermediul unui program .

d)   Magazinul virtual – acest tip de site este cel mai complicat și mai greu de utilizat, necesitand metode și tehnici deosebite de proiectare și exploatare. Magazinele virtuale se bazeaza pe date stocate în baze de date și permit clientilor sa aleagă și apoi sa achizitioneze în siguranță produse sau servicii on line, cu ajutorul carților de credit sau a banilor virtuali (electronic cash,monede digitale). Procesarea cartilor de credit este partea cea mai dificila în dezvoltarea site-ului.

Crearea unui magazin on-line specializat în vânzarea de roboții de jucarie se încadrează în acest tip de site excluzând însă plata cu ajutorul cărților de credit sau a banilor virtuali,plata făcându-se la primirea produsului(robotului de jucărie).

1.2.3. Despre motoare de cautare

Motorul de cautare – este un server care navigheaza pe Internet și captureaza titlul, cuvinte cheie și conținutul paginilor ce compun site-urile. Toate paginile gasite de către server sunt înregistrate în baza de date.

Când un utilizator cauta într-un motor de cautare dupa o anumita fraza sau cuvant, motorul de cautare caută în baza de date și în functie de criteriile de prioritate crează o lista de rezultate pe care o va afișa.

Motoarele de Cautare -utilizare:

Căutarea se poate face în orice limbă. Se alege informația pe care utilizatorul dorește să o găsească. De exemplu:

Căutăm firme care se ocupă cu vânzare roboți de jucărie. Expresiile uzuale ar fi:

Roboti de jucarie web – în romana sau web toy robots-în engleza.

Cautarea se poate largi astfel:

– Tg-Jiu roboți de jucărie sau Tg-Jiu toy robots.

Daca se dorește o cautare zonală se va scrie, mai întâi numele orașului/zonei urmat de numele de domeniu cautat, exemplu- Tg-Jiu (Romania) .

Expresiile nu trebuie sa aiba mai mult de 3-4 cuvinte. Dupa alegerea expresiei se tastează cuvintele din care este compusa, punand virgula între ele. Se apasă butonul Search și se așteaptă rezultatele.

Cele mai cunoscute motoare de cautare sunt

www.google.com; www.yahoo.com:

http://www.google.com – Google

Lansat ca un simplu motor în faza de testare, în septembrie 1998, de doi studenti de la Universitatea Stanford, Larry Page și Sergey Brin, Google a cunoscut, în doar cativa ani, un succes fenomenal. Motorul de cautare a inaugurat versiunea sa comercială în1999. Google se bazeaza pe cautarea cuvintelor cheie, în functie de numar și de site-urile de origine, Google nu merge pe principiul ca site-urile respective să plătească pentru a fi afișate în capul listei, sistemul “page rank”, inventat de cei doi studenti, reprezintă popularitatea paginilor.

Pe Google, publicitatea se limitează doar la cateva link-uri hypertext discrete, care apar pe ecran doar dacă sunt în raport cu informațiile căutate în timp ce alte motoare sunt invadate de zeci de bannere publicitare, aceasta fiind o particularitate a sa este de ordin strategic. O altă caracteristică este functionarea în mai multe limbi.

Google poate presta servicii de cercetari documentare complexe pentru cine este interesat, contra cost.

www.yahoo.com- Yahoo

David Filo și Jerry Yang, au lansat web-ul Yahoo în aprilie 1994. Acesta era o unealta rezervata uzului personal, aceștia ți-au dat seama că datele obținute erau foarte importante, dar și dificil de administrat.

Început ca hobby, Yahoo a devenit, în timp, o adevarată afacere.

Yahoo a avut și are un succes imens și milioane de oameni l-au folosit și-l folosesc pentru a explora web-ul. O data cu lansarea lui Yahoo!France, portalul s-a extins cu Yahoo!Canada, Yahoo!Germany, Yahoo!Japon,  Yahoo!Irlande, Yahoo!Spany.

Numărul de inscrieri zilnice depășește 500.

Se face distincția între site-urile comerciale și celelalte.Site-urile al caror conținut este ilegal sunt respinse.

Yahoo este foarte precis în privința clasamentului geografic al site-urilor. Yahoo, ca și concurenții săi, asigură servicii gratuite: informații financiare, sport, stiri, meteo, adrese de e-mail gratuite etc.

1.3. De ce este importantă crearea paginilor web

Ca mod de prezentare scop informativ sau de afaceri, importanța site-urilor web este deja un lucru cert pentru toată lumea.

Acum și cele mai mici firme au o pagina web în care prezintă cel putin domeniul de activitate și datele de contact ale firmei. Cei care iau în calcul o prezență online pot spera să gasească noi clienți și/sau parteneri de afaceri.

Importanța paginilor Web este dată de către următoarele argumente:

1.   Primul argument constă în construcția unei pagini web pentru a fi prezent în spațiul internetului.

2.  Prin pagina web creste credibilitatea. Prezentarea de pe internet este realizată intr-o maniera care sa creeze o impresie mai bună. Aceasta poate fi intărită prin expunerea unei filosofii a firmei(organizației). Dacă aceasta este mare, pagina web oferă momentul de a expune filosofia firmei(organizației).

3.  Crește vizibilitatea firmei. Internetul este utilizat de oameni de pe tot Globul. Aceștia pot comunica, prin Internet-apelând site-ul Web, foarte usor cu firma chiar distanța este de mii de kilometri . În cazul în care nu ar exista o pagina web, Șansa de a se face cunoscută o firmă la distantă mare devine mult mai mică în lipsa unei pagini Web.

4.  Existența unei pagini Web te face cunoscut și pe plan local nu numai la distanță. Daca cineva doreste să comande un produs, serviciu sau lucrare și este conectat la internet, atunci, prin intermediul motoarelor de căutare, poate cauta site-uri de unde sa comande. În cazul în care firma nu are site web, persoana-organizația nu o va gasi și va comanda produsul,serviciul sau lucrarea din altă parte.

5.  Pretul unei paginii web, poate fi foarte mic, în funcție de complexitatea site-ului realizat. Realizarea unui asemenea site poate oferi un magazin virtual de vânzare a a produselor ,serviciilor și lucrărilor.

6.  Prezența pe internet este de 24 de ore pe zi, 7 zile pe saptamana.

.

2. Tehnologii folosite pentru crearea site: Magazin on-line specializat în vânzarea de roboții de jucarie

2.1 HTML

HyperText Markup Language

2.1.1. Notiuni generale

HTML (HyperText Markup Language) este unul dintre primele elemente ale WWW (World Wide Web) este standardulcare realizează formatul primar în care documentele sunt distribuite și vazute pe Internet. Elemente cum ar fi independența fata de platforma, structurarea formatării și legaturile hipertext, fac din HTML un foarte bun format pentru documentele Internet și web. Primele elemente de baza ale web-ului au fost HTML, HTTP și URL.

Paginile HTML sunt etichete sau taguri și au extensia .html sau .htm. În general ele sunt taguri sunt pereche, una de deschidere <tag> și alta de inchidere </tag>. Browserul interpretează etichetele afisand rezultatul pe ecran. HTML-ul nu face deosebirea între litere mici și mari, nu este un limbaj case sensitiv.

Componentele unui document HTML sunt:

1. versiunea HTML sau doctype-ul documentului, în cazul nostru versiunea este HTML-5 ;

2.      zona head cu etichetele <head> </head>;

3.      zona body cu etichetele <body> </body>.

Toate paginile HTML încep și se termină cu tagurile <html> și </html>. în interiorul acestor taguri, se gasesc perechile <head>, </head> și <body>, </body>.

În crearea unei paginii web, un element important îl reprezinta DOCTYPE-ul.

<head> contine titlul paginii între etichetele <title> și </title>, stiluri pentru formatarea textului, scripturi și linkuri catre fisiere externe ( fisiere de tip CSS), descrieri de tip <meta>,.

Etichetele de tip <meta> contin cuvinte descrierea paginii, date despre autor, cuvinte cheie, informatii utile motoarelor de cautare și au urmatorul format:

În exemplul anterior, au fost definite 2 taguri <meta>, pentru specificarea tipului continutului paginii, a descrierii, respectiv a cuvintelor cheie.

Tagul  <meta> conține toate tagurile afișate de browser pe ecran.

Pentru a introduce anumite comentarii în HTML, acestea trebuie plasate astfel :

2.1.2. Formatarea textelor

Formatarea conținutului paginii se face cu ajutorul unor taguri simple. Spre exemplu, în HTML, trecerea la un rand nou se face prin introducerea tagului <br>, iar pentru paragraf nou,  prin folosirea tagului <p>, cu închiderea lui. Textul poate fi formatat folosind taguri adecvate:

<p>Poți contacta departamentele Vlad's Shop folosind urmatoarele formulare:<br>

………………..

<p>Masini de curse</p>

………………..

<p>Orice robot achizitionat , poate fi returnat in termen de 21 de zile.</p>.

Pentru fonturi, se poate modifica:

familia (family – Arial, Verdana, etc.), marimea (size), culoarea (color), forma (<b>, <strong> – bold, <i> – italic, <u> – underline, etc.), textul poate fi aliniat pe orizontala sau verticala iar titlurile (heading)-de la 1 la 6.

Etichetele <div> și <span> delimiteaza un bloc text în vederea formatarii. Unul din atributele blocului <div> este align care poate lua valorile left (aliniere la stanga), right (aliniere la dreapta), center (aliniere pe centru).

Exemplu:

<div class="carousel-caption">

<h5> Roboti Inteligenti</h5>

</div>

…………….

<div class="column">

<a href="../link/specs/jder.html">

<img src="../img/vanzari/plus/jder/2.jpg" alt=" Jder" style="width:100%" >

<h2 align="center">Jder</h2></a>

<h5 align="center">7 ron</h5></a>

</div>

Pentru exemplificare, vom prezenta tagurile descrise mai devreme:

Pentru organizarea informației pe pagina, pot fi folosite listele. Acestea sunt neordonate, ordonate și de definitii.

Listele neordonate au ca delimitare tagurile <ul> și </ul>, iar elementele, de <li> și </li>. Listele ordonate au ca delimitare tagurile <ol> și </ol>, iar elementele de <li> și </li>. Pentru a particulariza elementele listei folosim atributul type care poate lua valorile A (litere mari), a (litere mici), I (cifre romane mari), i(cifre romane mici), 1 (optiunea default). Listele de definiții au ca delimitare tagurile <dl> și </dl>. Termenii listei sunt delimitați de etichetele <dt> și </dt>, iar definitiile termenilor de <dd> și </dd>.

2.1.3.   Link-ul

Un tag important este <a> , acesta oferind utilizatorului posibilitatea navigării de la o pagina la alta. În general, link-ul este subliniat, cursorul schimbându-și forma la trecerea peste el. Totuși, prin modificarea stilurilor, linkul poate aparea în pagina cu o culoare distinctă, fara a fi subliniat, în funcție de decizia realizatorului site-ului.

Atributele Link-ul sunt urmatoarele :

href – adresa fișierului destinație :nume fisier – daca se afla în același folder cu pagina curentă, adresa relativă – daca se afla pe același server sau disc, indicandu-se calea, adresa URL – adresa completă a paginii, exemplu- <a href="link/Roboti inteligenti.html">…..</a>;

target – în ce fereastra se va deschide fisierul destinație  :_blank – pagina va fi încarcată într-o noua fereastră, _parent – pagina va fi incarcată în fereastra parinte, _top – pagina va fi încărcată în fereastra top a cadrului, _self – pagina va fi încarcată în aceeași fereastra , exemplu-

<a class="carousel-control-prev" href="#headerSlider" role="button" data-slide="prev">…</a>;

title – mica descriere asociată legăturii afișată în momentul în care mouse-ul se afla deasupra textului de link.

Poate fi inserat un link catre o adresa de email astfel ca, la apasarea acelui link, se va deschide o fereastra a clientului de email instalat, care va avea automat trecuta adresa la destinatar.

Exemplu:

<a href="../link/specs/alina.html">.

2.1.4. Imagini

În general, paginile web contin imagini, acestea fiind mai atractive pentru vizitatori.

Tipul de imagini utilizate în paginile web sunt: JPEG (.jpg sau .jpeg), GIF (.gif), BMP (.bmp), PNG (.png). Formatul GIF este recomadat pentru realizarea butoanelor și a icoanelor iar JPG  pentru fotografii.

Pentru inserarea unei imagini în pagina este folosit următorul tag:

<img> și are urmatoarele atribute:

– src (sursa, locul unde se afla imaginea, cu aceleasi posibilități ca și la adresele linkurilor) ;

–  width (lațimea imaginii);

–  height (înălțimea imaginii);

–  alt (numele care înlocuiește imaginea pana aceasta se încarcă sau când nu a fost gasită);

–  border(chenar, daca valoarea este 0, înseamnă ca imaginea nu are border).

Exemplu: <img src="img/vanzari/toate/robots.jpg" alt="robo" style="width:100%" href="Acasa.html">.

Dimensiunea imaginii afișate de browser este stabilită de argumentele width și height, care pot fi diferite de dimensiunile imaginii originale, caz în care imaginea va fi redimensionată automat de catre browser. Aceste etichete au o mare utilizare deoarece tabelele constituie structura care sta la baza organizarii marii majoritati a paginilor web (inclusiv cea de fata).

Exemplu:

<img src="../img/vanzari/plus/alina/1.jpg" alt="Bananee" style="width:100%">.

2.1.5. Tabele

Sunt formate din linii și coloane rezultând celule. În fiecare celula pastreaza informatia care va fi afisată. La afisare corecta a tabelului, se ține cont ca fiecare rand să conțină același numar de celule. Pentru ca o celula sa fie goala, introducem un spatiu gol sau codul echivalent &nbsp;.

În construcția unui tabel este folosita perechea de taguri <table> și </table>, pentru un rand <tr> și </tr>, iar pentru o celula <td> și </td>. De asemenea, tabele pot fi imbricate, adica în interior pot conține unul sau mai multe tabele.

Tagul <table>are următoarele atribute:

–         border (bordura),

–         width (lațimea tabelului),

–         height (înălțimea tabelului),

–         bgcolor (culoarea de fundal),

–         background (imaginea de fundal),

–         cellspacing (distanța între celule),

–         cellpaddind (distanța dintre marginea celulei și conținutul acesteia).

Pentru celule, atributele etichetei <td> sunt: align (aliniere pe orizontală a conținutului), valign (aliniere pe verticalală a conținutului: top, bottom, middle), width (lățimea celulei), height (înăltimea celulei), bgcolor (culoarea de fundal), background (imaginea de fundal), colspan (unește celula cu cea din dreapta ei), rowspan (unește celula cu cea de sub ea). Un exemplu de tabel cu o linie și o coloana :

2.1.6 DIV-uri

Div-ul  <div></div>  este o casetă folosita pentru gruparea elementelor HTML. Div-urile sunt folosite în special împreuna cu CSS.

Proprietățile ale Div-urilor pot fi: border, width, height, background, position, margin, padding.

2.1.7. Formulare

Webdesignerul sau administratorul site-ului, cu ajutorul formularelor, poate obține diverse informații de la vizitatori. Pentru aceasta, se va utiliza tagul <form>, care are, printre cele mai importante atribute:

action -metioneaza adresa scriptului PHP (aflat pe server) care va interpreta formularul ;

method -indica metoda folosita de browser pentru transmiterea formularului ,poate lua valorile GET și POST :

GET – datele vor fi trimise prin adaugarea la adresa indicată de action , dezavantaj-permite trimiterea unor mici cantitati de date ;

POST – datele sunt trimise separat

avantaj- permite trimiterea unor cantități mari de date.

În general se folosește metoda POST, deoarece alegerea între metodele GET și POST este destul de complicată. Unii programatori folosesc GET pentru formulare care execută o cautare sau o interogare, iar pentru formulare care actualizează o baza de date sau un fisier folosesc POST. Datele trimise prin metoda GET pot fi vizualizate de catre utilizator.

Pentru a se creea o caseta de tip text, sintaxa este:

Atributul name atribuie casetei text un nume, conținutul său fiind accesibil unui script PHP. Numele trebuie sa fie unic în cadrul formularului și trebuie sa respecte regulile pentru denumirea variabilelor PHP, excepția fiind că nu trebuie sa înceapă cu simbolul $.

HTML nu are o etichetă /INPUT.

La scrierea de parole, se va declară o casetă text de tip password:

Pentru a introduce un buton în formular, vom scrie sintaxa:

Ca o caseta cu text, o suprafata cu text (textarea) permite unui utilizator să introducă text.Cu toate acestea, o suprafată cu text poate permite utilizatorului să introducă mai multe linii de text, în timp ce o caseta de text permite introducerea unei singure linii de text.

Atributul name este obligatoriu și specifică numele controlului. Atributul rows  este obligatoriu. Acesta specifică numarul liniilor de text vizibile în suprafata cu text. Atributul cols  este facultativ și specifică numarul coloanelor de text vizibile în suprafata cu text.

Tagul textarea trebuie combinat cu un tag de inchidere. Orice text care apare între aceste  taguri va fi prezentat drept conținut inițial al controlului de tip suprafata cu text.

Daca dorim să trimitem la server și alte date, care sunt ascunse utilizatorului, vom folosi în formular campuri ascunse. Valorile campurilor ascunse sunt trimise la server alături de valorile altor controale, dar utilizatorul nu are posibilitatea de a vizualiza sau manipula valorile campurilor.

Datele care pot avea numai una din doua valori, cum ar fi “pornit” sau “oprit”, caseta de validare de tip checkbox este controlul ideal. De exemplu, caseta de validare este un control adecvat pentru a permite utilizatorului să opteze pentru livrarea rapidă a unui colet. În cazul în care caseta de validare este validata, coletul va fi livrat mai rapid, în caz contrar, coletul se va deplasa cu mijloace obisnuite.

Daca atributul checked='checked' este trecut, caseta de validare va fi selectata în mod prestabilit; dacă nu, caseta de validare nu este selectata. Atributul value specifică valoarea trimisă serverului.

În cazul în care caseta de validare este selectata; daca atributul nu este specificat, se va trimite valoarea activat.

Ca și casetele de validare, butoanele radio pot avea numai una din doua valori. Cu toate acestea, butoanele radio sunt organizate în grupuri, iar, la un moment dat, poate fi activat un singur buton radio din cadrul unui grup; toate celelalte trebuie sa fie dezactivate. Butoanele radio sunt utile pentru a permite unui utilizator sa aleaga dintr-o serie de alternative mutual exclusive. De exemplu, se poate folosi un set de trei butoane radio pentru a permite utilizatorului sa specifice tipul de ambalaj pentru un cadou: fara ambalaj, cu ambalaj simplu sau sofisticat. Numai unul din cele trei butoane radio poate fi activat; la un loc, setul de butoane radio ofera utilizatorului o tripla optiune.

Atributele unui buton radio au aceeasi semnificatie ca și acelea ale unei casete de validare. Toti membrii unui set de casete de validare prezinta acceasi valoare a atributului name.

Un alt control popular în formulare este selecția. O selecție este un meniu care defilează, de unde utilizatorul poate alege una sau mai multe opțiuni. De exemplu, într-o selectie pot fi enumerate numele țărilor din Europa, astfel încat un utilizator sa poată selecta optiunea dorita.

Tagul select este folosit în combinație cu tagul de închidere. Între cele doua etichete este inclusa o serie de etichete option.

Etichetele option pot avea atribute ca:

–         atributul multiple, multiple='multiple' arată că utilizatorul poate alege mai multe opțiuni, menținând apăsată tasta CTRL și executand  click pe aceasta. În absenta atributului multiple, utilizatorul poate selecta o singura opțiune. Daca se specifică atributul multiple, trebuie specificat și un atribut name, care atribuie un nume de tablou ca nume al controlului.

–          atributul size specifică numarul de optiuni vizibile. Prin utilizarea unui buton de derulare în jos sau a unei bare de defilare, utilizatorul poate manipula selectia pentru a obtine accesul la restul opțiunilor și a alege dintre acestea.

Eticheta option este combinată cu cea de închidere. Textul dintre aceste etichete este cunoscut sub numele de conținut al opțiunii. Conținutul opțiunii apare în controlul select.

Un buton foarte util pentru formulare este cel de reinițializare. Acest buton este folosit pentru ca utilizatorul sa poata sterge toate informațiile incluse într-un formular.

Atributul obligatoriu pentru această eticheta este type. Atributul optional value specifică textul care va aparea pe suprafata butonului de reinitializare; daca atributul este omis, pe buton va scrie Reset.

2.2. CSS- Cascading Style Sheets

2.2.1.La ce folosește CSS?

Cu ajutorul CSS-ului putem crea pagini web simple dar si complexe folosind efecte diverse. Cu CSS putem stabili culoarea, marimea si fontul textului, deasemenea putem crea un layout (un suoport pentru elementele HTML) personalizat adaugand margine culoare sau imagine de fond si multe altele. In concluzie CSS te poate scapa de multe batai de cap, ajutandute in a mentine codul html cat mai simplu si mai ordonat.

2.2.2.Noțiuni de bază

2.2.3.Sintaxa

Un CSS regula-set constă dintr-un selector și un bloc de declarație:

Punctele de selecție în elementul HTML pe care doriți să stil.

Blocul declarație conține una sau mai multe declarații separate prin virgulă.

Fiecare declarație include un nume de proprietate CSS și o valoare, separate prin două puncte.

O declarație CSS întotdeauna se termină cu punct și virgulă, iar blocurile de declarare sunt acolade.

CSS Selectori

Selectoare CSS sunt folosite pentru a "find" (or select) elemente HTML pe baza numelui elementului, id, clasa, atribut, și multe altele.

Selectorul elementului

Selectorul elementului selectează elemente bazate pe numele elementului.

Puteți selecta toate <p> elemente dintr – o pagină ca aceasta (în acest caz, toate <p> elemente vor fi centru-aliniat, cu o culoare roșu de text):

Exemplu

p {
    text-align: center;
    color: red;
}

ID-ul Selectorul

ID – ul selectorul utilizează id atribut al unui element HTML pentru a selecta un element specific.

ID-ul unui element trebuie să fie unic într-o pagină, astfel încât selectorul id-ul este folosit pentru a selecta un element unic!

Pentru a selecta un element cu un anumit cod, scrie un hash (#) caracter, urmat de id – ul elementului.

Regula de stil de mai jos va fi aplicat elementului HTML cu id="para1" :

Exemplu

#para1 {
    text-align: center;
    color: red;
}

Selectorul de clasă

Selectorul de clasă selectează elemente cu un atribut specific clasei.

Pentru a selecta elemente cu o anumită clasă, scrie o period (.) de period (.) Caracter, urmat de numele clasei.

In exemplul de mai jos, toate elementele HTML cu class="center" va fi roșu și aliniat-centru:

Exemplu

.center {
    text-align: center;
    color: red;
}

Puteți specifica, de asemenea, că elementele HTML numai specifice ar trebui să fie afectate de o clasă.

In exemplul de mai jos, numai <p> elemente cu class="center" va fi centru aliniat:

Exemplu

p.center {
    text-align: center;
    color: red;
}

Elementele HTML se pot referi, de asemenea, la mai mult de o clasă.

In exemplul de mai jos, <p> elementul va fi stilizat în funcție de class="center" și la class="large" :

Exemplu

<p class="center large">This paragraph refers to two classes.</p>

gruparea Selectori

Dacă aveți elemente cu aceleași definiții de stil, cum ar fi acest lucru:

h1 {
    text-align: center;
    color: red;
}

h2 {
    text-align: center;
    color: red;
}

p {
    text-align: center;
    color: red;
}

Acesta va fi mai bine la grupul selectorii, pentru a minimiza codul.

Pentru selectoare de grup, separați fiecare selector cu virgulă.

In exemplul de mai jos am grupat selectorii din codul de mai sus:

Exemplu

h1, h2, p {
    text-align: center;
    color: red;
}

CSS Comentarii

Comentariile sunt folosite pentru a explica acest cod, și poate ajuta atunci când editați codul sursă la o dată ulterioară.

Comentariile sunt ignorate de browsere.

Un comentariu CSS începe cu /* and ends with */ . Comentariile pot întinde, de asemenea, mai multe linii:

Exemplu

p {
    color: red;
    /* This is a single-line comment */
    text-align: center;
}

/* This is
a multi-line
comment */

2.2.4. Class și Id

Id si class sunt comenzi care dau unei formatari CSS un nume. Se folosesc atunci cand dorim sa aplicam un style de formatare unei anume zone. Pentru compatibilitate cu versiunile anterioare de browsere numele asociate zonelor nu vor contine caracterul _.

Elementul id se aplica unui style de format o singura data sau la o singura eticheta HTML, plasandu-se un nume acelui style. Acest element necesita existenta comezilor CSS in zona HEAD sau intr-un fisier extern.

Exemplu: folosirea elementului id

<html>
<head>
<title>Exemplu 2_1</title>
<style type="text/css">
<!– #albastru{color: #0000FF;}–>
</style>
</head>
<body>
<p id="albastru">Text albastru introdus prin id "albastru"</p>
Text negru
</body>
</html>

Elementul class se similar cu id dar spre deosebire de acesta poate fi folosit de mai multe ori sau pentru zone mai mari. Ca si la id necesita existenta comezilor CSS in zona HEAD sau intr-un fisier extern.

Exemplu: folosirea elementului class

<html>
<head>
<title>Exemplu 2_2</title>
<style type="text/css">
<!– .rosu{color: #FF0000;}–>
</style>
</head>
<body>
<p class="rosu">Primul text rosu introdus prin class "rosu"</p>
Text negru
<p class="rosu">Al doilea text rosu introdus prin class "rosu"</p>
</body>
</html>

2.2.5.Background

Orice procesor de text folosește elemente tip de elemente de tip bold, italic, underline.

Bold

Orice text pus intre aceste tag-uri va fi scris ingrosat (bold):

<p>Aici avem un paragraf cu un text <b>Roboti inteligenti</b> in interiorul sau.</p>

Italic

Orice text pus intre aceste tag-uri va fi scris inclinat (italic):

<p>Aici avem un paragraf cu un text <i> Roboti inteligenti </i> in interiorul sau.</p>

Underline

Orice text pus intre aceste tag-uri va fi scris subliniat(underline):

<p>Aici avem un paragraf cu un text <u>subliniat</u> in interiorul sau.</p>

Strike

Orice text pus intre aceste tag-uri va fi scris iar apoi taiat cu o linie(strike):

<p>Aici avem un paragraf cu un text <strike>strike</strike> in interiorul sau.</p>

Monospace

Continutul tag-ului <tt>…</tt> este scris in font monospaced. De obicei fonturile dimensiuni diferite pentru fiecare litera, in fontul monospace are aceasi latime fiecare litera.

<p>Aici ave un paragraf cu un text <tt>monospace</tt> in interiorul sau.</p>

Superscript

Continutul tag-ului ^… este scris in superscript. Textul are aceeasi marime ca si textul inconjurator, dar este scris cu jumatate de caracter mai sus.

<p>Aici ave un paragraf cu un text ^superscript in interiorul sau.</p>

Subscript

Continutul tag-ului _… este scris in subscript. Textul are aceeasi marime ca si textul inconjurator, dar este scris cu jumatate de caracter mai jos.

<p>Aici ave un paragraf cu un text _subscript in interiorul sau.</p>

Big

Continutul tag-ului <big>…</big> este afisat mai mare (cu un numar) decat restul textului.

<p>Aici avem un paragraf cu un text <big>marit</big> in interiorul sau.</p>

2.2.6.Formatarea textului

Culoarea textului se poate exprima la fel ca si culoarea de background in sistemul hexadecimal, RGB sau cu numele in engleza a culori respective.

body { color: #efefef; }

h1 { color: red; }

p { color: rgb(255,0,0); }

Cu ajutorul atributului body vom specifica culoarea intregului text continut in pagina cu exceptia cazului in care specificam altceva.

Alinierea textului

h1.clasa { text-align: center; }

.clasa { text-align: center; }

In CSS ca si in HTML textul poate fi aliniat la dreapta, la stanga sau justificat (justified).

CSS – Decorarea si transformarea textului in CSS

Decorarea textului se foloseste atat pentru stabilirea cat si inlaturarea anumitor proprietati. Cel mai des intalnita este inlaturarea sublinieri linkurilor:

CSSa { text-decoration: none; }

Alte valori folosite sunt

CSSh1 { text-decoration: overline; }

h2 { text-decoration: line-through; }

h3 { text-decoration: underline; }

h4 { text-decoration: blink; }

Folosind CSS putem transforma tot textul in majuscule in minuscule sau sa transformam prima litera a fiecarui cuvant in majuscula.

CSSp { text-transform: uppercase; }

p { text-transform: lowercase; }

Tot aici voi mentiona si alinierea paragrafului (spatiu liber la inceputul randului)

CSSp { text-indent: 30px; }

2.2.7.Margins, Border, Padding

Am spus si mai sus, putem seta margin-ul cu o singura proprietate sau individual pentru fiecare margine a elementului.

În construcția site-ului dau un exemplu de margin individual pentru fiecare latura.

header img

{

margin-top:5px;

float:left;

}

Margini

Cu aceasta “versiune scurta” este posibil sa specificam toate marginile printr-o singura proprietate.Aici avem mai multe optiuni, putem specifica decat 2 valori (sus-jos si stanga-dreapta):

?

Putem specifica o singura valoare (va fi folosita la toate marginile):

?

Putem specifica 3 valori (sus, stanga-dreapta si jos):

?

Sau putem specifica 4 valori (sus, dreapta, jos, stanga):

?

Padding

Padding se numeste spatiul dintre border si continutul elementului.

Spre deosebire de margin, padding-ul este afectat de culoarea backgroundului elementului HTML.

Ca si in cazul margin, padding-ul poate fi setat pentru toate marginile sau pentru fiecare individual.

Setarea padding-ului individual pentru fiecare latura:

?

Ca si in cazul margin este posibil sa specificam toate padding-urile printr-o singura proprietate.Aici avem mai multe optiuni, putem specifica decat 2 valori (sus-jos si stanga-dreapta):

?

Putem specifica o singura valoare (va fi folosita la toate padding-urile):

?

Putem specifica 3 valori (sus, stanga-dreapta si jos):

?

Sau putem specifica 4 valori (sus, dreapta, jos, stanga):

?

2.2.8.Bara de navigare

Bara de navigare se construieste pornind de la cod HTML simplu, stilizandule cu ajutorul CSS.

In general pentru a crea o bara de navigare fie ea orizontala sau un meniu vertical sunt folosite listele HTML care ulterior sunt personalizate folosind CSS. Linkuri normale in interiorul tagului <li> care va fi incapsulat in tagul <ul>

Exemplu:

<ul>

<li><a href="#">Acasa</a></li>

<li><a href="#">Despre</a></li>

<li><a href="#">Contact</a></li>

<li><a href="#">Inregistreaza-te!</a></li>

<li><a href="#">Intra in cont!</a></li>

<li><a href="#">Comanda AICI!</a></li>

</ul>

Vom folosi acum CSS pentru a da forma listei de mai sus, si anume list-style-type:none – pentru a inlatura "bulinele" specifice listei. Deasemenea vom inlatura marginea si pading-ul pe care browser-ul il atribuie ca valoare standard.

CSS.

2.3.Hypertext Preprocessor

2.3.1 Introducere în PHP

PHP este un limbaj de programare destinat în principal internetului, contribuind la dinamica unei pagini web. Este un limbaj de programare web open-source și server-side.

Numele PHP provine din limba engleza și este un acronim recursiv:

PHP: Hypertext Preprocessor

PHP a apărut în 1994 ca o extensie a limbajului server-side Perl. În vara anului 1998 s-a lansat o noua versiune a interpretorului PHP aceasta primind numele de PHP 3.0. în mai 2000 a fost lansat PHP 4 iar pe 13 iulie 2004 a fost lansat PHP 5, acesta oferind posibilitatea programarii orientate pe obiecte.

La ora actuală există peste un milion de siteuri care folosesc PHP, pentru că îmbină caracteristici dintre cele mai complexe cu simplitatea în utilizare.

PHP este un instrument comod pentru orice nivel de programatori, chiar și pentru începatori.

Limbajul PHP furnizează date care se modifică automat de la o zi la alta sau chiar mai rapid(ceea ce înseamnă conținut dinamic). Conținutul este un element important, el atrage vizitatorii, determinandu-i sa revină permanent pentru informatii noi. Codul PHP este rulat pe server, nu în browser, PHP-ul putând obține accesul la fisiere, baze de date și alte resurse care nu sunt accesibile procedurilor scrise ,de exemplu, în JavaScript.

Codul PHP poate fi inclus într-o pagina HTML. Acesta va fi executat de fiecare data cand pagina este încarcată.

Operațiile pe care programele PHP le executa sunt:

Afișare de date

Prelucrare de date

Citire de date

PHP poate fi folosit pe toate marile sisteme de operare: Linux, variante de Unix, Windows, Mac OS, RISC. Exista suport pentru majoritatea serverelor de web din prezent: Apache, Microsoft Internet, Information Server, Oreillz Website Pro, Caudium, Xitami, Personal Web Server, Netscape, OmniHTTPd, etc.

2.3.2.  PHP-Puncte forte

PHP(comparativ cu alte limbaje de programare) are multe puncte forte

printre care :

-performanța ridicată – utilizand un singur server ieftin puteti oferi milioane de accesări pe zi.Daca numărul de servere crește, capacitatea de servire devine practic nelimitată.

-interfețe pentru multe sisteme de baze de date diferite – PHP are conexiuni disponibile pentru multe sisteme de baze de date. În afara de bazele de date MySql, care fac obiectul acestui site ne putem conecta direct și la alte sisteme de gestiune a bazelor de date. Xampp este o aplicație care conține atat serverul Apache pe care se rulează scripturile php, cât și phpmyadmin-ul care este un sistem de gestiune a bazelor de date care utilizează o interfață foarte usor de folosit, de asemenea utilizată în site-ul creat.

-cost scazut – PHP-ul este gratis.

-biblioteci incorporate pentru multe din taskurile Web obisnuite – fiind destinat web-ului, are funcții incorporate pentru realizarea multor operații utile cum ar fi prelucrarea de imagini, generarea de fisiere PDF, lucrul cu sesiuni, cookie etc..

– este foarte usor de învățat și la fel de usor de utilizat. Sintaxa PHP este bazată pe sintaxa altor limbaje de programare în principal C și Perl.

-suport puternic orientat pe obiecte – oferă atat posibilitatea programării procedurale cât și posibilitatea programării orientată pe obiect. Ca și în alte limbaje de programare și în PHP întâlnim mostenire, atribute private și protected, clase și metode abstracte, interfete, constructori și destructori.

-portabilitate – PHP-ul poate fi utilizat pe toate sistemele de operare majore, inclusiv Linux, multe variante Unix (inclusiv HP-UX, Solaris și OpenBSD), Microsoft Windows, Mac OS X, RISC OS și probabil altele.

2.3.3.  Sintaxa PHP

Codul php este delimitat cu etichetele <?  cod php ?>  si/sau <?php cod php ?>.

Instrucțiunea echo, care este instrucțiune de afișare, va scrie stringul dat ca parametru. Instructiunea echo este o functie echivalentă cu printf(), System.out.println(). Instrucțiunile PHP se încheie cu caracterul punct și virgula. Pentru delimitarea unei expresii de tip text, folosim ghilimelele, iar pentru concatenarea stringurilor, vom folosi caracterul punct.

Exemplu :

<php

echo "<h2>Your Input:</h2>";

echo $name;

echo "<br>";

echo $email;

echo "<br>";

echo $website;

echo "<br>";

echo $comment;

echo "<br>";

echo $gender;

?>

Comentarea codului se face folosind doua caractere slash (//), atunci cand dorim sa comentam doar o linie,  sau /* comentariu */ atunci cand comentariul se intinde pe mai multe linii.

Exemplu:// aici verifici daca adresa de email este luata

…………..

/* aici citesti valorile

din formular */

2.3.4.   Variabile

Variabilele în PHP, respecta anumite reguli, astfel:

•  Numele începe cu simbolul $,

•  Urmatorul caracter este underscore (_) sau o litera,

•  Apoi pot fi adaugate litere, cifre sau liniuțe de subliniere.

Exemplu:

<?php

echo $email;

?>

Limbajul PHP este case sensitive, deci, în numele variabilelor, diferența dintre literele scrise cu majuscule și cele scrise cu minuscule este importantă.

2.3.5. Tipuri de date

String

Un sir de caractere se crează după care poate fi utilizat. Un sir de caractere pote fi folosit direct în functie, sau se poate pune într-o variabila. Mai jos realizăm același text de doua ori: în primul caz punem șirul într-o variabilă, iar în cel de-al doilea punem sirul de caractere direct în functie.

În exemplul de mai sus primul sir de caractere este stocat în variabila $string, în timp ce cel de-al doilea sir de caractere va fi folosit în functia  echo și nu trebuie sa fie depozitat. Rezulatul va fi:

Array

În PHP vectorii sunt niște mulțimi formate din chei. Fiecarei cheie din vector i se atasează o valoare. Acest tip  de date este optimizat astfel încat sa poata fi folosit în locul urmatoarelor structuri de date:  liste, colecții, stive, cozi și altele.

Valoarea unei variabile de tip vector se poate specifica folosind constructia:

array(cheie => valoare, cheie=> valoare,…). Exista trei tipuri de array:

•           Array numeric

•           Array asociativ

•           Array multidimensional

Array numeric

Array asociativ

Array multidimensional

Boolean

O variabila de tipul boolean poate avea doar doua valori: TRUE sau FALSE, ADEVARAT sau FALS. Acestea pot lua valori întregi care sa le reprezinte pe cele de mai sus. Astfel, valoarea 0 inseamna FALSE, iar orice alta valoare întreaga diferita de 0 inseamna TRUE.

Integer

Variabila tip integer reprezintă o valoare din mulțimea numerelor întregi. Aceste numere pot fi specificate în baza 8, în baza 10 sau în baza 16, convențiile fiind aceleași ca și în limbajele C/C++, Java.

Float

Variabilă de tip float poate fi specificată folosind fie forma zecimala, fie cea stiintifică (cu exponent).

Constante

Constanta este un identificator pentru o valoare simpla. Valoarea constantei nu se  modifică pe durata execuției programului. Ca și în cazul variabilelor, numele constantei este case-sensitive,. Constantele se scriu întotdeauna cu litere mari.

2.3.6  Operatori

Operatorii sunt utilizați pentru a efectua operații de manipulare de variabile și valori. În PHP ca și în alte limbaje de programare, există mai multe categorii  de operatori:

Operatorii de atribuire;

Operatorii aritmetici;

Operatorii de comparare;

Operatorii String;

Operatorii de atribuire

Operatorul de atribuire este: “=”

Acum atat $ex1 cat și  $ex2 vor avea valoarea egala cu 10.

Operatorii aritmetici

Operatori de comparare

Verificarea relației dintre variabile și/sau  valori se face utilizând operatorii de comparare. Operatorii de comparare sunt folosiți în interiorul condițiilor pentru a face evaluarea, returnand  adevarat sau fals.

Operatori String

Dupa cum am vazut mai devreme punctul '.' este utilizat pentru a adauga doua siruri de caractere, împreuna. În PHP .(punct) se numeste operator de concatenare.

2.3.7.  Instructiuni în PHP

Instructiunea if…else

Pentru a întelege cum functinează instrucțiunea if…else vom lua urmatorul exemplu:

if ($num == 1) {

/* aici sunt actiunile ce se petrec daca s-a introdus un nume deja luat */

echo "Numele este deja luat";

}

Ce conține codul de mai sus:

– mai întâi am definit variabila $num, care au primit valoarea 1;

– în acest exemplu, vom compara o variabilă cu o valoare. Pentru a face o astfel de comparație, vom utiliza '==';

– $num este egal cu 1, așa că instrucțiunea va fi evaluată cu valoarea adevarat;

Ce conține codul de mai sus:

– mai întâi am definit variabila $num2, care au primit valoarea 1

– în acest exemplu, vom compara o variabilă cu o valoare. Pentru a face o astfel de comparație, vom utiliza '==';

– $num2 este egal cu 1, așa că instrucțiunea va fi evaluată cu valoarea adevarat;

– codul cuprins între (adică: echo' "Emailul este deja luat") va fi executat în momentul în care declarația este adevarată.

Instructiunea ELSEIF

Aceasta instrucțiune este (dupa cum vedeți) o combinație dintre instructiunea if și cea else. Aceasta poate verifica fiecare condiție pană în momentul în care una dintre condițiile găsite returneaza o valoare adevarata.

Instructiunea SWITCH

Aceasta instructiune functioneaza asemanator cu cea if, insa permite conditiilor sa aibe mai mult de 2 valori. Intr-o instructiune if, conditia poate fi adevarata sau falsa, insa intr-o instructiune switch conditia poate lua orice numar de valori diferite.  Aceasta instructiune trebuie sa contina o instructiune case care sa manevreze fiecare valoare pe care o doriti.

Valoarea  $destinatie a fost China, asa incat, atunci cand PHP efectueaza trecerea la switch se face o cautare pentru un case cu valoare  'China'.  Cand este gasit case-ul respectiv este executat codul din acel segment.

Bucla WHILE

Cel mai simplu tip de bucla PHP este while. Asemenea instructiunii  if, ea se bazeaza pe o actiune. Diferenta dintre if și while este aceea ca instructiunea if, daca gaseste adevarata conditia, afiseaza o singura data bucata de cod din ea, insa în conditia while, daca rezultatul este adevarat, bucata de cod respectiva se va repeta atat timp cat conditia este adevarata.

Structura FOR

O alternativa cu o functionalitate mai ridicata pentru utilizarea buclelor este structura repetitiva for. Sintaxa este foarte asemanatoare cu cea din limbajele C/C++ și Java și anume:

Prima expresie este evaluata o singura data, inainte de inceperea executiei ciclului. Expresia conditie este testata inaintea fiecarei repetari a buclei. Daca expresia returneaza fals, repetarea se opreste. Expresia 2 este executata la sfarsitul fiecarei repetari. Instructiunea se executa la fiecare repetare a buclei. Oricare dintre cele trei expresii poate lipsi;  în cazul în care o expresie lipseste, se considera ca ea are valoarea true. Buclele WHILE și FOR sunt identice din puct de vedere functional insa bucla FOR este putin mai complexa.

Structura FOREACH

Structura FOREACH ofera o cale simpla de parcurgere a array-urilor. Exista doua moduri de utilizare a acestei structuri. Prima sintaxa parcurge un array definit de variabila_array. La fiecare iteratie, valoarea elementului curent este atribuita variabilei variabila_element care se poate folosi ca orice variabila.

A doua sintaxa face acelasi lucru, numai  ca indicele elementului din array este atribuit la fiecare iteratie variabilei variabila_cheie.

Exemplu de folosire:

2.3.8. Functii

Pentru a efectua mai rapid anumite calcule și pentru a nu scrie anumite secvente de instructiuni în mai multe locuri în cod, exista posibilitatea apelarii functiilor. Majoritatea acestora accepta argumente, valori de intrare ce influenteaza operarea și rezultatul functiei. Pentru a specifica argumente, se folosesc paranteze; daca functia are mai mult de un argument, acestea trebuie separate prin virgula.

Argumentele pot fi: valori literale, variabile sau expresii. Exista functii care au argumente optionale, care pot fi specificate sau omise. Majoritatea functiilor returneaza valori. Functiile permit obtinerea accesului la programe PHP scrise anterior.

O functie foarte utila este require, care are ca parametru numele unui fisier al carui continut il insereaza în script, inlocuind instructiunea require. Practic, e ca și cum continutul acelui fisier face parte din script.

Pe langa functiile oferite de bibliotecile de functii din PHP, programatorul are posibilitatea sa defineasca propriile functii. Pentru a defini o functie, vom nota:

–  nume_functie este numele functiei, iar argumente este lista de argumente ale functiei.

– Cuvantul cheie function, numele functiei și lista cu argumente alcatuiesc antetul functiei.

Termenul de corp al functiei se refera la instructiunile incluse intre acolade care urmeaza dupa antetul functiei. Instructiunile din corpul functiei se executa atunci cand functia este apelata.

2.3 MySQL

O colectie de date organizată astfel încat acestea sa poata fi usor gasite și actualizate formează o bază de date. Baza de date contine toate informatiile necesare despre obiectele ce dintr-o multime de aplicatii, relatiile logice intre aceste informatii și tehnicile de prelucrare corespunzatoare. în bazele de date are loc o integrare a datelor, în sensul ca mai multe fisiere sunt privite în ansamblu, eliminandu-se pe cat posibil informatiile redundante. De asemenea, se permite accesul simultan la aceleasi date, situate în acelasi loc, sau distribuite spatial, a mai multor persoane de pregatiri diferit, fiecare cu stilul personal de lucru.

Sistemul de programe care permite construirea unei baze de date, introducerea informatiilor în bazele de date și dezvoltarea de aplicatii privind bazele de date se numeste Sistem de Gestiune a Bazelor de Date (SGBD). Un SGBD da posibilitatea utilizatorului sa aiba acces la date folosind un limbaj de nivel inalt, apropiat de modul obisnuit de exprimare, pentru a obtine informatii, utilizatorul facand abstractie de algoritmii aplicati pentru selectionarea datelor implicate și a modului de memorare a lor. SGBD-ul este o interfata  intre utilizatori și sistemul de operare.

Sistemele de baze de date au în vedere mai multe tipuri de structuri de reprezentare a informatiilor la nivel logic și de operare cu ele dintre acestea, modelul relational fiind cel mai folosit.

Acest model a fost dezvoltat de un matematician de la IBM, E.F. Codd, prin anii 1960, iar bazele de date organizate pe baza acestui model se numesc baze de date relationale.

Un model relational de baze de date cuprinde trei componente principale:

– Structura datelor – prin definirea unor domenii și a relatiilor n-are.

– Integritatea datelor – prin impunerea unor restrictii.

– Prelucrarea datelor – prin operatii din algebra relationala sau calculul relational.

Modelul relational se bazeaza pe notiunea matematica de relatie, asa cum este definita în teoria multimilor, și anume ca o submultime a produsului cartezian a unei liste finite de multimi numite domenii. Elementele unei relatii se numesc tupluri, iar numarul de domenii din produsul cartezian se numeste aritatea relatiei.

De obicei relatiile sunt reprezentate sub forma unor tabele în care fiecare rand reprezinta un tuplu și fiecare coloana reprezinta valorile tuplurilor dintr-un domeniu dat al produsului cartezian. Coloanelor si, respectiv, domeniilor corespunzatoare lor li se asociaza nume intitulate atribute.

Accesul la informatii se face pe baza cheilor. O cheie este o coloana (sau un grup de coloane) care identifica în mod unic un rand dintr-un tabel.

Este, de fapt, surprinzator cat de utila poate fi o baza de date, mai ales atunci cand poate fi folosita intr-un site Web. Sunt foarte multe lucruri care se pot face intr-un astfel de caz, de la afisarea unor simple liste și pana la producerea integrala a paginilor Web dintr-o baza de date. Cateva exemple cu PHP și MySQL, folosite impreuna, sunt:

Schimbarea – rotatia Banner-elor.Pentru a realiza schimbarea pe ecran a imaginilor la diferitele vizitari ale unei pagini și a asigura astfel un interes mai mare al vizitatorilor, se poate folosi un script PHP care deschide o baza de date se extrage aleator o imagine sau un set de imagini, pentru a-l include intr-un set de pagini Web. Scriptul PHP va contoriza deasemeni numarul de cate ori a fost vazut banner-ul, putand, cu modificari minore, sa urmareasca chiar și numarul de click-uri. Pentru a adauga, schimba sau edita bannerele, tot ce avem de facut este sa schimbam baza de date iar scriptul va incarca banner-ul corect în toate paginile site-ului Web.

Sute de forumuri de dezbatere sunt acum realizate – ruleaza în PHP și MySQL. Acestea s-au dovedit mult mai eficiente dacat alte sisteme, creand cate o pagina pentru fiecare mesaj și oferind o larga varietate de optiuni. Toate paginile forumului pot fi actualizate prin schimbarea unui script PHP.

Bazele de Date. Un astfel de exemplu (edificator) il ofera site-urile care dau toate informatiile dintr-o baza de date. Spre exemplu, Script Avenue este rulat de cateva scripturi, care furnizeaza toate informatiile dintr-o baza de date ampla. Toate categoriile de scripturi diferite pot fi accesate intr-un singur script exact prin schimbarea URL-ului pentru a accesa diferite parti ale bazei de date.

Cand avem un site de mari dimensiuni – cu multe pagini, și dorim sa modificam aspectul general sau sa schimbam proiectul, chestiune care ar cere foarte mult timp pentru aducere la zi și incarcare. Cu PHP și MySQL intregul site Web se poate reduce la unul sau doua scripturi PHP care sa acceseze o baza de date MySQL pentru a obtine informatiile pentru paginile Web. Pentru a actualiza sau a modifica proiectul centrului Web nu trebuie sa schimbam decat o pagina.

Sunt necesare trei componente pentru a putea rula scripturi PHP care sa acceseze baze de date cu MySQL.

In primul rand, este nevoie de un server Web. Acesta poate fi sau pe calculatorul personal sau pe o 'gazda' Web. Oricare pachet – oricare tip de server Web este acceptat și va lucra cu PHP și MySQL, dar cel mai recomandat este Apache, care e public și gratis.

PHP trebuie sa fie instalat pe server. Daca nu este deja instalat, puteti sa o faceti sau sa apelati la administratorul serverului Web, în acest sens. Pachetul de instalare poate fi descarcat – preluat de la http://PHP.net și este deasemeni public – gratuit. Daca nu sunteti sigur daca este sau nu instalat, o sa vedeti mai jos cum va puteti lamuri.

In fine, aveti nevoie de MySQL. Acesta este de fapt pachetul de programe pentru gestiunea bazelor de date. Puteti folosi deasemenea multe alte sisteme de baze de date (SQL, Oracle etc.) dar aici discutam despre PHP/MySQL, deci avem nevoie de MySQL (cu toate ca se folosesc comenzi care tin de limbajul SQL iti 'merg' la oricare din sistemele de baze de date SQL.

Cativa dintre competitorii principali ai MySQL sunt PostgreSQL, Microsoft SQL Server și Oracle. MySQL are multe puncte forte printre care:

-performanta ridicata;

-cost scazut;

-usurinta în configurare și invatare;

-portabilitate;

-disponibilitatea codului sursa;

-disponibilitatea suportului.

Administrarea MySQL se poate face din linie de comanda sau folosind browserul și accesand aplicatia numita PHPMyAdmin scrisa în PHP. Cele mai uzuale operatii cu bazele de date sunt:

In MySQL spatiul alocat pe discul serverului este functie de tipul de date. Cateva din tipurile de date folosite în bazele de date MySQL sunt:

Pentru ca baza de date sa fuctioneze mai bine coloanelor li s-au adaugat modificatori de coloana. Tipul de date intregi incep de la valori negative la pozitive. Daca se adauga optiunea UNSIGNED, care este un modificator de coloana, nu vor mai fi valori negative ci vor incepe de la 0. Alti modificatori sunt:

AUTO_INCREMENT functioneaza cu orice tip intreg. La fiecare rand nou adaugat în baza de date numarul asociat va fi incrementat.

NULL inseamna fara valoare (diferit de spatiu sau zero).

NOT NULL inseamna ca orice inregistrare va fi considerata ceva.

PRIMARY KEY este rolul primei coloane din tabel, totodata reprezentand elementul de referinta pentru fiecare linie.

3.  Descrierea și proiectarea aplicatiei

3.1     Descrierea aplicatiei

In aceasta lucrare mi-am propus sa realizez un site de prezentare pentru un magazin on-line de vânzare roboți care va putea fi administrat online, printr-un sistem de administrare, la care se logheaza administratorul si/sau un angajat . Partea de prezentare are urmatoarele sectiuni:

Meniu: se gasesc link-urile: acasa, despre noi, informatii utile, contact, oferta și informatii despre magazinul on-line

Vacante în Romania: lista catorva statiuni din Romania

Vacante în strainatate: lista catorva tari

Oferta:  hotelurile care ofera reduceri pentru vizitatorii

Rezervari online: posibilitatea pentru vizitatori de a rezerva un hotel dintr-o anumita statiune pentru o anumita perioada de timp

Sondaj: posibilitatea  exprimarii  opiniei cu privire la intrebarea de pe site

Contact: adresa și formularul de contact

Newsletter: posibilitatea de inscriere la newsletter a vizitatorilor

Alege sezon: aici vizitatorul are posibilitatea de a schimba intreaga interfata a site-ului foarte usor

Sistemul de administrarea are urmatoarele sectiuni:

Prima pagina: aici sunt afisate informatii cu privire la numarul de: tari, statiuni, hoteluri, rezervari, oferte adaugate pana în prezent

Rezervari: vizualizarea și confirmarea rezervarilor existente

Vacante: cu ajutorul acestui meniu putem adauga, vizualiza, sterge tari, statiuni, hoteluri

Newsletter: vizualizarea email-urilor inscrise, trimiterea unui email nou

Cataloage: adaugarea, vizualizarea și stergerea cataloagelor

Sondaj: în aceasta sectiune administratorul are posibilitatea de a vedea rezultatele sondajului, adresa ip, data și optiunea aleasa de fiecare persoana care a votat. Pe langa aceste optiuni acesta mai poate:  reseta voturile, schimba intrebarea, adauga optiuni și sterge optiuni.

        Configurari: aici administratorul poate vedea toti utilizatori care au acees la sistemul de administrare al site-ului. Isi poate modifica parola prin introducerea parolei vechi; poate sterge din utilizatori.

        Alte informatii oferite de sistemul de administrare sunt: informatii despre utilizatorul logat(nume, ultima logare, email-ul).

3.1.1. Proiectarea în ansamblu

Proiectarea de ansamblu a sistemului informatic și succesiunea activitatilor din cadrul proiectarilor este urmatoarea:

Structurarea bazei de date

Definirea claselor

Definirea relatiilor dintre clase

Stabilirea designului

Stabilirea aplicatiilor software necesare pentru dezvoltarea aplicatiei

Publicarea

Proiectarea site-ului web trebuie sa raspunda de urmatoarele cerinte:

Flexibilitate;

Fiabilitate;

Usurinta în folosire;

Usurinta în modificarea datelor

Implementarea cat mai rapida;

Eficienta maxima;

Proiectarea bazei de date trebuie sa aiba aibe în vedere cateva cerinte tehnice și anume:

Unicitate a cheii;

Integritate a domeniului;

Integritate a relatiei;

Integritate de referinta;

3.1.2 Structura bazei de date

Baza de date se numeste “roboshop” și are urmatoarele tabele:

“cumpărare”

-id, nume,prenume,E-mail,Telefon,Adresa,Nume Robot,Preț,Țară,Observații.

“utilizatori”

-id,nume,parolă email

3.1.3 Aplicatiile software folosite în dezvoltarea site-ului și rularea site-ului

Pentru realizarea proiectului am ales urmatoarele aplicatii software:

–          ca editor de text am folosit un produs open-source Notepad++ în prima parte după care am folosit Atom,

–          pentru rularea scripturilor php am ales Xampp care contine serverul Apache și Phpmyadmin

–          ca browser web am ales Google Chrome

Pentru rularea site-ului am parcurs urmatorii pasi:

1.Am instalat  aplicatia Xampp. (La instalarea Xampp-ului trebuie bifat: Instal Apache as service și Instal MySQL as service – aplicatia se instaleaza în C:xampp) .

2.  Se merge în C:xampphtdocs și se sterge continutul directorului

3. Instalare Site:Se copiază directorul cu site-ul în directorul: C:xampp\htdoc\

4.   Dupa copierea site-ului,se deschide Google Chrome, iar în bara de adresa se trece urmatorul link: http://localhost/phpmyadmin/ care ne va duce la PhpMyadmin pentru a incarca baza de date

5.  Creeam o noua baza de date, ii dam un nume și apoi importam baza de date

6.  Mergem apoi în directoarul: system și deschidem fisierul de configurare pentru a trece numele bazei de date ales

7. Odata creata baza de date deschidem în Google Chrome o noua fereastra și introducem urmatoarea adresa: http://localhost/root/

3.1.4  Functii utilizate în aplicatie

mysql_connect('localhost', $user, $pass) – deschide o conexiune carte un server mysql (numele serverului – ‚localhost’, $user – username-ul și parola – $pass);

mysql_select_db($dbname)  – alege o baza de date mysql  dupa conectarea la un server mysql;

mysql_query() – trimite o comanda mysql bazei de date active de pe server;

mysql_fetch_object() – scoate rezultatele din interogare;

mysql_num_rows() – returneaza numarul de linii din rezultatul unei cereri mysql;

session_start() – initializeaza o sectiune de date bazata pe ID-ul de sesiune trimis printr-o cerere

$_GET și $_POST – contin variabile primite de script prin intermediul unor transferuri care folosesc metodele HTTP get, respectiv post. De exemplu, prin intermediul acestor vectori, pot fi accesate valorile campurilor dintr-un formular care a fost completat și transmis folosind una dintre cele doua metode. $_GET și $_POST sunt array-uri.

$_SESSION – contine variabile care corespund sesiunii curente a script-ului.

ob_start() – opreste afisarea bufferului pana la terminarea executiei scriptului;

ob_get_clean() – pune continutul bufferului curent și apoi sterge bufferul;

require_once() – include un fisier;

str_replace()  – cauta și inlocuieste intr-un string un caracter ales de noi și il inlocuieste

3.1.5  Publicarea site-ului

în ceea ce priveste publicarea site-ului pot spune ca acest proces nu este atat de complicat pe cat pare. Pentru a face un site sa functioneze pe un server avem nevoie de urmatoarele date: adersa de ftp, username-ul și parola. Adersa de ftp nu este altceva decat adresa  calculatorului pe care va fi gazduit site-ul; username-ul este numele utilizatorului cu care ne vom conecta. Aceste date ne sunt furnizate de catre compania de hosting. Pentru a ne conecta la ftp avem nevoie de o aplicatie care sa poata face acest lucru. Putem folosi de exemplu Toatal Commander. Dupa ce ne-am conectat nu ne ramane decat sa copiem intregul site pe acea adresa. Dupa ce site-ul a fost copiat pe ftp, va trebui sa modificam fisierele de configurare config.php din directoarele system, respectiv admin/system. Va trebui sa trecem în acel fisier datele de la conectare. Pentru ca site-ul sa fie functional va trebui sa punem și baza de date. Acest lucru difera de la un hosting la altul. în principiu pentru a pune baza de date, compania de hosting ne va da un link de genul: http://www.numesite.ro/phpmyadmin/ . Și aici vom fi nevoiti sa ne autentificam. Dupa autentificare și dupa ce am pus  baza de date site-ul devine functional.

4. Utilizarea aplicatiei

4.1 Sectiunea destinata vizitatorilor

Prima pagina a site-ului(indexfaraindex.html) contine în centru imagini dinamice cu cele trei categorii de jucarii-roboti ce fac obiectul vanzârii în cadrul magazinului virtual:

Roboți inteligenți,

Mașini de curse,

Jucării de pluș,

acestea trei fiind și link-uri către respectivele categorii(depozite) de jucării.

În partea dreapta, sus este bara de meniu a site-ului , cu următoarele link-uri:

Acasa,Despre,Contact,Inregistreaza-te!,Intra in cont!,Comanda AICI!.

Partea dreapta, sus se găsește emblema magazinului on-line.

În partea de jos se găsesc informații cu privire la lumea roboților de jucărie, un procentaj al ponderii celor trei categorii de jucării în oferta de vînzare a magazinului.

Sub acestea se găsesc informații despre serviciile magazinului on-line:Reparații,Retururi,Garanții Extinse.

Pentru a vedea oferta de produse a magazinului vizitatorul poate alege Acasa, de unde pleacă imagini -linkspre cele trei tipuri de jucării precum și spre linkul cu mini-jucăriile bonus care cu siguranță constituie o atracție pentru posibilii cumpărători.

La deschiderea fiecăruia din cele trei categorii de jucării vizitatorul poate să vadă oferta disponibilă, fiecare jucărie având si prețul atașat.

De exemplu, la deschiderea link-ului Roboți inteligenți se deschide o pagină cu modelele de roboți inteligenți expuși la vanzare, cu prețul expus.

Cu un clic pe fiecare tip de robot obținem o galerie cu toate compnentele robotului(telecomandă, armă, sistem de deplasare).

Secțiunea de meniu Despre deschide o pagină cu sediul principal al magazinului precum și sediile secundare ale acestuia.

În secțiunea Contact sunt prezentate datele de contact și detaliate anumite informații cu privire la departamente de vanzare,garanții, post vânzare,comenzi,termene de livrare etc..

4.2  Sectiunea de administrare

Fiecare sectiune poate fi administrata, continutul siteului fiind în totalitate dinamic. Se poate adauga, modifica, sterge, actualiza oferta.

După vizitarea site-ului, în funcție de de alegerea făcută, fiecare vizitator poate să-și aleagă unul sau mai mulți roboți în vederea cumpărării, complectând formularul de cumpărare:

Înurma complectării formularului de cumpărare pot apărea anumite aspecte care sunt sesizate de calculator prin mesaje, care atenționează cumpărătorul:

În urma lansării comenzii, dacă formularul a fost complectat corespunzător de către cumpărător, acesta primește următorul mesaj:

Informațiile ajung în baza de date unde sunt centralizate.Un operator v-a lua legătură telefonică cu fiecare cumpărător în vederea confirmării verbale a comenzii și stabilirii modului de intrare în posesia acesteia.

Obligația măririi și diversificării ofertei pe site-ul devânzări roboți de jucărie revine administratorului de site.

5. Concluzii

Aplicatia descrisa în aceasta lucrare  are ca scop consolidarea cunostiintelor dobandite pe parcursul a patru ani de zile, cat și exemplificarea unui model mai complex de sistem informatic folosit foarte mult în prezent pe internet.

Am incercat și în acelasi timp sper ca am reusit sa scot în evidenta avantajele enorme pe care ni le ofera PHP și MySql cum ar fi rapiditatea,  flexibilitatea și costurile foarte reduse, aproape inexistente în realizarea site-urilor web.

Pe parcusul celor patru capitole am realizat o prezentare de ansamblu a tehnologiilor folosite în construire acestui site web, incepand cu limbajul HTML, un limbaj de baza cu care se incepe practic “patrunderea” în lumea programarii web, continuand cu limbajul PHP, cu prezentarea conceptelor folosite în crearea unei baze de date MySql, apoi cu descrierea și proiectarea aplicatiei și  terminand cu utilizarea aplicatiei.

Un alt avantaj oferit de PHP în fata multor limbaje de programare web este faptul ca este gratuit, paginile se incarca repede și nu neceista resurse foarte mari pentru aplicatii. De asemenea, datele sunt securizate și codul este interpretat pe server, paginile fiind transmise browserului în format HTML.

Pe langa plusul de imagine și profesionalism pe care il aduce un site oricarei companii, avantajele prezentei pe internet ale unui magazin on-line de vânzare roboți de jucărie sunt urmatoarele:

Ofera vizitatorilor posibilitatea de a vedea toate modelele de roboți(jucării) expuse la vânzare

De asemenea posibilitatea de a cunoaște și a vedea detalii despre tipurile de roboți(jucării)

Extinde aria de clienti

Usurinta cumpărării și intrării în posesie a produselor formularului de  cumpărări online

Contactul direct cu vizitatorii(clienții) prin sectiunea de Contact.

6. Bibliografie

Paul DuBois,  “MySQL”. Teora, 2001

Larry Ullman, “PHP și MySQL pentru site-uri WEB dinamice”, Teora, 2004

Bill McCarty,  “PHP4 – A beginner’s guide”, Teora, 2002

Larry Ullman, “PHP și MySQL pentru site-uri WEB dinamice”, Teora, 2004

https://www.w3schools.com/(HTML,CSS,SQL,PHP)