Programozás | Webdizájn » Tarcsi-Horváth-Menyhárt - Webes alkalmazások tervezése

Elméleti áttekintés Webes alkalmazások tervezése (Web adatbázis programozás) Tarcsi Ádám, Horváth Győző, Menyhárt László 2012 Követelmények  Folyamatos teljesítés  névsor  Beadandó feladat ▪ tervezés  megvalósítás ▪ PHP v. Java v ASPNET  Feladatok: http://ade.webeltehu/oktatas/webengineering/  Határidő: 2 Bevezetés - témafelvetés  Minden az Internetre megy, minden web-es (lesz). ▪ kommunikációs, ▪ megjelenítési platform          Trendek: offline web, mobil eszközök, HTML5 Web site vs. Web alkalmazás Natív vs. mobil alkalmazások Webtechnológia (Web engineering) vs. szoftvertechnológia Webes architektúra KKV vs. nagyvállalati környezet Gépi, emberi résztvevők Oktatási megközelítés, elvárt ismeretek Problémák, nehézségek 3 Trendek  Szabványosítás: HTML5 (2014!)  Asztali funkcionalitás + offline web alkalmazások (HTML5)  Internet of Things 

Cloud computing  Mobilitás: Gartner előrejelzése szerint 2015-ben a jelenlegi natív alkalmazások fele már web alapú applikáció lesz.  Kontextus alapú alkalmazások + Augmented Reality  Üzleti social networking alkalmazások erősödése  Big Data: In-memory computing + nagy mennyiségű adatok feldolgozása (évente 3 terabájtnyi adatot gyártunk fejenként) 4 Internet of things Forrás: http://www.bitporthu/megoldasok/joevokep-mi-az-a-dolgok-internete-infografika 5 Gartner Hype Cycle for ET 2011 6 Gartner Hype Cycle for Networking and Communication 2011 7 Web 1.0, 15, 20, 30,  Web 1.0: 1990: Tim Berners Lee ▪ Statikus weblapok ▪ Jellemzőjük: ritka frissítési idő  Web 1.5: ▪ Dinamikus weblapok ▪ Grafikai fejlődés ▪ Üzlet megjelenik a web-en  Web 2.0: A felhasználó az úr!  Web 3.0: Web-es munkakörnyezet (operációs rendszer) 8 Web 1.0  Web 2.0 Statikus albumok, foto Flickr, Picasa Mp3.com

Napster Britannica Online Wikipedia Személyes honlapok Bloggolás Domainnév spekulációk Keresőre optimalizálás Lapletöltés: DoubleClick Klikkenkénti fizetés:AdSense Publikálás Részvétel Tartalomkezelő rendszerek Wiki Könyvtárak (osztályozás) Címkézés Szoftver (webes) szolgáltatás Lokális adattárolás Adattárolás a web-en, megosztás Telepítés Regisztráció Küldés (e-mail, link, stb.) Megosztás, közös munka Néző Résztvevő Netscape Google 9 Web-site vs. web alkalmazás Web-site Web alkalmazás Statikus / dinamikus Statikus vagy „statikusszerű” Dinamikus Adatbázis Nem szükséges / nem jellemző Jellemző Asztali alkalmazás Nem implementálható asztali alkalmazásként Rendelkezik asztali alkalmazásokhoz hasonló funkcionalitásokkal Authorizáció Nem jellemző Jellemző Bookmarking / keresőmotor Jellemző Nem működik. Keresőmotorok számára irreleváns. Szerver oldali logika Nem

jellemző Mindig Kliens oldali logika Nem szükséges / nem jellemző Jellemző Példa Híroldalak, wiki Google Mail 10 Web 2.0, 30, X0 - 1 11 Web 2.0, 30, X0 - 2 12 Web 2.0, 30, X0 13 Web 3.0 ▪ ▪ ▪ ▪ ▪ ▪ Szemantikus Web Virtuális munkaasztal böngészőn keresztül Elosztott alkalmazások Cloud computing Elérés minden eszközről (mobil) „Okos” eszközök – okos keresők, melyek értik a beírt adatokat 14 Bevezetés, témafelvetés, előzmények           Hálózati, szerver és kliens oldali megoldások (TCP/IP és HTTP protokoll és működése)  Számítógépes hálózatok WEB-es prezentációs megoldások (HTML nyelv, CSS), web-grafika  Web-fejlesztés I. és Honlapok funkcionális és arculati tervezése (Honlapszerkesztés) WEB szerverek, böngészők, kliens oldali WEB programozás alapjai (pl. JavaScript)  Web-fejlesztés II., Web-technológia I (Web-programozás I)

