Pentaschool Oktatási Központ Számítástechnikai programozó Z S Í R O S T I B O R E L E K T R O N I K U S K E R E S K E D E L M I P O R T Á L F E J L E S Z T É S E Kolman Nándor Szaktanár konzulens

T A R T A L O M J E G Y Z É K 1. Bevezetés... 2 2. Internetes kereskedelem... 3 3. Feladatspecifikáció... 4 4. Tervezés... 6 4.1. Adatbázis megtervezése... 6 4.2. Felülettervezés... 18 4.2.1. A tervezésben használt technikák... 18 4.2.2. Adminisztrációs felület... 22 4.2.3. Felhasználói felület... 23 5. Megvalósítás... 24 5.1. A megvalósításban felhasznált technológiák... 25 5.2. A rendszer logikai működése... 33 5.3. Osztályok... 34 5.4. Adminisztrátori felület megvalósítása... 37 5.5. Felhasználói felület megvalósítása... 38 6. Üzembe helyezés... 39 7. Tesztelés... 40 8. Összefoglalás... 41 9. Felhasznált irodalom... 43 10. Az elektronikus kereskedelmi portál elérhetősége... 44 1

1. Bevezetés Napjaink egyre gyorsuló világa megköveteli a fejlődés ütemének gyorsulását is. A fejlődő országokban szinte minden háztartás rendelkezik vagy hamarosan rendelkezni fog internet hozzáféréssel. Hazánkban a tavalyi évben mintegy másfél millió háztartás rendelkezett számítógéppel és megközelítőleg 800 000 háztartásban volt internet kapcsolat. Életünkben az internet használat olyan hétköznapi eszközzé válik, mint az elektromos áram, vagy a tömegközlekedés. Megkönnyítheti mindennapi életünket, például a banki tranzakciók otthonról történő ügyintézésével, vagy akár egy jó könyv kölcsönzésével, hírek böngészésével, elektronikus levelezéssel, egyszóval az információ gyors és hatékony továbbításával. A nagyvállalatok, és a kisebb cégek számára is lehetőség nyílik a gyors adatcserére partnereikkel, így lehetővé vált üzleti tevékenységek kiadása, kiszervezése, másik cég megbízása bizonyos feladatok elvégzésével, legyen az bárhol a világon. Ezek a tevékenységek (outsourcing) bevett gyakorlat például az amerikai vállalatok, és India vagy Japán és Kína között, de hazánkban is egyre nagyobb szerepet kap a költséghatékonysága miatt. Akár szoftverfejlesztéseket, könyveléseket és orvosi látleletek véleményezésének folyamatát, munkamenetét is ki lehet adni, köszönhetően a gyors és biztonságos adattovábbításnak, és az adatok digitalizálásának. Mindezt figyelembe véve a világ ma már nem lenne képes működni az internet nélkül, így a hétköznapok tevékenységeink, folyamataink is áttevődnek az elektronikus birodalomba. Az egyik interneten keresztüli tipikus tevékenység a vásárlás. A termékek és azokat kínáló úgynevezett webáruházak széles választéka megtalálható akár több nyelven is. Az egyik legnépszerűbb böngésző a google a webáruház szóra kevesebb, mint egy másodperc alatt talál körülbelül kettőmillió bejegyzést. Ez persze nem konkrétan a webáruházak számosságát jelenti, de azt mindenképpen, hogy mennyire elterjedt maga a fogalom és a mögötte található elektronikus kereskedelmi rendszerek. Mindezek miatt döntöttem úgy, hogy a szakdolgozatom témájául az elektronikus kereskedelmet választom. A középponti témám a szakdolgozatban egy 2

