VYSOKÉ UČENÍ TECHNICKÉ V BRNĚ BRNO UNIVERSITY OF TECHNOLOGY

FAKULTA INFORMA ČNÍCH TECHNOLOGIÍ ÚSTAV PO ČÍTA ČOVÝCH SYSTÉM Ů FACULTY OF INFORMATION TECHNOLOGY DEPARTMENT OF COMPUTER SYSTEMS

WEBOVÉ ROZHRANÍ PRO SYSTÉM DETEKCE SÍ ŤOVÝCH ANOMÁLIÍ

BAKALÁ ŘSKÁ PRÁCE BACHELOR‘S THESIS

AUTOR PRÁCE PETR SLÁDEK AUTHOR

BRNO 2013 VYSOKÉ UČENÍ TECHNICKÉ V BRNĚ BRNO UNIVERSITY OF TECHNOLOGY

FAKULTA INFORMA ČNÍCH TECHNOLOGIÍ ÚSTAV PO ČÍTA ČOVÝCH SYSTÉM Ů FACULTY OF INFORMATION TECHNOLOGY DEPARTMENT OF COMPUTER SYSTEMS

WEBOVÉ ROZHRANÍ PRO SYSTÉM DETEKCE SÍŤOVÝCH ANOMÁLIÍ WEB INTERFACE FOR NETWORK ANOMALY DETECTION SYSTEM

BAKALÁ ŘSKÁ PRÁCE BACHELOR‘S THESIS

AUTOR PRÁCE PETR SLÁDEK AUTHOR

VEDOUCÍ PRÁCE Ing. VÁCLAV BARTOŠ SUPERVISOR

BRNO 2013 Abstrakt

Úkolem této bakalá řské práce je vytvo řit webové rozhraní pro systém detekce sí ťových anomálií s názvem HostStats. Jeho úkolem je umožnit uživateli efektivn ě pracovat s daty a statistikami, které systém poskytuje. Webové rozhraní funguje jako plugin do NfSenu i jako zcela nezávislá webová aplikace. Implementace prob ěhla v PHP s využitím Nette Frameworku, HTML5, CSS3 a JavaScriptu s použitím jQuery knihovny.

Abstract

The goal of this work is to create a web interface for network anomaly detection system called HostStats. Its mission is to enable users to effectively work with data and statistics provided by the system. Web interface works as a plugin to NfSen as a completely independent web applications. Implementation took place in PHP using the Nette Framework, HTML5, CSS3, and JavaScript using the jQuery library.

Klí čová slova

HostStats, NfSen, NetFlow, timeslot, detekce útok ů, sí ťové anomálie, Nette framework

Keywords

HostStats, NfSen, NetFlow, timeslot, attack detection, network anomaly, Nette framework

Citace

Sládek Petr: Webové rozhraní pro systém detekce sí ťových anomálií, bakalá řská práce, Brno, FIT VUT v Brn ě, 2013 Webové rozhraní pro systém detekce sí ťových anomálií

Prohlášení

Prohlašuji, že jsem tuto bakalá řskou práci vypracoval samostatn ě pod vedením Ing. Václava Bartoše. Uvedl jsem všechny literární prameny a publikace, ze kterých jsem čerpal.

…………………… Petr Sládek 15.kv ětna 2013

Pod ěkování

Děkuji svému vedoucímu práce Ing. Václavu Bartošovi za odborné vedení a všechny podn ěty a podklady, které mi k vypracování práce poskytl.

© Petr Sládek, 2013 Tato práce vznikla jako školní dílo na Vysokém u čení technickém v Brn ě, Fakult ě informa čních technologií. Práce je chrán ěna autorským zákonem a její užití bez ud ělení oprávn ění autorem je nezákonné, s výjimkou zákonem definovaných p řípad ů.

4 Obsah