Adatbázis-kezelés (a relációs modell, adatmodellezés, SQL)  Adatbázis-kezelés Rendszerek közti adatkommunikáció „önleíró” dokumentum nyelven = XML (XML felépítése, használata, kapcsolódó technológiák érintőlegesen: DTD, XSD, XSL ill. XSLT)  Adatkezelés – XML és Web adatbázis programozás XML alapú adatbázisok (XML adattárolás alapjai, lekérdező nyelvek: XPath, XQuery)  Adatkezelés – XML és Web adatbázis programozás Multimédiás adatbázisok (nagy méretű multimédiás anyagok tárolása adatbázisokban, visszakeresés, hatékonyság)  Web adatbázis programozás Programozási módszertan  Programozás tárgyak WEB programozás (módszerek, beágyazott script-nyelvek általában, PHP részletesen)  Web-fejlesztés II, Web-technológia I. (Web-programozás I) Vállalati környezetre tervezett webes fejlesztői környezetek (pl.: Net, Java)  Web-technológia II-III. (Web-programozás II), Programozási nyelvek (Java),

Portálfejlesztés 15 Bevezetés, témafelvetés, előzmények      Multimédiás WEB programozás – bináris tartalmak (stream-ek, header, letöltés, feltöltés)  Web adatbázis programozás Multimédiás WEB programozás – vektorgrafikus és programozott tartalmak (SVG, Flash)  Web-animáció és Web adatbázis programozás Informatikai biztonság (adatvédelem, kommunikációs vonalak védelme, védelem illetéktelen behatolásokkal szemben, meghibásodások elleni védelem)  Számítógépes hálózatok, Web adatbázis programozás Többrétegű (összetett) webes alkalmazások fejlesztése  Web adatbázis programozás Web-gazdaságtan, web marketing,.  Honlapok funkcionális és arculati tervezése (Honlapszerkesztés), Web-marketing 16 Egy másik szemszögből  Web dizájn  Website building: követelménylistából valid HTML és CSS sablon készítése  Létező template felhasználása  Kereshető oldalak,

információk készítésének elve (SEO).  Akadálymentes weboldalak készítése (WCAG).  Kliens oldali webprogramozás: pl.:Javascript, diszkrét JavaScript  Szerver oldali webprogramozás: PHP, Java, .NET, stb  Adatvezérelt, többrétegű alkalmazások tervezése, készítése, tesztelése, kiadása, karbantartása.  Képesnek kell lenni dönteni a különböző lehetőségek, technológiák közül egy adott feladat megoldására - azaz a feladat komplexitásától, méretétől függően tudjon választani technológia és nyelv között.  Többnyelvű, komplex alkalmazások készítésének alapjai  Web Project Management.  Web Engineering szemléletmód.  Web marketing alapjai.  A webalkalmazások biztonsági aspektusai. Feladatkörök  Szervezői, tervezői feladatok: rendszerszervezés, projektvezetés, marketing, stb.  Web-fejlesztés: kilens, szerver oldalon  Web-design  Adatbázis: adminisztráció, fejlesztés 

Üzemeltetés 18 Oktatási keretrendszer az ELTE IK-n  Alapozó kurzusok a BSc-n ▪ Web-fejlesztés I. ▪ Web-fejlesztés II.  Web-programozás modul az MSc-n ▪ ▪ ▪ ▪ ▪ ▪ ▪ Honlapok funkcionális és arculati tervezése Web grafika Web-technológia I. (PHP) Web-technológia II. (ASPNET) Web-technológia III. (Java) Portálfejlesztés Webes alkalmazások tervezése  Szabadon választható webes kurzusok MSc-n, más szakirányon ▪ Webanimációk programozása ▪ Web-marketing ▪ Webtechnológiák információs rendszerekben (SOA) Mi hiányzik még?  Számos témakör hiányzik még, illetve kifejtendő: ▪ ▪ ▪ ▪ ▪ ▪ ▪ Kliens-oldali webfejelesztés, Biztonság, Karbantartás, Webes projektmendzsment Cloud computing Szemantikus web, web mining Web of Science Tematika Óra Gyakorlat 1. Óramegbeszélés, a félév ismertetése. Általános bevezető Többrétegű architektúrák Web-es technológiák: PHP, JSP, JAVA, ASP.NET