webáruház megtervezése, felépítése. Egy fejlesztési projekt során mutatom be egy általános alapokra épülő webáruház alapvető funkcióit és azok működését. A szakdolgozat végigvezet a fejlesztés szakaszain, bemutatva ezzel egy fejlesztési projekt lépéseit. Ezen felül bemutatom azokat a mai webes technológiákat, tervezési koncepciókat és irányokat, amelyek segítségével életre keltettem a webes áruházat. A dolgozat elolvasása után egyértelművé válik az olvasó számára egy webes áruház funkcionalitása, működése, és a mögötte álló technológiák alapja. 2. Internetes kereskedelem Az internet elterjedésével hazánkban is egyre keresettebbek az internetes vásárlást biztosító ún. webáruházak. Hazánkban a 2006-os év legnépszerűbb internetes áruháza a Bookline könyváruház lett, melynek éves forgalma ugyan ebben az évben 1 418 Millió Ft lett. Ez is azt mutatja, hogy a felhasználók körében egyre jobban elterjed az elektronikus kereskedelem, egyre nagyobb bizalmat szentelnek az emberek a karosszékből történő vásárlásnak. Évekkel ezelőtt még a bizalom hiánya miatt kevésbé használták az emberek az internet eme funkcióját, viszont napjainkban a vásárlás egyre inkább elterjed, a bizalmatlanság csak a fizetési szokásokban jelentkezik. A vásárlók többsége a megbízható utánvételes fizetési módot választja, pedig rendelkezésre áll a bankok által biztosított portálokon keresztül bankkártyás fizetések, illetve a nemzetközi webshopok-on keresztüli vásárlás esetén az online fizetési megoldások, mint a Moneybookers, vagy a Paypal. A Szonda Ipsos és a Gfk Hungária kutatóintézetek Internet Audience Research (IAR) kutatásának 2006. októberében publikált eredményei alapján a legalább havi rendszerességgel internetezők 14%-a használja az internetet vásárlásra, a vásárlásokat megelőzően pedig 53% keres információt az interneten (akár online, akár hagyományos). A GKI által az online áruházakról készített kutatás alapján elmondható, hogy 2005-ben az internetes kiskereskedelmi forgalom 19 milliárd forint volt. Azóta ez a szám csak emelkedett, a legtöbb feltételezés szerint 2006-os forgalom 25-3

30 milliárd Ft.-ot is elérheti. A pontos értékről még nincs publikus információ. Jelenleg is tapasztalható, hogy az internetes áruházak többsége különböző kedvezményekkel próbálja meg vásárlásra buzdítani a vásárlókat. A boltok többsége 1-10%, de előfordul, hogy 20-25% kedvezményt is adnak. Nagyon sok áruház felismerte a vásárlók bizalmatlanságát a fizetési módokat illetően, ezért aki megteheti, az személyes átvételt is lehetővé tesz. Így a webáruházban csak kifejezetten a termék kikeresése és megrendelése történik, a konkrét fizetés és átvétel pedig az áruház által megadott cím(ek)en lehetséges. 3. Feladatspecifikáció A cél egy olyan általános szabályokon működő webáruház elkészítése volt számomra, amelynek feladata az ügyfelek elektronikus úton történő kiszolgálása. Minden olyan alapvető funkció biztosítása, amely egy vásárlás során megszokott és egyértelmű. Lehetőséget kellett biztosítanom az oldalon található termékek közötti böngészésre, azok bizonyos kritériumok alapján való keresésére és a kíván termék árának, egyéb adatainak feltüntetése mellett annak megvásárlására. Amennyiben vásárlásra kerül a sor, akkor a webáruházban regisztrálni kell a postázáshoz és a számlázáshoz szükséges adatokat. Ezt az alkalmazás regisztrációs oldalán található űrlap megfelelő kitöltésével lehet megtenni. A regisztráció során meghatároztam a kötelezően megadandó információkat is, ezek megadásának biztosítását mind kliens oldalon (javascript) mind szerveroldalon (PHP) biztosítani kell. Az oldalra való belépés után lehet elküldeni a vásárlási igényt. A belépés egy felhasználói név és egy jelszó megadását jelenti, amelyet a rendszer ellenőriz, majd helyes adatok esetén beléptet. A webáruház üzemeltetése szempontjából szükség van egy adminisztrátori felületre. Ez teszi lehetővé a regisztrált felhasználók adatainak ellenőrzését, azok szükség esetén történő manipulációját. Ugyanitt lehet a webáruházban található termékek adatait módosítani és új terméket regisztrálni. Ezen kívül itt lehet majd a leadott vásárlási igényeket kezelni. A végrehajtás során két felületet hoztam létre. Egyet a webáruháznak és egy másikat az adminisztrációs felületnek. Ez lehetővé teszi, a felhasználói és 4