Obsah ...... 1 1 Úvod ...... 3 2 Analýza ...... 4 2.1 Proces získávání dat pro HostStats ...... 4 2.1.1 NetFlow ...... 4 2.1.2 NfSen – Netflow Senzor ...... 5 2.1.3 HostStats ...... 5 2.2 Architektura plugin ů NfSen ...... 6 2.3 Komunikace Frontendu s Backendem ...... 7 2.3.1 NEW_DATA (1) ...... 8 2.3.2 GET_STATUS (10) ...... 8 2.3.3 GET_HOST_CNT_HISTORY (11) ...... 8 2.3.4 GET_FLOW_CNT_HISTORY(12) ...... 9 2.3.5 GET_PROFILES(20) ...... 9 2.3.6 GET_FIELD_LIST(30) ...... 9 2.3.7 GET_TIMESLOT_DATA(31) ...... 10 2.3.8 GET_TIMESLOT_IPMAP (32) ...... 10 2.3.9 GET_HOST_HISTORY(35) ...... 11 2.3.10 GET_DETECTION_LOG_LIST(40) ...... 11 2.3.11 GET_DETECTION_LOG(41) ...... 12 2.4 Potencionální technologie Frontendu ...... 12 3 Implementace ...... 13 3.1 Použité technologie ...... 14 3.1.1 HTML5 ...... 14 3.1.2 CSS3 ...... 15 3.1.3 PHP Framework Nette ...... 15 3.1.4 Konfigurace p řes Neon ...... 16 3.1.5 JavaScriptová knihovna jQuery ...... 16 3.1.6 CSS Framework Bootstrap ...... 17 3.1.7 AJAX & Snippety ...... 17 3.2 Objektový návrh aplikace ...... 18 3.2.1 MVP struktura ...... 18 3.2.2 Životní cyklus aplikace ...... 20 3.2.3 Třída HSConnection ...... 22

1 3.2.4 Třída Timeslot ...... 22 3.2.5 Třída Timewindow ...... 23 3.2.6 Třída Nettools ...... 23 3.2.7 Zpracování chyb ...... 23 3.3 Sekce Frontendu ...... 24 3.3.1 Sekce Overview ...... 24 3.3.2 Sekce Detail ...... 25 3.3.3 Sekce IP map ...... 25 3.3.4 Sekce History ...... 26 3.3.5 Sekce Detectors ...... 27 4 Testování ...... 28 4.1 Oblasti testování ...... 28 4.1.1 Testování funk čnosti ...... 28 4.1.2 Testování použitelnosti ...... 29 4.1.3 Testování bezpe čnosti ...... 29 4.2 Na čem bylo testováno ...... 29 4.3 Výsledky testování ...... 29 5 Možnosti dalšího rozší ření ...... 30 6 Záv ěr ...... 31

2 1 Úvod

Cílem této práce je popsat a zdokumentovat webové rozhraní pro systém detekce sí ťových anomálií HostStats, vyvíjeného v rámci výzkumné skupiny ANT. HostStats je název systému, který využívá data v NetFlow záznamech a generuje statistiky o jednotlivých hostech na síti. V těchto statistikách poté vyhledává anomálie, na základ ě kterých detekuje jednotlivé sí ťové útoky jako DOS, horizontální a vertikální skenování port ů a další. Webové rozhraní (neboli také frontend) systému HostStats je prost ředek pro zobrazování statistik ve form ě tabulek, filtr ů a graf ů uživateli tak, aby bylo vše p řehledn ě vid ět a s daty se dalo bez problém ů pracovat. Webové rozhraní je plugin do monitrovacího systému NfSen, který slouží pro práci s NetFlow záznamy. Důraz je ale taktéž kladen na to aby frontend mohl fungovat samostatn ě jako nezávislá webová aplikace. Tato práce se zabývá analyzováním a ur čením nejlepšího vhodného technologického řešení pro implementaci webového rozhraní systému HostStats, a také popsáním implementace samotné. A to p ředevším architekturou plugin ů do monitorovacího systému NfSen, fungováním aplikace ve vybraném Nette Frameworku, dále pak popsáním n ěkterých ůležitých t říd objektového modelu, popsáním MVC struktury aplikace a v neposlední řad ě komunikací webového rozhraní s backendovou (serverovou) částí systému. V poslední kapitole je popsáno testování funk čnosti a použitelnosti webu. Vzhledem k tomu, že tato aplikace slouží pro administrátora či správce sít ě, testování prob ěhlo na skupince lidí z IT oboru. Dále jsou uvedeny možná budoucí užite čná rozší ření systému. Na p řiloženém CD jsou kompletní zdrojové kódy webového rozhraní a elektronická verze tohoto dokumentu.

3 2 Analýza

Tato kapitola se zabývá teoretickou stránkou funk čnosti systému. Dozvíte se kde a jak se berou data pro statistiky ze kterých HostStats vychází a na základ ě kterých odhaluje sí ťové útoky. Jsou zde popsány technologie, na kterých je systém detekce sí ťových anomálií založen a ze kterých je proto nutné vycházet. Na záv ěr jsou zde uvedeny možné technologie a prost ředky na kterých je vhodné stav ět webové rozhraní.