(NET), stb Web-es alkalmazásfejlesztés módszertana Webes keretrendszerek, keretrendszer vs tartalomkezelő rendszerek, Modell-View-Controller modell. JavaScript keretrendszerek, AJAX, Web 20 és hatása 2. 3. Webes alkalmazások tervezése, tervezési eszközök Fejlesztői környezet kialakítása, fejlesztőeszközök. 4. Adatbázisok elérése szerver oldalról. Adatbiztonság a gyakorlatban Dinamikus multimédiás tartalom (adatbázis, header, stb, dinamikus Flash). 5. 6. 7. 8. Alkalmazások funkcionális strukturálása - útban MVC felé. PHP, Java keretrendszerek “Mini” MVC keretrendszer megvalósítása. BLOB kezelés Egy professzionális keretrendszer megismerése. A példaalkalmazás elkészítése a keretrendszerben I. Egyebek: authorizáció, authentikáció, sablonkezelés, PDO, adatbázis-hatékonyság, stb. A példaalkalmazás elkészítése a keretrendszerben II. 9. Kliensoldali funkciók. JavaScript keretrendszerek, JQuery AJAX Rich Internet

Applications 10. Webes API-k programozása, felhasználása. Kliensoldali API: Google Maps, Szerveroldali API: Picasa 11. Web Servicek felhasználása, készítése Szolgáltatás Orientált Architektúrák a gyakorlatban Multimédiás adatbázisok, Tartalom alapú visszakeresés elmélete. Az Oracle megoldása: Oracle 12. Multimédia Többrétegű adatbázis-modell. 13. Web Servicek, Szolgáltatás Orientált Architektúra (SOA), Cloud computing, Szemantikus Web 21 Architektúrák – „Evolúció” 22 Egygépes (standalone) alkalmazások Kliens gép Kliens gép Kliens gép Program Program Program Adatok (fájlok) Adatok (fájlok) Adatok (fájlok)  A program teljes egészében a munkaállomáson fut.  Az adatok ugyanitt tárolódnak.  Egyszerre csak egy felhasználó használhatja.  Semmilyen hálózati kapcsolat nincs, a különálló programok közti adatszinkronizáció meglehetősen nehézkes. 23 Egyszerű kliens-szerver alkalmazások 1.

• Egy vagy több szerver gép erőforrásait (jellemzően adatait) megosztja a kliensek között. Jobb esetben online • Az alkalmazás egy része (adatbázis-kezelő rsz.) a szerven fut. • Az alkalmazás logikát implementáló rész a kliens gépeken fut. „vastag kliens rendszerek” • Egy adatbázist többféle kliens program is használhat. • Egyszerre több konkurrens felhasználó használhatja. Kliens gép Program Szerver Intranet RDBMS Kliens gép Program 24 Egyszerű kliens-szerver alkalmazások 2. • Jellemzően intranet-es alkalmazásoknál használatos. • Terheli a kliens gép erőforrásait. • Gyakran mindenféle driver-ek telepítését igényli a kliens gépeken • Verziófrissítés alkalmával az összes kliens-en frissíteni kell a programot. • A RAD (Rapid Application Development) sok eszközzel támogatott, számos jó vizuális fejlesztőkörnyezet: gyorsan „összekattintgathatunk” és leprogramozhatunk komoly alkalmazásokat. Kliens