az adminisztrációs folyamatok teljes elkülönítését. Biztonsági szempontból is előnyösebbnek látom, ha ezek a feladatok nem illeszkednek bele a felhasználói felületbe. Mind a két felületet azonos stíluselemek alkotják így az adminisztrátor számára az átjárás a két felület között nem okoz semmilyen nehézséget. A felületek főbb alkotó elemei menüelemek, tartalmi blokkok is azonos elhelyezkedéssel rendelkeznek. A vásárláshoz a regisztrációt egy regisztrációs űrlap kitöltésével és annak a felhasználó által történő továbbküldésével biztosítottam. A vásárláshoz és a számlázáshoz megadandó kötelező információk biztosítását úgynevezett kötelező mezők kitöltésével biztosítottam. Ezek megadása nélkül nem lehetséges a regisztráció és a vásárlás sem. A munkafolyamatok részfeladatokra bontásával biztosítani tudtam, hogy egy előre megtervezett tematika alapján építsem fel a fejlesztés menetét. Így láthattam, hogy mi az, ami már elkészült, és mennyi időt kell még fordítanom a hátralévő fejlesztési munka. Ez a fejlesztési projekt felépítésében és menedzselésében segített. A fejlesztési munka során előzetesen a következő alapvető feladatok tervezését tartottam szükségszerűnek: A rendszer általános működése Egy magas szintű működési folyamat felvázolása eltekintve a ténylegesen felhasznált szintaktikai elemek bemutatásától. Így láthatom a webáruház, átfogó általános szinten elvárt működési irányait, folyamatait. Adatbázis megtervezése Egy jól átgondolt és strukturált adatbázis gyors és biztos működést alapoz meg. Mivel ez a tervezett rendszer egy komoly, több táblás adatbázisra épül, ezért mondhatjuk, hogy ez a részfeladat egyike a legfontosabbaknak, amit el kellett végeznem. Megtervezni az adatbázisban használt adatok tulajdonságait, az azokat magukba foglaló táblák felépítését és a táblák közötti kapcsolatot. Felhasználói felületek megtervezése Figyelembe véve az általános írott és íratlan szabályokat, amiket egy weblaptervezéskor szem előtt tartunk, létre kell hoznom egy jól strukturált 5

átlátható, az alapkoncepciót megvalósító és kellő felhasználói élményt biztosító felületet. Ebben a fejezetben ennek a felületnek a megtervezését fogom elvégezni. Felállítom az oldalak felosztását, megtervezem a használt betűkészletet, a felületeken uralkodó színvilágot. Kódolás Az előzetes tervek alapján elkezdem a tényleges kódolást, a webáruház működését biztosító, a felhasználó és az adatbázis közötti kapcsolatot kiépítő rendszer kialakítását. Ha az előző részfeladatokat és azok céljait sikeresen meg tudtam határozni, akkor a tényleges kódolás a fejlesztési munka kisebbik részét fogja jelenteni a számomra, mivel már látható számomra az elvárt eredmény. Így célirányosan tudom végrehajtani a fejlesztést. Üzembe helyezés Az elkészült termék használni kívánt háttérrendszereken történő elhelyezésének, üzembe állításának menetét írom le. Bemutatva az eddig ilyen tevékenységekből szerzett tapasztalataimat. Tesztelés A lefejlesztett felületek teljes körű tesztelésének leírása. A teszt során kapott eredményeket összevetem a meghatározott működési elvárásokkal. Hiba esetén elvégzem a szükséges korrekció. A felsorolt részfeladatok bővebb kifejtését a dolgozat további részében írom le. 4. Tervezés 4.1. Adatbázis megtervezése Az adatbázis tervezése az első lépés volt a tényleges webes alkalmazás megvalósítása során. A folyamatot két részre különítettem el, egy elméleti tervezésre és egy fizikai leképzésre, megvalósításra. Át kellett gondolnom, hogy milyen adatokat fogok tárolni az adatbázisban, és ezek az adatok hogyan fognak kapcsolódni egymáshoz. Meghatároztam az adatokat összefogó táblázatok felépítését, a bennük található mezők jellemzőit. Nagy hangsúlyt fektettem az indexelésre is, mivel a relációban tárolt adatok gyors 6