2.1 Proces získávání dat pro HostStats

Stru čně funguje systém takto: HostStats zpracovává NetFlow záznamy o tocích na síti. NetFlow záznamy jsou ukládány do soubor ů, p řičemž každý soubor obsahuje záznamy z jednoho časového intervalu o délce 5 minut (tzv. timeslot ). Pomocí opensource nástroje nfdump se dají data z těchto soubor ů číst. Pro lepší vizualizaci a práci s NetFlow záznamy se ovšem používá opensource nástroj NfSen. Jeho webový frontend zobrazuje tyto údaje uživateli ve form ě graf ů a tabulek s různými filtry a vyhledáváním. NfSen také nabízí podporu pro pluginy. Vždy po 5 minutách, když dojde k vytvo ření nového souboru s flow záznamy, pošle NfSen pomocí pluginu zprávu s názvem souboru timeslotu na HostStats a ten ho zpracuje a vytvo ří statistiku o jednotlivých hostech na síti. Základním článkem získání dat ke statistice je tedy NetFlow.

2.1.1 NetFlow

NetFlow je protokol vytvo řený, jednou z nejvíce dominujících firem na poli síťových prvk ů, spole čností Cisco Systems. Tento otev řený protokol slouží k monitorování sí ťového provozu na základ ě IP tok ů a to v tém ěř reálném čase. Toto monitorování je d ůležité zejména k zabezpe čování po číta čové sít ě, ale i nap říklad pro ISP k zpoplat ňování svých služeb na základ ě p řenesených dat.

IP tok (neboli flow) je definovaný jako ukon čená sekvence paket ů se shodnými p ěti údaji • Cílová IP adresa • Zdrojová IP adresa • Cílový port • Zdrojový port • Číslo protokolu

U každého toku je evidován čas jeho za čátku, délka jeho trvání, po čet p řenesených paket ů, po čet přenesených byt ů a případn ě další údaje. Z každého toku tedy m ůžeme určit kdo s kým kdy komunikoval, na jakém protokolu a kolik přitom přenesl dat.

4

Architektura NetFlow je složena z několika sond (tzv. exportér ů) a jednoho kolektoru . Exportéry jsou umíst ěny v různých místech sít ě, na kterých chceme schra ňovat statistiky a analyzují procházející pakety. Ukládají informace o toku a ve chvíli kdy tok skon čí, odešlou ho na kolektor. A to bu ď po síti na které jsou p řipojené nebo po vlastní dedikované lince, která nezat ěžuje monitorovanou sí ť. [1] Kolektor je za řízení, které schra ňuje a ukládá všechny statistiky o tocích, které p řijme od exportér ů. Proto musí mít velký úložný prostor. V ětšinou na tomto za řízení b ěží také vhodný pro vizualizaci t ěchto NetFlow záznam ů. Jedním z nich je nap říklad NfSen.

2.1.2 NfSen – Netflow Senzor

Tento oblíbený a často používaný nástroj slouží nejen jako NetFlow kolektor , ale ve své podstat ě jako grafická nadstavba nástroje nfdump . Pochází také od stejného autora a je stejně tak vydávaný jako opensource. NfSen je rozd ělen na backend a webový frontend. Backend slouží jako kolektor, který shromažduje NetFlow záznamy a ukládá je do RRD 1 databáze. Frontend pomocí RRD graf ů vykresluje využití sít ě (v bytech, paketech i tocích) a další statistiky. Tyto data se dají samoz řejm ě filtrovat podle port ů, ip adres, jednotlivých senzor ů atp… Jak backend, tak i frontentd mají své pluginy. Backendové jsou volané p ři r ůzných událostech, jako je nap říklad nový timeslot, n ějaké definované upozorn ění a podobn ě. Frontendové pluginy slouží k vlastní vizualizaci a filtraci dat. A také k volání funkcí v backendových pluginech. [2] Tyto pluginy jsou využity i pro HostStats. Backendový plugin posílá nová data do HostStats ke zpracování a Frontendový plugin zajištuje vykreslení HostStats frontendu v layoutu NfSenu.

2.1.3 HostStats