gép Program Szerver Intranet RDBMS Kliens gép Program 25 Többrétegű (multitier) hálózati alkalmazások  Minimálisan három réteg létezik: ▪ Front End = kliens oldali felhasználói réteg (általában egy WEB böngészőben) ▪ Middleware = szerver oldali prezentációs és logikai réteg (általában egy WEB szerveren beágyazott script-ekben összeolvasztva a megjelenítés és az egyszerűbb logika) ▪ Back End = hátsó szerver oldali nagykapacitású tároló (adatbázis szerver) vagy számoló réteg 26 Háromrétegű architektúra Front End Middleware Viselkedés JavaScript Megjelnítés CSS Tartalom HTML / XML Kliens: Web böngésző Kliens: Mobil böngésző / mobil kliens Back End Adatbázis szerver RDBMS Web szerver Internet Alkalmazás szerver Adatbázis szerver XML DBMS Nagy kapacitású, összetett számításokat végző szerver Többrétegű architektúra Middleware Front End Prezentációs Layer Viselkedés JavaScript

Internet Kliens: Mobil böngésző / mobil kliens Logikai Layer Prezentációs szerver Alkalmazás szerver Web szerver Prezentációs szerver Adatbázis szerver RDBMS Web szerver Load Balancer Megjelnítés CSS Tartalom HTML / XML Kliens: Web böngésző Back End Alkalmazás szerver Adatbázis szerver XML DBMS Nagy kapacitású, összetett számításokat végző szerver A kliens oldal Tartalom index.html Megjelenítés style.css Viselkedés jsframework.js custom.js Többrétegű architektúra jellemzői  Load balancing, terhelésmegosztás.  Tervezést támogató környezetek: Java J2EE, .Net  Architektúra felosztás-összevonás logikai szinten.  A rendszer logikai architektúrája (tervezés, programozás) független a számítógépes megvalósítástól, hálózattól.  A logikai réteg tovább osztható.  Nagyon sok konkurens felhasználó kiszolgálására optimalizálva 30 Többrétegű architektúra jellemzői  Kliens gép:

böngésző, a logika – többnyire – a szerveren található – vékony kliens architektúra  Minimális logika a klienseken: a beviteli adatok validálására, a lapok speciális megjelenítésére (pl. JavaScript)  A szerveren elkülönül az adattárolás, a logika és a prezentáció  eltérő szerepkörök  Az egyes szintek önmagukban is tesztelhetőek.  A rendszer egyes komponensei több célra 31 vagy újra felhasználhatók. Többrétegű architektúra jellemzői  A vékony kliensek miatt nagyon gyenge kliens gépek is elegendők.  A technológia platformfüggetlen.  A kliensekre nem kell drivert telepíteni.  A verziófrissítés csak a szervert érinti, a klienseket nem.  Sajnos egyelőre elég kevés eszköz támogatja a RAD-ot (Rapid Application Development), a környezet kevés segítséget nyújt a programozónak a megoldási lehetőségek kiválasztásában ▪  „Házi szabványok”, saját keretrendszerek készülnek. 

Nehezebb tesztelni 32 Web-es architektúra Middleware Front End Prezentációs Layer Viselkedés JavaScript Internet Kliens: Mobil böngésző / mobil kliens Logikai Layer Prezentációs szerver Alkalmazás szerver Web szerver Prezentációs szerver Adatbázis szerver RDBMS Web szerver Load Balancer Megjelnítés CSS Tartalom HTML / XML Kliens: Web böngésző Back End Alkalmazás szerver Adatbázis szerver XML DBMS Nagy kapacitású, összetett számításokat végző szerver Web-es architektúra  SOA Middleware Front End WS Prezentációs szerver WS WS Kliens: Mobil böngésző / mobil kliens ESB + Orchestratio n+ Adatbázis szerver Web szolgáltatás (alkalmazási logika) WS Internet Web szerver Load Balancer Viselkedés JavaScript Megjelnítés CSS Tartalom HTML / XML Prezentációs SOA Layer Layer WS Kliens: Web böngésző Back End / Persistence Layer Egyéb erőforrások, legacy systems (ERP, CRM, stb). Web szerver Prezentációs