visszakeresésében nagy szerepe van. Ezeken keresztül könnyen kikereshető a kulcsot tartalmazó fizikai sor helye és így az ott tárolt adatok gyorsan, hatékonyan kinyerhetők. Első lépésben egy tagolatlan táblát hoztam létre az alapok meghatározásához. Így fel tudtam vázolni, hogy milyen adatokra, mezőkre és értékekre lesz szükség az adatbázisban. Itt még nincs szó táblák közötti kapcsolatokról, minden adatot egyetlen tagolatlan táblába zsúfoltam bele. Ez a tárolási forma nem hatékony, így ezt a formát a későbbi modellezésem során, a harmadik normálforma eléréséig próbáltam átalakítani. Általában ez a normálforma elegendő ahhoz, hogy megszüntesse a redundanciát és rugalmas, bővíthető, jól strukturált adatbázist hozzak lére. Redundanciáról akkor beszélünk, ha valamely tényt vagy a többi adatból levezethető mennyiséget ismételten (többszörösen) tároljuk az adatbázisban. A redundancia, a szükségtelen tároló terület lefoglalása mellett, komplikált adatbázis frissítési és karbantartási műveletekhez vezet, melyek könnyen az adatbázis inkonzisztenciáját okozhatják. Egy adatbázis akkor inkonzisztens, ha egymásnak ellentmondó tényeket tartalmaz. A reláció elmélet módszereket tartalmaz a redundancia megszüntetésére az úgynevezett normál formák segítségével, azaz az adatbázis táblák normalizálásával. Ennek azért láttam szükség, hogy a későbbiekben az adatok kezelhetősége és az adattáblák kapcsolatainak átláthatósága hatékonyabb legyen. Az azonos csoportokba tartozó adatokat egy táblába soroltam, és azon táblák között ahol szükséges volt ott azonosítók alapján kapcsolatot hoztam létre. Normalizálás alatt bizonyos szabályok alkalmazását értjük, melyek nagyban megkönnyítik majd számunkra az adatbázisaink fenntartását. A normalizálás voltaképpen az adatbázisok szervezésének egy módja, melynek célja, hogy a táblák mindig a megfelelő kapcsolatba kerüljenek egymással. Első normálforma szabályai - A táblák nem tartalmazhatnak ismétlődő csoportokat - A különböző fogalmakkal kapcsolatos adatokat külön táblákba kell elhelyezni Második normálforma szabályai 7

- A nem-kulcs attribútumok nem függhetnek egyetlen elsődleges kulcs valódi részhalmazától sem Harmadik normálforma szabályai - Egyetlen attribútum sem függhet más nem-kulcs attribútumoktól Ez a tervezésben annyit jelentett, hogy addig bontottam részeire az adatokat, amíg azok kezelhető, jól bővíthető és stabilan működő rendszert hoztak létre. Amint elkészült az előzetes adatmodell akkor átnéztem az alkalmazás leendő felhasználójának a szemszögéből is. Ezen a ponton kellett meghatározni az üzleti logikát és azt is meg kellett vizsgálni, hogy az adatmodell eleget tesz-e az üzleti logika által megszabott követelményeknek. A relációs adatbázisok esetében a logikai tervezés során a relációk már elnyerhetik végleges alakjukat, melyeket egyszerűen leképezhetünk az adatbázis kezelőben. A fizikai tervezés során inkább arra koncentráltam, hogy a logikai szerkezet mennyire felel meg a hatékony végrehajtás feltételeinek, illetve milyen indexeket rendeljek az egyes relációkhoz. A relációkon végrehajtott műveletegyüttest tranzakciónak nevezik és általában a tranzakciók gyors végrehajtását kívánjuk elérni vele. 8

Az adatbázis táblái Az OnLine Shop adatbázis jelen állapotában 10db táblát tartalmaz. A FELHASZNÁLÓK tábla tartalma: azon: A felhasználó azonosítója (auto increment) vezeteknev: A felhasználó vezetékneve keresztnev: A felhasználó keresztneve Email: A felhasználó e-mail címe cegnev: Céges regisztráció esetén cégnév jelszo: A felhasználó jelszava telefonszam: A felhasználó telefonszáma cimorszag: A felhasználó postázási címe (Ország) cimváros: A felhasználó postázási címe (Város) cimkozterulet: A felhasználó postázási címe (Közterület) cimhazszam: A felhasználó postázási címe (Házszám) cimiranyitoszam A felhasználó postázási címe (Irányítószám) szamlacimorszag A felhasználó számlázási címe (Ország) szamlacimvaros A felhasználó számlázási címe (Város) szamlacimkozterulet A felhasználó számlázási címe (Közterület) szamlacimhazszam A felhasználó számlázási címe (Házszám) szamlacimiranyitoszam A felhasználó számlázási címe (Irányítószám) Datum A regisztráció dátuma Ez a tábla a webáruházba látogató és ott regisztrációt végrehajtó felhasználók adatait tárolja. Ezen adatok alapján történik meg az oldalra való belépés és a vásárlás során a termék postázása a felhasználó felé, illetve a számlázás. Szintén ezen adatok alapján lehet felvenni a kapcsolatot a felhasználóval. Fontosnak tartottam a postai és a számlázási adatok külön tárolását, hiszen ezek eltérhetnek egymástól. Így nagyobb rugalmasságot ad a felhasználó felé. 9