HostStats je název systému pro analýzu dat a detekci sí ťových anomálií vyvíjený pod výzkumnou skupinou ANT, jehož základem je výpo čet statistik o jednotlivých hostech (IP adresách) v síti. Systém je vyvíjen jako plug-in pro NfSen. Každých 5 minut jsou z NetFlow dat vypo čítány informace o provozu jednotlivých IP adres. V t ěchto informacích pak jsou vyhledávány adresy vykazující podez řelé chování. Komunikace jednotlivých prvk ů systému je znázorn ěna na schématu (obrázek 1). Backendový plugin NfSenu, napsaný v jazyce , posílá jednou za 5 minut p řes socket zprávu s názvem nového timeslotu. HostStats server (backend) timeslot analyzuje a vypo čítá statistiky pro

1 RRD – Databázový nástroj, který se zam ěř uje na zpracování a ukládání časov ě závislých dat

5 jednotlivé hosty (IP adresy) a statistiku uloží na disk. Ze vzniklé statistiky detekuje hrozby, jejichž seznam taktéž uloží na disk k dalšímu použití, p řípadn ě odešle informace do systému Warden 2. Na všechny uložená data se op ět p řes socket dotazuje webový frontend. Ten je poté zobrazuje v uživatelsky p řijatelné form ě uživateli. Podrobn ě je komunikace HostStats backendu s frontendem popsána v kapitole 2.3.

Obrázek 1: Schéma datových tok ů HostStats

2.2 Architektura plugin ů NfSen

Webové rozhraní (frontend) systému HostStats musí fungovat jako plugin do NfSenu. A to p ředevším z toho d ůvodu, aby byly všechny nástroje používané k analýze NetFlow p ěkn ě na jednom míst ě. Na druhou stanu je ovšem vhodné aby webový frontend mohl být funk ční i samostatn ě bez použití NfSenu. Jak už bylo řečeno NfSen nabízí podporu pro frontendové pluginy psané v PHP , které jsou vid ět na webovém frontendu NfSenu a backendové pluginy, které se spouští jako perl skript a mohou komunikovat s frontendovými pomocí aplika čního rozhraní. Z důvodu pot řeby samostatnosti našeho webového rozhraní, není možné použít nabízené rozhraní pro frontendové pluginy. Proto je použit jen drobný m ůstek, kterým je soubor hoststats.php v adresá ře NfSen plugin ů. Ten vypne automatické obnovování stránky v nastaveném intervalu, vloží iframe s adresou našeho webového rozhraní a pomocí JavaScriptu ho roztáhne na celou možnou plochu uživatelova prohlíže če.

2 WARDEN - systém pro efektivní sdílení informací o detekovaných událostech (hrozbách). Systém je vyvíjen v rámci projektu Velká Infrastruktura CESNET, který řeší sdružení CESNET. https://csirt.cesnet.cz/Warden

6 Jakákoli jiná možnost velmi komplikovala využít kterékoli framework, ajaxové požadavky, vlastní CSS styly atd. NfSen rozhraní pro PHP frontendové pluginy není pro funk čnost HostStats webového rozhraní nutností, protože to komunikuje přes sockety p římo s HostStats backendem a nevyžaduje jakékoliv propojení s NfSenem.

Obrázek 2: Schéma architektury plugin ů v NfSen [2]

2.3 Komunikace Frontendu s Backendem