szerver SOA: háttér rendszerekből  Business Objects (resources), WS + Human task + Business Rule. Üzleti folyamatok által irányítva Fejlesztői - megrendelői „evolúció” 35 Fejlesztői evolúció 1. szint – Kezdeti ▪ Fejlesztő oldaláról · · · · · · · · · Legtöbb web programozó, HTML-t "írók". Statikus web lapok WYSIWG szerkesztők, szövegszerkesztők Nem használnak mintákat, sablonokat Nem használnak fejlesztést segítő eszközöket Tesztelés hiányzik vagy kezdetleges Nem jellemző a program logika Kis csapat, kezdetleges oldalak Nincsenek elkülönült szerepek · · · · · Elsődleges cél a jelenlét az Interneten Kevés, ritkán változó tartalom Csak egy ún. elektronikus prospektus oldalt várnak el Kevés visszatérő látogató (ha van egyáltalán) Nincs web-es stratégia, vagy cél ▪ Megrendelő szempontjából 36 Fejlesztői evolúció 2. szint – Ismételhető ▪ Fejlesztői oldalról · A

hagyományos web programozást segítő tananyagok, könyvek segítségével ezt a szintet lehet elérni · Tapasztalat útján, sok megrendelést követően juthat el ide a cég  a fejlesztő cég mérete növekedik · Elkezdenek újrafelhasználható komponenseket, sablonokat használni · Dinamikus weblapok megjelenése, kezdetleges program logikábal.  A növekvő megrendelési igények miatt is · Típus hiba: kísérletező fejlesztő, a legújabb technológiákat használja a "szép oldalakért", de a funkcionalitás rovására. ▪ Megrendelő szempontjából · A megrendelő is fejlődik, a tartalom frissessége is számít már. · A megrendelő szeretné a tartalmat maga alakítani 37 Fejlesztői evolúció 3. szint Meghatározott ▪ Megrendelő szempontjából · A marketing stratégia és a web stratégia összetalálkozik ·  Konkretizálódnak az elvárások · Vevőkkel, partnerekkel is elektronikusan akarják tartani a kapcsolatot · Intranet

oldalak megjelenése ▪ Fejlesztő oldaláról · Tartalomkezelő rendszer · E-kereskedelmi, ügyfélszolgálati szolgáltatások megjelenése · Profi fejlesztő csapat szükséges · Használnak már fejlesztő, tervező eszközöket. · Biztonsági elvárások is megjelennek · Folyamatos fejlesztői képzések · Adatbázisok használata · A fejlesztői szerepek szétválnak: programozó, adatbázis és (web) server adminisztrátor, designer 38 Fejlesztői evolúció 4. szint – Menedzselt ▪ Megrendelő szempontjából · Keretrendszer használata szükséges · Belső portál az alkalmazottaknak és a partnereknek · Profi belső üzemeltetői csapat is kellhet (nem minden esetben!) ▪ Fejlesztői oldalról · · · · · · · · · Web service – Szolgáltatás Orientált Architektúra Architektúra tervezés Alapvető Web 2.0 alkalmazások megjelenése Projektmenedzsment a középpontba kerül Munkafolyamat-kezelés Célok, eredmények mérése, értékelése

További szintek: tervező, rendszerszervező, tesztelő Állandó együttműködés a megrendelővel Menedzselhető fejlesztő rendszerek: J2EE, .NET 39 Fejlesztői evolúció 5. szint – Optimalizáló ▪ Megrendelő oldaláról · ERP funkciók az Intraneten, · Az elkülönült IT rendszerek összeköttetése, · A piac gyors, rugalmas reakciókat vár el ▪ Fejlesztő oldaláról · A szervezet fejlődik, alkalmazkodik, tanul! · A fejlesztői folyamatok folytonos változása a legfontosabb. · Produktivitás, hatékonyság, a megrendelői elvárások kerülnek a középpontba. · Hiba megelőző, elemző módszerek a fejlesztésben. · A termék a lehető legjobb minőségben készül el, határidőre! 40 Egyéb területek 41 Internetes alkalmazások korlátai     Kliens erőforrásainak elérhetősége Kliensek különbözőségének kezelése Sávszélesség problémák Számítás-igényes alkalmazások nehézségei 42 Multimédiás