FELHASZNÁLÓK tábla: Oszlopnév Oszloptípus Hossz Azon INTEGER 11 vezeteknev VARCHAR 75 keresztnev VARCHAR 75 Email VARCHAR 155 cegnev VARCHAR 255 Jelszo VARCHAR 55 telefonszam INTEGER 11 cimorszag VARCHAR 45 cimvaros VARCHAR 55 cimkozterulet VARCHAR 45 cimhazszam INTEGER 3 cimiranyitoszam INTEGER 4 szamlacimorszag VARCHAR 45 szamlacimvaros VARCHAR 55 szamlacimkozterulet VARCHAR 45 szamlacimhazszam INTEGER 3 szamlacimiranyitoszam INTEGER 4 Datum DATETIME 19 ADMINFELHASZNALOK tábla tartalma: azon: Adminisztrátor azonosító felhasználóinev: Az adminisztrátor felhasználói neve jelszo: Az adminisztrátor jelszava rogzitesdatuma: A regisztráció dátuma Ebben a táblában szerepeltetem azokat a felhasználókat, akik az adminisztrációs felületre beléphetnek. Itt találhatók a belépéshez szükséges adatok, felhasználói név, jelszó és a regisztráció dátuma. 10

ADMINFELHASZNALOK tábla: Oszlopnév Oszloptípus Hossz Azon INTEGER 2 felhasznaloinev VARCHAR 55 Jelszo VARCHAR 55 rogzitesdatuma DATETIME 19 TERMEKTIPUS tábla tartalma: azon: A terméktípus azonosítója nev: A termektípus neve datum: A terméktípus rögzítésének dátuma Ebben a táblában találhatók a termékkategóriák. Ezek segítségével tudom csoportokba rendezni a termékeket (mobiltelefon, headset, akkumlátor stb.) így azokat könnyebben meg lehet találni a felületen. Ezek segítségével akár többféle termék is regisztrálható az oldalon, kellő dinamizmust adva ezzel az alkalmazásnak. TERMEKTIPUS tábla: Oszlopnév Oszloptípus Hossz Azon INTEGER 2 Nev VARCHAR 95 Datum DATE 10 11

TERMEK tábla tartalma: azon: A termék azonosítója Gyartó: A termék gyártójának a neve tipus: A termék típusszáma termektipus: A terméktipus táblában található terméktípus azonosító kep: A termék képét tartalmazó file címe (URL) ar: A termék ára datum: A regisztráció dátuma saleeffectivedate: A termék eladhatóságának a kezdete saleexpirationdate: A termék eladhatóságának a vége Akciós: Egy indikátor ami megjelöli, hogy akciós-e a termék vagy sem A táblában a webáruházban található regisztrált termékek vannak eltárolva. Itt található a gyártójuk, típusuk, áruk és rögzítési dátumuk is. Ezen kívül még két dátum is szerepel itt, ami az eladhatóságot szabályozza. Ennek azért láttam szükségét, mert így egy már létező termék megszüntetése esetén is tovább tárolhatóak annak adatai, és szükség esetén az eladhatóság manipulálásával ismét aktiválható kikerülve az ismételt regisztrációt. TERMEK tábla: Oszlopnév Oszloptípus Hossz Azon INTEGER 5 Gyarto VARCHAR 55 Tipus VARCHAR 155 termektipus INTEGER 2 Kep VARCHAR 155 Ar INTEGER 11 Datum DATE 10 saleeffectivedate DATE 10 12

saleexpirationdate DATE 10 Akcios INTEGER 1 TERMEKTULAJDONSAG tábla tartalma: termekazon: A TERMEK táblában található termékek azonosítója rendszer900: Indikátor, a termék adott szolgáltatását jelzi (900MHz) rendszer1800: Indikátor, a termék adott szolgáltatását jelzi (1800MHz) rendszer1900: Indikátor, a termék adott szolgáltatását jelzi (1900MHz) meret: A termék méretét jelzi (100x48x19.5) akkumlator: A termék default akkumlátorának mérete (750 mah Li-Pol) Kijelzo: A termék kijelzőjének mérete, ha van (262000/176x220) naptar: Indikátor, a termék adott szolgáltatását jelzi (naptár) infra: Indikátor, a termék adott szolgáltatását jelzi (Infraport) bluethooth: Indikátor, a termék adott szolgáltatását jelzi (bluethooth) wap: Indikátor, a termék adott szolgáltatását jelzi (WAP) mms: Indikátor, a termék adott szolgáltatását jelzi (MMS küldés) gprs: Indikátor, a termék adott szolgáltatását jelzi (GPRS) 3g: Indikátor, a termék adott szolgáltatását jelzi (3G) edge: Indikátor, a termék adott szolgáltatását jelzi (EDGE) Kamera: A terméken található kamera felbontása, ha van (640x480) datum: A terméktulajdonságok regisztrálásának dátuma A táblában találhatók a termékekhez tartozó általános tulajdonságok, technikai paraméterek. A TERMEK táblában szereplő azon nevű termékazonosító alapján hivatkoztam a TERMEK táblára és az ott azonosított termékekhez rendelt tulajdonságokra. Olyan adatok tárolását terveztem itt, amelyek segítségével egy körülbelüli képet kaphatunk a kiválasztott termék szolgáltatásairól, fizikai paramétereikről, mint a méret, vagy a kijelző felbontása. 13