Frontend posílá požadavky na socket otev řený backendem (standardn ě localhost na portu 3333 ) ve formátu: • první byte - kód požadavku • řet ězec libovolné délky - parametry • poslední byte - ukon čení zprávy nulovým znakem ('\0’)

Nap ř:

\x1E all;201302171200;flows > 100;50;0 \0

Po čet a význam parametr ů závisí na typu požadavku, parametry jsou obvykle odd ělovány pomocí st ředníku. Backend odešle zp ět požadovaná data (formát závisí na typu požadavku) a uzav ře spojení. Pro každý požadavek je tedy nutné vytvo řit nové spojení. Pokud není specifikováno jinak: • všechny časy (timesloty) se posílají ve formátu: yyyymmddHHMM. • parametr "profil" ur čuje profil, ze kterého se získávají data, je to bu ď "all", nebo n ěkterý z řet ězc ů získaných voláním GET_PROFILES viz dále.

7 Pokud dojde k chyb ě, je místo o čekávané odpov ědi odeslána chybová hláška za čínající řet ězcem "ERROR". Ta je potom vyvolaná jako Exception a dále odchycená a zpracovaná v aplikaci. Dále jsou uvedeny jednotlivé typy požadavk ů. V závorce je vždy uveden kód požadavku v desítkové soustav ě.

2.3.1 NEW_DATA (1)

Speciální požadavek, který nep řichází z webového rozhraní, ale posílá ho NfSen backend plugin. Říká tím, že jsou k dispozici nová data. Na tento požadavek jako jediný není odesílána žádná odpov ěď .

Parametry: timeslot

2.3.2 GET_STATUS (10)

Vrátí základní stavové informace o stavu backendu. Požadavek nemá žádné parametry.

Formát odpov ědi promenna=hodnota;promenna=hodnota;...;promenna=hodnota

V sou časnosti se vracejí tyto prom ěnné: • processing - 1 pokud plugin práv ě zpracovává nová data, jinak 0 • timeslot - aktuáln ě zpracovávaný, nebo poslední zpracovaný timeslot • flows - po čet na čtených tok ů v posledním timeslotu • hosts - po čet na čtených host ů v posledním timeslotu

2.3.3 GET_HOST_CNT_HISTORY (11)

Vrací historii po čtu host ů v minulých timeslotech

Paramery: profil;starttimeslot,endtimeslot

Formát odpov ědi timeslot=hodnota;timeslot=hodnota;...;timeslot=hodnota

8 Hodnota pro každý timeslot mezi starttimeslot a endtimeslot (v četn ě), ke kterému jsou data k dispozici.

2.3.4 GET_FLOW_CNT_HISTORY(12)

Vrací historii po čtu tok ů v minulých timeslotech. Parametry a formát odpov ědi stejné jako u GET_HOST_CNT_HISTORY .

2.3.5 GET_PROFILES(20)

Vrátí seznam dostupných profil ů. Nemá žádné parametry.

Formát odpov ědi: nazev_profilu_1;nazev_profilu_2;...;nazev_profilu_n

2.3.6 GET_FIELD_LIST(30)

Vrátí seznam položek, ze kterých se skládá záznam o hostu.

Parametry: profile Formát odpov ědi: polozka;polozka;...;položka

Příklad: address;in_flows;in_packets;in_bytes;out_flows;out_packets;out_bytes

9 2.3.7 GET_TIMESLOT_DATA(31)

Na tento požadavek p řijde jako odpov ěď tabulka dat z jednoho timeslotu.

Parametry: profile;timeslot;filter;limit;sort_by;ascending

• filter - filtrovací pravidlo, formát kontroluje backend, z hlediska frontendu jde o libovolný řet ězec). M ůže být prázdné. • limit - maximální po čet vrácených záznam ů (kladné číslo) • sort_by - název položky, podle jejíž hodnoty budou data seřazena (jeden z názv ů získaných voláním GET_FIELD_LIST ), m ůže být prázdné, pak data nejsou řazena • ascending - 1 pokud mají být data řazena vzestupn ě, jinak jsou řazena sestupn ě (default)

Formát odpov ědi: Tabulka, řádky odd ěleny pomocí ' \n’, hodnoty na řádku pomocí ' ;'. • První řádek - popisky sloupc ů tabulky (názvy položek) • Každý další řádek jeden záznam (tj. adresa a hodnoty položek)

Příklad: address;in_flows;in_packets;in_bytes;out_flows;out_packets;out_bytes 10.0.0.1;2;2;120;1;4;2405 192.168.1.2;54;510;14028;27;98;841 2001:db8::1428:57ab;0,0,0;250;250;15000

2.3.8 GET_TIMESLOT_IPMAP (32)

Na tento požadavek p řijde jako odpov ěď tabulka dat z jednoho timeslotu agregované podle /16 prefixu IPv4 adresy. Tyto data se používají pro vykreslení IP mapy (viz kapitola 253.3.3).

Parametry: profile;timeslot;base_address;prefix_len

• base_address – Adresa specifické podsít ě • prefix_len – Délka prefixu p ředchozí adresy

Formát odpov ědi: Stejný jako v předchozím požadavku

10

2.3.9 GET_HOST_HISTORY(35)

Vrací statistiky o jednom hostu z daného časového intervalu, tj. ze všech existujích soubor ů s časovou zna čkou mezi starttimeslot a endtimeslot (v četn ě).

Parametry: profile;address;starttimeslot;endtimeslot