adatbázisok  Kurrens terület, ahol a web-es környezet le van maradva  Kliens oldali nehézségek: A böngészőn esetleg speciális plug-in szükséges a tartalom megjelenítéséhez.  Prezentációs és logikai szint: A tartalmakat nem tudjuk egyszerűen változókba tölteni, mint elemi típusok esetén, hanem stream-ekkel kell dolgozni. Ennek a technikáját meg kell ismerni. A HTTP protokoll ismerete is szükséges, hagyományos dinamikus WEB oldalakat általában a környezet default beállításaival le tudunk küldeni a kliens-re, míg multimédiás tartalom esetén a HTTP header-t módosítani kell.  Adatbázis: A nagyméretű bináris adatok tárolása pl. relációs adatbázisokban; valamint a visszakeresés, módosítás egy külön nagy kutatási területet jelent az adatbázisokkal foglalkozó ágon belül. Ez korrelál bizonyos mesterséges intelligenciabeli módszerekkel is. 43 XML  <nev>Gipsz Jakab</nev>  XML mint tárolás: SVG,

MPEG7  Kommunikáció ▪ Értelmezhető ▪ Platform-független  Adat és megjelenés elválasztása  XML (hierarchikus) adatbázisok vs. relációs modell 44 Miért PHP? Pro és kontra PRO  Web-programozás I, PHP speci, mint alap.  Elterjedt: az Apache WEB szerverrel együtt nagyon hatékony, ténylegesen képes akár több ezer konkurrens (párhuzamosan beérkező) kérést kiszolgálni.  Egyszerű megtanulni.  Példáink más nyelveken, környezetben is működnek. KONTRA  Nehéz a funkciók (prezentáció és logika) szétválaszthatósága  a környezet nem segíti.  A team munkát sem támogatja.  Egyes feladatok könnyebben, szebben, jobban megoldhatóak egy erősebb fejlesztői környezetben pl.: Java, .NET 45 Keretrendszerek  Alapelemeket biztosító programozási rendszerek, melyek összetett feladatokat képesek támogatni.  Egy vázat adnak alkalmazásaink számára.  Bizonyos filozófiának megfelelő szabályok

gyűjteménye  Gyakori, ismétlődő műveleteket támogatnak, sablonokat biztosítanak: ▪ munkamenetek, ▪ adatbázis kapcsolatok, ▪ hibakezelés, stb. 46 Miért van szükség keretrendszerekre?  Ömlesztett kód: HTML(, CSS), PHP, egyben van  Ömlesztett logika: vezérlés, adatelérés, megjelenítés, feldolgozás, alkalmazáslogika egyben van  Csoportmunka nem lehetséges  Konfiguráció kódba épített  Karakterkódolás eltérő lehet a HTML-ben, PHPban és adatbázisban, nincs egységesen kezelve  Több belépési pontja van az alkalmazásnak, ami biztonsági és jogosultsági kérdéseket vet fel 47 Keretrendszerek  Előnyök ▪ Fejlesztési időt takarítható meg ▪ Rákényszerítik a programozót valamilyen kódolási standard-re  átláthatóbb kódok ▪ Valamilyen szabályrendszert alkalmazását várják el. ▪ Támogatják az újra felhasználhatóságot ▪ Egységesebb alkalmazásfejlesztés ▪ Szétválasztott kód és

logika ▪ Meghatározott könyvtárszerkezet ▪ Csoportmunka támogatott: külön fileok az egyes szakembereknek (designer, adatbázisos, felületfejlesztő, stb.) ▪ Rétegek szétválasztása  Hátrányok ▪ Tanulásokhoz idő kell ▪ Szabályok korlátokat is jelentenek 48 Keretrendszerek - példák  Vastag-kliens RAD: Visual Studio, Borland Delphi,  PHP: CodeIgniter, Symfony, Zend Framework, CakePHP, Yii, Prado  PHP keretrendszerek tartalomkezelő szolgáltatásokkal: Drupal, Joomla!, Wordpress, e107  JavaScript: JQuery, Prototype, script.aculous, Yahoo YUI, ExtJS  ASP.NET framework  Java: Spring, Struts2, Google Web Toolkit, JavaServer Faces, OpenLaszlo, Oracle ADF  Python: Django  Ruby: Ruby on Rails, PureMVC  Flash platform: Flex 49 Mi a probléma az eddigi web-fejlesztési gyakorlattal?  Nagyobb munkák írása egyre nagyobb nehézségekbe ütközik  A kód felesleges elágazásokat tartalmaz, nem lehet tudni, mikor mi