TERMEKTULAJDONSAG tábla: Oszlopnév Oszloptípus Hossz termekazon INTEGER 5 rendszer900 INTEGER 1 rendszer1800 INTEGER 1 rendszer1900 INTEGER 1 Meret VARCHAR 15 akkumlator VARCHAR 18 Kijelzo VARCHAR 25 Naptar INTEGER 1 Infra INTEGER 1 bluethooth INTEGER 1 Wap INTEGER 1 mms INTEGER 1 Gprs INTEGER 1 3g INTEGER 1 Edge INTEGER 1 Kamera VARCHAR 12 Datum DATETIME 19 HÍRLEVÉL tábla tartalma: hirlevelazon: Egy alap érték a hírlevél funkcióhoz felhasznaloazon: A regisztrált felhasználók azonosítója A tábla azon felhasználók azonosítóját tartalmazza, akik feliratkoztak a webáruház regisztrációs folyamata során a hírlevél szolgáltatásra. Így egyértelműen látható az alkalmazást üzemeltető számára, hogy kinek kell elküldeni az aktuális hírlevelet. 14

HIRLEVEL tábla: Oszlopnév Oszloptípus Hossz hirlevelazon INTEGER 3 felhasznaloazon INTEGER 11 BEVÁSÁRLO_KOCSI tábla tartalma: Session_id A munkamenet azonosító Termek_azon A TERMEK táblában található termékazonosító a kiválasztott termék egyértelmű azonosításához Termek_ar A TERMEK táblában található termékazonosítóhoz tartozó ár. A lehetséges árváltozások miatt fontos itt is szerepeltetni a termék megvásárláskor aktuális árát. mennyiseg A megadott termékazonosító alatt található termék megvásárolni kívánt darabszáma Datum A termék kosárba tételének dátuma Ebben a táblában találhatók a webáruházban kiválasztott és jövőbeni megvásárlásra a kosárba helyezett termékek. Az adott termék árát itt is eltároltam, így az esetleges termékárakban történő változások során is jól nyomon követhető, hogy az adott termék milyen áron vásárolták meg, elkerülve így az esetleges reklamációkat. BEVASARLO_KOCSI tábla: Oszlopnév Oszloptípus Hossz Session_id VARCHAR 155 Termek_azon INTEGER 11 Termek_ar INTEGER 11 mennyiseg INTEGER 2 Datum DATETIME 19 15

REDELES_STATUSZ tábla tartalma: azon: A rendelés státusz azonosítója nev: A rendelés státusz neve datum: A státusz regisztrálásának dátuma Ebben a táblában található a rendelésekhez kapcsolt rendelési státusz. Ezzel különíthetők el az új és a folyamatban lévő rendelések illetve azok, amelyek már teljesítve lettek. RENDELES_STATUSZ tábla: Oszlopnév Oszloptípus Hossz Azon INTEGER 1 Nev VARCHAR 15 Datum DATETIME 19 RENDELES tábla tartalma: azon: A megrendelés azonosítója felhasznalo_azon: A megrendelést leadó felhasználó azonosítója Statusz: A megrendelés státusza datum: A megrendelés dátuma A tábla a ténylegesen megrendelés után a megrendelő, felhasználó azonosítóját, a megrendelés státuszát és a megrendelés dátumát tartalmazza. RENDELES tábla: Oszlopnév Oszloptípus Hossz Azon INTEGER 11 felhasznalo_azon INTEGER 11 Statusz INTEGER 1 Datum DATETIME 19 16