• address - adresa hosta, jehož statistiky jsou požadovány (IPv4 nebo IPv6 v b ěžném textovém formátu) • starttimeslot - za čátek časového rozsahu (první požadovaný timeslot) • endtimeslot - konec časového rozsahu (poslední požadovaný timeslot)

Formát odpov ědi: Tabulka, řádky odd ěleny pomocí ' \n’, hodnoty na řádku pomocí ' ;'. • První řádek - popisky sloupc ů tabulky (názvy položek) • Každý další řádek jeden záznam (tj. timeslot a hodnoty položek) • Pokud se požadovaná adresa v datech z ur čitého timeslotu nevyskytuje, jsou všechny hodnoty záznamu nulové. • Pokud n ějaký timeslot není v ůbec k dispozici (soubor neexistuje), je řádek s tímto timeslotem vynechán. Příklad: timeslot;in_flows;in_packets;in_bytes;out_flows;out_packets;out_bytes 201301021200;2;2;120;1;4;2405 201301021205;0;0;0;0;0;0 201301021210;212;215;4320;250;250;15000 2.3.10 GET_DETECTION_LOG_LIST(40)

Vrací seznam dn ů, pro které je k dispozici log detekovaných událostí. Tento požadavek nemá žádné parametry.

Formát odpov ědi: Seznam dní ve formátu yyyymmdd odd ělených pomocí ' \n’ Příklad: 20130102 20130103 20130104

11 2.3.11 GET_DETECTION_LOG(41)

Vrací obsah logu detekovaných událostí pro zadaný den Parametry: day (den ve formátu yymmdd )

Formát odpov ědi: Tabulka, řádky odd ěleny pomocí ' \n’, hodnoty na řádku pomocí ' ;'. Příklad: 201202151115;portscan_h;6;43.99.57.181;;;;1516;horizontal SYN scan 201202151115;portscan_h;6;138.243.71.66;;;;1413;horizontal SYN scan 201202151115;dos;6;;20fd:6cfa:e321:ff:0:ffff:93fa:e3fe;;;124112;

Význam jednotlivých sloupc ů: 1. Timeslot, ve kterém byla událost detekována 2. Typ události, možnosti: o portscan (skenování portu bez bližšího ur čení) o portscan_h (horizontální skenování portu, tj jeden port na více adresách) o portscan_v (vertikální skenování portu, tj r ůzné porty na jedné adrese) o bruteforce (hádání hesel hrubou silou) o dos (denial od service útok) o other (ostatní) 3. protokol, p řes který byl útok veden (1=ICMP, 6=TCP, 17=UDP) 4. zdroj události (IPv4 nebo IPv6 adresa) 5. cíl události (IPv4 nebo IPv6 adresa) 6. zdrojový port 7. cílový port 8. intenzita události (nap ř. po čet proskenovaných adres/port ů, po čet tok ů DoS útoku apod.) 9. poznámka – jakýkoli řet ězec

Protokol ů, adres a port ů může byt i vice, v tom p řípad ě jsou jednotlivé hodnoty odd ěleny čárkou ',' .

2.4 Potencionální technologie Frontendu

Vzhledem k zadání je nutné použít pro webové rozhraní PHP na stran ě serveru a Javascript na stran ě klienta. To uleh čuje výb ěr a odpadají tím možnosti jako Ruby, ASP, Perl či Python. Ovšem používat v dnešní dob ě PHP bez n ějakého frameworku je velmi nevhodné a časov ě neekonomické. PHP framework ů je široká škála a proto je nutné vybrat ten nejvhodn ější.