hívódik meg 50 Keretrendszer vs. Tartalomkezelő (CMS) Web-es fejlesztés célja Programozói készségek, érettségi szint az adott környezetben Tisztán tartalom megosztás Tartalommegosztás kevés fejlesztéssel Szofisztikált funkciók, a tartalmi szempontok nem fontosak Kezdő CMS CMS, de fejlesztés nem ajánlott Projekt nem ajánlott Haladó CMS CMS / Framework Framework Profi CMS CMS / Framework Framework 51 PHP KERETRENDSZEREK 52 Front Controller  Minden oldalt érintő közös műveletek egy helyen szerepelnek: ▪ ▪ ▪ ▪ ▪ Konfiguráció beolvasása Autentikáció Autorizáció Input paraméterek előfeldolgozása, szűrése Karakterkódolás  1 belépési pont: index.php  Hogyan jelezhető, melyik oldalt kell megjeleníteni? ▪ hidden mező ▪ GET paraméterrel: index.php?oldal=main 53 Példa: Front Controller – 1. switch ($oldal) { case "index": index(); break; case "page1": page1(); break;

case "page2": page2(); break; case "page3": page3(); break; default: index(); } function index() { } function page1() { } function page2() { } function page3() { } 54 Példa: Front Controller – 2. if (function exists($oldal)) { call user func($oldal); } function index() { } function page1() { } function page2() { } function page3() { } 55 Példa: Front Controller – 3. switch ($oldal) { case "index": include "v3 index.php"; break; case "page1": include "v3 page1.php"; break; case "page2": include "v3 page2.php"; break; case "page3": include "v3 page3.php"; break; default: include "v3 index.php"; } 56 Példa: Front Controller – 4. if (file exists("v3 " . $oldal "php")) { include once("v3 " . $oldal "php"); } 57 Model-View-Controller (Modell-Nézet-Vezérlő - MVC)  A FrontController nem segít az egyes

rétegek szétválasztásában. ▪ A kód ugyanúgy ömlesztett marad az egyes részmodulokban  Összetett, sok adatot kezelő alkalmazásokban elvárható: ▪ Az adatok (modell) és a felhasználói felület (nézet) szétválasztása. ▪ A nézet ne befolyásolja az adatkezelést. ▪ Az adatok átszervezhetőek legyenek a felhasználói felület változtatása nélkül. 58 MVC – 2.  Az MVC tervezési minta elkülöníti az adatok elérését és az üzleti logikát az adatok megjelenítésétől és a felhasználói interakciótól egy közbülső összetevő, a vezérlő bevezetésével. ▪ Model: az adatokat, praktikusan az adatbázisbeli táblák, néha beleértik ezek elérését segítő kódot vagy magát az üzleti réteget is ▪ View: megjelenítésért szükséges réteg ▪ Controller: vezérlést végzi, értesíti a Modelt és a Viewt is a változásokról, kezeli az input adatokat.  Össze szokás kapcsolni a FrontController mintával 59 MVC:

Oldal életciklusa – 1. 60 MVC: Oldal életciklusa – 2.  Példa: CodeIgniter 61 Saját MVC keretrendszer készítésének menete  Elvárások, szabályok megfogalmazása  Könyvtárszerkezet  View, template (PHP nyelvi elemek: echo, for, foreach, while)  Front Controller (index.php)  Model elkészítése 62 Irodalomjegyzék  Frigó József: Többrétegű architektúrák. BME, 2000-2006 http://www.infbmehu/~frigo/ooret7/tiersodp  Martin Fowler: Analysis Patterns - Reusable Object Models. Addison-Wesley, 1997  Papp Szabolcs: Bevezető jegyzet a Webadatbázis programozás c. tárgyhoz ELTE Informatikai Kar, 2005.  Tarcsi Ádám: Quality measurement of Business WEB Applications. Serdica Journal of Computing, 2008. 63