RENDELES_TERMEK tábla tartalma: rendeles_azon: A rendelés azonosítója a RENDELES táblából Termek_azon: A megrendelt termék azonosítója a TERMEK táblából Termek_ar: A termek ára amit éppen a megrendelés pillanatában tartalmazott a TERMEK tábla a megadott termékazonosító alatt mennyiseg: Megrendelt mennyiség A tábla a RENDELES tábla kiegészítése, ahhoz kapcsolódik a rendelés azonosítóján keresztül. Tartalmazza a megrendelt termékek azonosítóját, azok árát és a megrendelt mennyiséget. Az termek árat a fent említett indokok miatt itt is eltároltam. (bevásáró_kosár) RENDELES_TERMEK tábla: Oszlopnév Oszloptípus Hossz rendeles_azon INTEGER 11 Termek_azon INTEGER 5 Termek_ar INTEGER 11 mennyiseg INTEGER 2 A fizikai megvalósításhoz a MySQL adatbázis szerverét használtam fel. Ez egy többfelhasználós, többszálú, SQL-alapú relációs adatbázis-kezelő szerver. A szoftver fejlesztője a svéd MySQL AB cég, amely kettős licenceléssel teszi elérhetővé a MySQL-t; választható módon vagy a GPL, vagy egy kereskedelmi licenc érvényes a felhasználásra. Az MySQL az egyik legelterjedtebb adatbázis kezelő, aminek egyik oka lehet, hogy a teljesen nyílt forráskódú LAMP (Linux Apache MySQL PHP) összeállítás részeként költség hatékony és egyszerűen beállítható megoldást ad dinamikus webhelyek szolgáltatására. A MySQL adatbázisok adminisztrációjára a mellékelt parancssori eszközöket (mysql és mysqladmin) használhatjuk. A 17

fejlesztés során én az EMS adatbázis kezelő felületét használtam és a phpmyadmin programot, de MySQL honlapjáról grafikus felületű adminisztráló eszközök is letölthetők: MySQL Administrator és MySQL Query Browser. A saját gépen történő fejlesztéshez én az EMS felületét találtam a leghasznosabbnak. Egy jól átlátható és gyorsan működő rendszerről van szó, amellyel tökéletesen épül a MySQL szervere fölé. 4.2. Felülettervezés Az alkalmazás fejlesztése során az adatbázisban tárolt adatok megjelenítése, azok rendezett, jól átlátható felületen való továbbítása a felhasználó felé újabb tervezési feladatot jelentett. Egy egységes felület megalkotását tűztem ki célul, szem előtt tartva a webes szabványokat. A szabványok követése lehetővé teszi, hogy az oldal a böngészők nagy részén ugyanolyan megjelenéssel, elvárt működéssel fusson. A böngészők jövőbeni változatain is stabil működő rendszerre számíthatunk. 4.2.1. A tervezésben használt technikák A HTML (Hyper Text Markup Language) nyelv helyett már az XHTML (extensible Hyper Text Markup Language) nyelvet használtam fel a tartalom megszerkesztésénél. Ez egy kiterjeszthető HTML nyelv. A jelölőnyelv az XML (extendible Markup Language) egy alkalmazása, vagyis XML eszközökkel is feldolgozható. A fejlesztés során nagy segítség, ha a tartalom egyértelműen megmutatkozik, látható hol kezdődik, és hol végződik az adott tartalmi rész. Ezt használva egy jól áttekinthető tartalmi vázat tudtam alkotni, nem több ráfordított idővel mintha nem vettem volna figyelembe a szabványokat. Érdemes megemlíteni az XHTML jelölőnyelv alapvető szabályait: XHTML: különleges követelményei Minden kezdőcímkének kötelezően kell egy lezáró párjának is lennie Különleges DOCTYPE meghatározására van szükség 18

Minden elemet, jellemzőt és értéket kisbetűvel kell írni Minden értéket idézőjelben kell megadni, ami lehet egyes (angolos) vagy kettes (normál) Minden jellemzőnek egyértelműen meg kell adni az értékét A XHTML tag-jei segítségével leírható a webes tartalom. Az így leírt tartalmat a böngészők már képesek megjeleníteni. Így kaptam egy vázat, amit aztán később a megrendelő igényei szerint tudok megjeleníteni, formázni. A megjelenítés a böngészők sajátossága lesz alapesetben, mivel nem szabtam meg, hogy mely tag-ek milyen formában és hol jelenhetnek meg az oldalon. Erre szolgál a CSS (Cascading Style Sheets) azaz stíluslapok, amelyek meghatározzák a tényleges megjelenést. A mai böngészők mindegyike támogatja a CSS-t, de kisebb eltérések azért vannak az egyes böngészők között. Ezért, mivel a szabványokat szerettem volna követni és egy jól strukturált rendszer fejlesztése a cél a CSS használatával valósítottam meg a tartalom formába öntését. Általában külön állományban tároljuk a stíluslapokat css kiterjesztéssel, így én is ezt tettem. Így, ha a stílusleíró kódot külön helyezem el a tartalomtól leválasztva gyorsabb betöltési idővel számolhatok. A CSS stílusok segítségével akár eltérő megjelenítést is biztosíthatok a tartalomnak. Egy HTML tag többféle stílusleíró szabályt is kaphat, attól függetlenül, hogy hol helyezkedik el a dokumentum felépítésében. A stílusok a következő sorrendben fognak érvényesülni prioritási sorrend szerint növekvően: CSS: stílusok szabályainak rangsora A böngésző alapbeállítása Külső stíluslap Beágyazott stílus Szövegközi stílus 19