12 K nejvíce používaným a nejlépe dokumentovaným pat ří Zend Framework, Nette Framework, CodeIgnitier, CakePHP a Sympony. Všechny tyto Frameworky samoz řejm ě fungují na PHP5, které obsahuje vylepšenou podporou pro objektov ě orientované programování. Zend Framework pochází od stejné spole čnosti jako PHP samotné, je stále vyvíjený a má podrobnou a udržovanou dokumentaci. Oproti tomu je ale relativn ě pomalý, obsahuje mnoho soubor ů a t říd, které v normální aplikaci programátor v ůbec nevyužije a oproti ostatním framework ům není moc uživatelsky p říjemný. Skoro vše se konfiguruje a p ředává p řes pole, místo toho aby se použil objektový p řístup. Nette Framework vyvíjí malá česká komunita. Na za čátku roku vyšla jeho 2 verze, která je stabilní a kvalitn ě česky i anglicky zdokumentovaná. Obsahuje skv ělý šablonovací systém Latte a vynikající systém vytvá ření formulá řů a komponent. Do Nette existují také r ůzné pluginy, knihovny a rozší ření od uživatelské komunity. Tento Framework se stává velmi populární a pro své webové aplikace ho použili nap říklad servery Ulozto.cz, Denik.cz nebo kancelá ř prezidenta ČR. CodeIgnitier, CakePHP a Sympony jsou menší frameworky. Podporují, stejn ě jako p ředchozí dva, základní nástroje jako MVC strukturu, formulá ře, emaily atp. Využívají se ovšem mén ě a nejdou úpln ě s dobou. Na základ ě nezávislého testu [3] a prohlédnutí dokumentace a p říklad ů jednotlivých framework ů jsem se rozhodl použít pro Webové rozhraní HostStats framework Nette. A to p ředevším kv ůli šablonovacímu systému a skv ělé podpo ře AJAXu. Pro vývoj aplikace tohoto typu se hodí taktéž CSS Framework. Ten slouží k vytvo ření základního rozložení layoutu webu a také obsahuje typografii a základní styly formulá řových prvk ů, tabulek, r ůzných zpráv, stav ů apod. Takovýchto voln ě dostupných framework ů se dá najít také mnoho. Některé, jako nap říklad 360.gs, jsou jen na vykreslení tzv „m řížky 3“ webu. Jiné mají i grafické styly a JavaScript pro záložky, vysouvací menu apod. Mezi nejznám ější pat ří YUI od Yahoo, YAML CSS Framework a Twitter Bootstrap. Já jsem pro implementaci zvolil ten poslední. Twitter Bootstrap má široké využití ve všech „administra čních“ prost ředích, má hezký design, který se dá jednoduše p řizp ůsobit a nabízí spoustu užite čných prvk ů.

3 Implementace

Po výb ěru optimálních technologií a prostudování dokumentace technologií, na které je pot řeba navázat bylo množné za čít implementovat. V této kapitole jsou popsány technologie, frameworky a knihovny použité pro implementaci.

3 Grid neboli m řížka webu je rozmíst ění jednotlivých celk ů na stránce

13 Dále je uveden objektový návrh MVP struktury, životní cyklus aplikace a podrobn ěji popsány důležité t řídy aplikace.

3.1 Použité technologie

3.1.1 HTML5

HTML neboli hypertextový zna čkovací jazyk je jedním ze základních jazyk ů webu. Tedy publikace dokument ů na internetu. Dnes je HTML spolu s JavaScriptem, stylovacím jazykem CSS a serverovým jazykem PHP základem pro v ětšinu internetových prezentací. Další vývoj HTML p římo ovliv ňuje rozvoj internetových aplikací a umož ňuje vývojá řů m realizovat čím dál tím více nápad ů. Proto se s každou novou verzí internet posune o neuv ěř itelný krok kup ředu. Stejn ě tak se stalo i v případ ě vydání poslední verze HTML5. HTML5 se za čala vyvíjet kolem roku 2007, a její kone čné schválení je plánováno až na rok 2014. Proto je verze 5 stále velmi živá a její podpora je ze strany prohlíže čů p řijata r ůzn ě. Velká část HTML 5 je v sou časné dob ě podporována všemi velkými prohlíže či a je tedy možné mnoho z nové specifikace již používat. HTML verze 5 se od verze 4 liší novými, zkrácenými a rychlejšími zápisy zna ček (tag ů). Auto ři dávají d ůraz na jednoduchost a zárove ň ú činnost. V HTML5 je též možné vytvo řit aplikaci, která funguje v prohlíže či i tehdy, když uživatel nemá internetové p řipojení, a která ukládá data do lokálního úložišt ě na uživatelov ě po číta či. Je-li internetové p řipojení k dispozici, m ůže aplikace synchronizovat data se vzdáleným serverem.

Obrázek 3: Ukázka HTML5 kódu

Příklad t ěla dokumentu ukazuje obrázek 3. Na první pohled je z řejmé, že je velmi zjednodušený DOCTYPE a také meta tagy. Vzhledem k tomu že HTML5 vychází stejn ě jako starší HTML4 ze SGML nemusí být všechny tagy párové jako tomu bylo u XHTML vycházejícího z XML.

14 Jazyk dále obsahuje mnoho nový zna ček (tag ů). Nap říklad

,