Az alapszintaktika három elemet különböztet meg: kiválasztó, tulajdonság, érték. Pl.:( kiválasztó { tulajdonság: érték } ). A megjeleníteni kívánt elemre többféle módon hivatkozhatunk, használhatunk többféle kijelölőt. Kiválaszthatjuk a megjelenítendő tag-et, kiválasztót és adhatunk neki egy stílust. Ezen kívül választhatjuk még a következőket: Felsorolás Egyszerre akár több kiválasztóra is érvényesíthetjük a formázást. Ekkor a kiválasztókat egymás után vesszővel elválasztva kell felsorolni. h1, h2, h3, h4 {color: green;} Osztály kiválasztó Ennek segítségével más-más módon tudjuk megjeleníteni az egyes osztályokba sorolt elemek tartalmát. Ezt a class kulcsszó használatával érhetjük el. p.right {text-align: right} p.left {text-align: left} Azonosító alapú szétválasztás A HTML elemeknek megadhatunk egy id tulajdonságot. Így az egyedi id-vel rendelkező elemekhez speciális formázást határozhatunk meg. CSS-ben a # segítségével tudunk elemet id segítségével kiválasztani. A következő példa a kiemel elemet fogja azonosítani: #kiemel {color: red;} Ezek használatával jól elkülöníthető blokkokra tudtam osztani a tartalmi részeket, így azok megjelenítése egyértelművé, a kódban is jól kivehetővé vált. A CSS további mélyebb áttekintésére a dolgozat keretein belül nincs lehetőség, de rengeteg kiadvány, könyv és internetes portál segít eligazodni a CSS világában. 20

Az alkalmazást két jól elkülöníthető felületre osztotam, egy felhasználói felületre és egy adminisztrátori felületre. Mind a két esetben hasonló felépítésre és stílusra törekedtem, de a tartalmak tekintetében eltérnek egymástól. Mind a két esetben a fent említett szabványokat és nyelveket használtam fel a megvalósításhoz. Nagy segítséget jelentett a fejlesztésben a FIREFOX egy beépülő modulja a Web Developer, amely egy speciális felületet és rengeteg lehetőséget biztosít a webfejlesztéshez. Ez a tool ingyenesen letölthető a mozilla Firefox Add-ons oldaláról és telepítés után azonnal hozzáférhetők az újonnan szerzett szolgáltatások (https://addons.mozilla.org/firefox/60/). Az első igazán nagy segítséget a CSS szabályainak, használatának a megértése terén nyújtotta. A CSS menü alatt lehetőség van az éppen aktuális oldal stíluslapjának a megtekintésére View CSS. Így látható, hogy az oldal mögött milyen megoldásokat alkalmazott a fejlesztő. A menüpontban az Edit CSS egy szerkesztőfelület ahol élőben szerkeszthető és a képernyőn azonnal látható a stíluslapban történt változás. Ennek köszönhetően sokkal gördülékenyebb volt a felületek tervezése, fejlesztése. Az alkalmazott CSS szabályokat azonnal át tudtam vinni a tényleges css file-ba így a tervezett oldal megjelenése már egy jól megtervezett stíluslap eredménye volt. Mind a két felület (felhasználói és admin) bővelkedik űrlapokban. Egy jó és szabványos űrlap készítése nehéz feladat, amiben a fenti tool egy másik szolgáltatása segített nekem, amely a Forms menüpont alatt található. Itt a Display Form Details funkcióval azonnal meg tudtam jeleníteni a weblapon található form-ok tulajdonságait, attribútumait. A View From Information az oldalon található űrlapok tulajdonságait egy külön felületre szedve táblázatos formában is meg tudja jeleníteni kiemelve ezeket a grafikus tartalomból, nagy segítséget biztosítva a fejlesztéshez. Ezek használatával már már otthonosan mozogtam a tervezett felületen, de az igazi nagy segítség az Outline menü alatt volt elrejtve. Az itt található kis alkalmazások arra szolgálnak, hogy segítségükkel behatárolhassuk a különböző blokk és egyéb elemek határait. 21