Návrh internetových webových aplikací

Rozměr: px
Začít zobrazení ze stránky:

Download "Návrh internetových webových aplikací"

Transkript

1 Bankovní institut vysoká škola Praha Katedra informatiky Návrh internetových webových aplikací Bakalářská práce Autor: Tomáš Lang Bankovnictví, Informační technologie Vedoucí práce: Doc. Ing. Stanislav Horný, CSc Praha leden, 2009

2 Prohlášení: Prohlašuji, že bakalářskou práci na téma Návrh internetových webových aplikací jsem zpracoval samostatně a s použitím uvedené literatury. V Praze dne 10. června 2008 Tomáš Lang

3 Poděkování Rád bych poděkoval vedoucímu mé práce, panu Doc. Ing. Stanislavu Hornému, CSC, za odbornou spolupráci a pomoc při řešení mé bakalářské práce.

4 Anotace práce Bakalářská práce Návrh internetových webových aplikací zahrnuje vznik internetu od statických webových stránek přes dynamické stránky a v jádru se snaží objasnit důležitost návrhu webových aplikací s využitím propracované metodiky WebML. Pomocí příkladů se snaží vysvětlit tvorbu jednotlivých modelů této metodiky, které obsahujících různé funkční prvky a objasňuje důležitost vývojové fáze specifikace požadavků na webovou aplikaci. Anotation My bachelor thesis with name Design of internet web application includes rise of the internet from static web pages over dynamic pages and the core of the work is aimed to explain of importance of web application design using elaborate methodology WebML. In work are used examples to explain creation of models and their functional units of this methodology. My thesis also trying to explain importance of period of development process, where is explained specification of needs to web application.. +

5 Obsah ÚVOD STATICKÉ WEBOVÉ STRÁNKY WEBOVÉ STANDARDY HTML JAKO ZÁKLAD DESIGN POMOCÍ KASKÁDOVÝCH STYLŮ CSS Použití CSS DYNAMICKÉ WEBOVÉ STRÁNKY CLIENT-SIDE SCRIPTING SERVER-SIDE SCRIPTING SKRIPTOVACÍ JAZYKY A JEJICH ZÁKLADNÍ VLASTNOSTI PHP ASP JSP NÁVRH WEBOVÝCH APLIKACÍ POMOCÍ WEBML FÁZE VÝVOJE WEBOVÉ APLIKACE Specifikace požadavků na aplikaci DATOVÝ MODEL Vztahy mezi entitami a kardinalita Strukturované atributy I-SA hierarchie Příklad datového modelu HYPERTEXTOVÝ MODEL Model kompozice Navigační model OPERACE S DATY Create Unitl Modify Unitl Delete Unit Connect Unit Disconnect Unit ZÁVĚR SEZNAM POUŽITÉ LITERATURY

6 Úvod Internet byl zpočátku navržen jako komunikační nástroj umožňující sdílení vědeckých výzkumů mezi universitami v podobě statických prezentací. Postupem doby však nezůstalo pouze u statických stránek. Příchod skriptovacích jazyků a databázových systémů dodal stránkám jejich dynamičnost a stránky začaly být více interaktivní, tedy schopné reagovat na různé požadavky uživatele a archivovat data. Tím nastala doba velké změny internetu, který je v dnešní době chápán jako jedno velké informační médium a dává prostor k tvorbě a rozvoji rozsáhlých webových aplikací majících podobu internetových obchodů, bankovních aplikací, rezervačních, redakčních nebo inzertních systémů. Této výhody samozřejmě využívají podniky, firmy nebo velké instituce pro jejich prezentaci, ale také pro využití svých podnikatelských aktivit. Důkazem může být v poslední době rostoucí počet internetových obchodů, či redakčních systémů. Kvalita těchto aplikací však není vždy stejná a proto je důležité věnovat velkou pozornost nejen samotnému programování webových aplikací ale také jejich analýze a návrhu, které by měly být základem každého softwarového projektu. Cílem této práce je podrobněji analyzovat výše uvedenou problematikou. Je rozdělena do tří základních částí. První část popisuje historický rozvoj internetu a využití statických webových stránek. Dále také uvádí vznik webových standardů a využití šablon stylů pro tento druh stránek. Druhá část je zaměřena především na dynamické webové stránky. Směřuje na dva základní způsoby zajištění interaktivity těchto stránek, kterými jsou Client-side a Serve-side scripting a součástí je také základní popis tří nejčastěji používaných skriptovacích jazyků PHP, ASP a JSP s jejich charakteristikou a historickým vývojem. Kořenem této práce je část třetí, ve které se zabývám návrhem webových aplikací s využitím metodiky WebML. Zde se zaobírám tvorbou základních modelů. Prvním je modelem datovým popisující část datového modelování. Druhým je hypertextový model, který se týká logické struktury a propojení jednotlivých stránek. Dále se také věnuji operativním jednotkám, sloužící pro operaci s proměnnými na webových stránkách. Poslední částí třetí kapitoly je důležitá fáze sběru požadavků na webovou aplikaci. 8

7 1 Statické webové stránky V počátcích rozvoje internetu byly internetové stránky převážně statického charakteru, nezajišťovali tedy žádnou interaktivitu, tedy komunikaci uživatele a serveru. Sloužily tedy k prezentaci daných informací, což byla jediná funkce, kterou statické webové stránky zajišťovaly, mezi takové informace můžeme řadit strategické informace, výsledky výzkumů vědeckých pracovníků, kteří sdíleli takto své poznatky například v oboru fyziky vysokých energií. V roce 1969 vznikla síť ARPANET (Advanced Research Project Agency), byla to experimentální síť, která vznikla za podpory grantové agentury ministerstva obrany USA, neměla žádnou centrální složku, aby v případě zničení některého prvku v síti byla stále funkční, stala se také prostředkem pro propojení některých univerzit a výzkumných center v USA. Síť ARPANET sdílení statických webových informací odstartovala. Dalším pokrokem ve vývoji byl vznik projektu WWW (Word Wide Web), ve volném překladu to znamená celosvětová pavučina a je to označení pro aplikace pracující na základě internetového protokolu HTTP, což je v podstatě propojení hypertextových dokumentů. Projekt WWW vznikl v roce 1980 v CERNu (Centre Européene de Rechere Nucléaire) Evropské centrum jaderného výzkumu, který leží na švýcarsko-francouzských hranicích nedaleko Ženevy. Za jeho tvůrce je pokládán pan Tim Berners-Lee, který navrhl jazyk HTML, napsal první webový prohlížeč a v roce 1990 spustil první webový server. 1.1 Webové standardy S dalším vývojem internetu a internetových stránek bylo nutné vytvořit vodítko neboli standard při vyvíjení a programování webových stránek. Vznikají tedy webové standardy, které se využívají proto, aby použitelnost webových stránek trvala co nejdéle pro nové budoucí webové prohlížeče ale také pro jejich starší verze. Je to také sada praktických doporučení (best practices) pro návrh, programování a design webových 9

8 stránek. Protože s pokrokem internetu autoři potřebovali do obsahu zasadit nejen textové informace, ale také ty grafické, začal se obsah a design stránek psát do jediného souboru, což zapříčinilo zmatek. Proto vznikly normy, při jejichž dodržování se zjednoduší a zefektivní práce programátora tím, že se striktně oddělí obsah stránek od designu. Zároveň se zpřístupní webové stránky širšímu okruhu uživatelů. Webové standardy zahrnují součinnost, použitelnost a přístupnost webových stránek. Je jich celá škála mezi nejznámější patří např. standardy značkovacích jazyků HTML, XHTML, tabulek kaskádových stylů CSS, nebo objektově orientovaného modelování DOM. Webové standardy dnes definuje konsorcium W3C jehož zakladatelem je Berners-Lee, kde členové konsorcia vyvíjejí společně s veřejností standardy pro World Wide Web, mimo jiné se také zabývá vzděláním a přístupností a také vývojem software a nabízí otevřenou diskuzi o Webu prostřednictvím fóra. 1.2 HTML jako základ Jedním z dominantních a základních jazyků pro tvorbu webových stránek je značkovací jazyk HTML (Hypertext Markup Language), poskytuje prostředky pro popis struktury textových dokumentů a to tak, že text dokáže logicky rozčlenit na nadpisy, odkazy, seznamy atd. zároveň dále pro podporu tohoto textu dokáže začlenit obrázky, formuláře či jiné objekty. Byl vytvořen v roce 1991 a jejím autorem byl Tim Berners-Lee. Ten označil první verzy HTML jako HTML 0.9. Umožňovala rozčlenit text do několika logických úrovní, zvýraznit text, zakomponovat do textu obrázky a také odkazy. Bernes- Lee nepředpokládal při vývoji HTML, že by autoři WWW stránek museli nutně tento jazyk znát. První verze WWW-softwaru byla programována pro operační systém NextStep a obsahovala prohlížeč a také integrovaný editor WWW stárek. Marc Anderssen však se svými kolegy z NCSA (National Center for Supercomputing Applications) programoval známý prohlížeč Mosaic, považoval za příliš obtížné zakomponovat do programu rovnou i editor HTML. Díky tomuto rozhodnutí a tomu, že ne každý provozuje na svém počítači operační systém NextStep, je dnes nutné, aby autoři profesionálních WWW stránek znali také jazyk HTML. S rostoucími požadavky uživatelů a také vývojářů webových stránek tak byli autoři webových prohlížečů nuceni obohacovat o některé prvky. Aby se zachovala 10

9 kompatibilita mezi jednotlivými modifikacemi navrhl Berners-Lee standard HTML 2.0. Verze 2.0 je dále rozčleněna do dvou úrovní, z nichž ta první jen lehce rozšiřuje předchozí verzi a druhá úroveň navíc zahrnuje práci s formuláři. Verze HTML 3.0 nebyla nikdy přijata jako standard, neboť byla hodnocena jako příliš mohutný skok vpřed a nenašel se nikdo, kdo by pro tuto verzi implementoval prohlížeč s jeho podporou. Proto se členové W3C shodli na vlastnostech, o které rozšířili verzi 2.0 a vytvořili tak HTML 3.2 ta byla vydána v roce 1997 a zachycuje rysy jazyka v roce Z verze 3.0 zůstali pouze okleštěné tabulky, ostatní prvky 3.2 jsou jen jakousi směsicí, kterou v té době podporovali nejmodernější prohlížeče. Další pokrokovou verzí bylo HTML 4.0 vydáno v roce Specifikace zahrnovala nové prvky pro formuláře a tabulky. A nově byly standardizovány i rámy které dále logicky rozčleňovaly text. Původním účelem této verze bylo, aby jednotlivé prvky označovaly význam daných částí dokumentu, vzhled má být tedy ovlivňován připojenými styly. Opravnou verzí HTML 4.0 bylo HTML 4.01 vydané v roce 1999, tento standard opravuje některé chyby a podle původního předpokladu se mělo jednat o verzi, po které by se přešlo na XHTML kterou budu dále popisovat. Od původního záměru se ale ustoupilo, a v roce 2007 byla založena nová pracovní skupina HTML, která vyvíjí nové verze HTML. Název nové specifikace byla navržena jako HTML 5.0 a měla by být hotová v roce odkdy ji začnou vývojáři internetových stránek používat. Jazyk HTML je definovaný množinou značek, někdy také HTML tagů, a jejich atributů. Mezi značkami se uzavírá text dokumentu, což určí význam obsaženého textu. Část textu, která je uzavřena do otevírací a uzavírací značky, se nazývá element. Ve značce jsou pak definovány atributy, které určují vlastnosti elementu. Značky jsou většinou párové, přičemž počáteční značka je shodná s koncovou, která obsahuje ještě pro ukončení lomítko. Příklad takového HTML kódu je následující : Příklad: <html> <!-- toto je komentář --> <head> <title>titulek stránky</title> </head> <!-- tělo dokumentu --> <body> <h1>nadpis stránky</h1> <p>toto je odstavec dokumentu</p> <a href= >Toto je odkaz</a> 11

10 </body> </html> (Příklad HTML dokumentu) Vysvětlení příkladu: Celý kód je uzavřen do tagů <html></html> které znamenají začátek a konec HTML dokumentu. Dokument je pak opatřen hlavičkou mezi tagy <head></head>, kde je uveden titulek dokumentu. Samotné tělo dokumentu uzavírají tagy <body></body> a v příkladě uvádím pro jednoduchou představu nadpis první úrovně uzavřený mezi tagy <h1></h1>, odstavec dokumentu <p></p> a jednoduchý odkaz na www stránku, který se zapisuje pomocí tagů <a.></a>. Příklad je velice jednoduchý, účelem je spíše jednoduše znázornit to, jak zhruba HTML dokument může vypadat. 1.3 Design pomocí kaskádových stylů CSS CSS (Cascading Style Sheets) neboli tabulky kaskádových stylů jsou nástrojem pro způsob zobrazení webových stránek napsaných ve značkovacích jazycích jako je HTML, XHTML či XML. S příchodem stylů přišla doslova revoluce v tvorbě internetových stránek a aplikací, neboť hlavním smyslem tabulkových stylů je oddělit obsah stránky a její design. To značně ulehčuje práci při návrhu a programování, neboť existuje soubor s koncovkou CSS, nebo část dokumentu v HTML souboru, kde je navržen design stránky, tedy to, jak bude stránka vypadat z grafického hlediska. Samostatný soubor HTML sice poskytuje změnu designu pomocí značek a jejich atributů, ale jestliže chce autor měnit například barvu u několika stejných značek, musí to tak provést změnou atributů u všech těchto značek, což je velice neefektivní a časově náročné. Kaskádové styly tuto nevýhodu odstraňují tím, že se styl (například barva nadpisu) mění pomocí jediného souboru (jediné změny), který se připojí na začátek HTML dokumentu a poté jsou všechny tabulky, nadpisy stejné úrovně, odstavce apod. stejného stylu, například barvy, velikosti, odsazení 12

11 apod. a jediná změna souboru ovlivní vzhled v celém HTML dokumentu. Další výhodou je také možnosti změny designu celého webu, jednoduše a rychle výměnou souboru CSS. Kaskádové styly také urychlují načítání stránek na jednom webu, neboť se při načítání dokumentu soubor se styly nahraje do mezipaměti prohlížeče. Styl se tedy načte jen jednou a tím se zobrazování stránek velice urychlí, což je nespornou výhodou. Nevýhodou CSS je chybná interpretace, ačkoliv se o standardizaci kaskádových stylů stará také konsorcium W3C, ne vždy jsou styly v každém prohlížeči interpretovány stejným způsobem. Jedná se především o prohlížeč Internet Explorer, u kterého se například jinak zobrazuje šířka vnitřního okraje prvku, která se započítává do jeho celkové šířky. Tyto chyby by měly postupně vymizet s nástupem nových verzí Internet Exploreru Použití CSS Jak již bylo řečeno, samotný styl se buď připojí do úvodu dokumentu HTML, nebo se zapíše do samostatného souboru CSS a odkaz se uvede v hlavičce dokumentu. Dalším, ne příliš efektivním způsobem je zapsání stylu přímo u daného elementu stránky, což ale přímo odporuje smyslu využití CSS. Syntaxe jazyka CSS je jednoduchá, deklarace stylů spočívá v nadefinování pravidel pro zobrazování jednotlivých elementů nebo jejich skupin. Každá deklarace začíná jedním nebo několika selektory, které specifikují daný element nebo skupinu elementů. Následuje zápis vlastností (vzhledu) elementu do deklaračního bloku, vlastnost se zapíše jejím specifickým pojmenováním (většinou anglické klíčové slovo), následuje dvojtečka a poté se zapíše hodnota dané vlastnosti. Tím jsme definovali jednu vlastnost elementu, těch může být ale více, pak se oddělují středníkem a celý blok vlastností se uzavře do složených závorek. Pro představu uvádím příklad: 13

12 Příklad: <html> <head> <title>první příklad se stylopisem</title> <style type="text/css"> h1 { /* vzhled nadpisu první úrovně */ margin: 5px; /* okraj šířky 5 pixelů */ font-size: 12pt /* velikost fontu 12 bodů */ } p { /* styl odstavce */ text-align: center; /* text centrovat */ line-height: 10pt; /* výška řádku 10 bodů */ } </style> </head> <body> <h1>nadpis druhé úrovně</h1> <p>odstavec s normálním textem</p> </body> </html> (Styl připojený v hlavičce dokumentu HTML pomocí značek <style></style>) Vysvětlení příkladu: Opět jednoduše naznačuji HTML dokument, nyní však s připojeným CSS stylem mezi tagy <style></style>, takto připojený styl platí pro celý dokument, v němž je umístěn. Jak komentáře naznačují, styl se týká vzhledu nadpisu první úrovně h1{ }. U nadpisu h1 v příkladu zapisujeme, jak široký má být okraj nadpisu první úrovně (margin) a jaká má být velikost písma pro tento druh nadpisu (font-size). Dále je zapsán vzhledu odstavců v dokumentu p{ }. Zápisem říkáme, že každý odstavec bude orientován uprostřed dokumentu (text-align: center;) a výška řádku u odstavce bude 10bodů (line-height: 10pt;). Celý tento styl je uzavřený mezi v hlavičce dokumentu <head><head> a následuje tělo HTML stránky, kde se výše zapsané styly již projevují na textech nadpisu <h1><h1> a odstavce <p></p>. 14

13 Jak již bylo řečeno, styl CSS lze zapsat také do samostatného souboru s koncovkou.css, na který se odkážeme v HTML dokumentu, pro názornost uvádím příklad. Příklad : h1 { /* vzhled nadpisu první úrovně */ margin: 5px; /* okraj šířky 5 pixelů */ font-size: 12pt /* velikost fontu 12 bodů */ } p { /* styl odstavce */ text-align: center; /* text centrovat */ line-height: 10pt; /* výška řádku 10 bodů */ } (ukázka ze samostatného externího souboru styl.css) Vysvětlení: V druhém příkladě vidíme část stylu umístěného v samostatném souboru styl.css. Definují se zde vlastnosti elementů h1 a p (nadpis úrovně 1 a odstavec). Na samotný styl poté uvedeme odkaz v hlavičce dokumentu HTML, jak lze vidět na příkladu. Příklad <html> <head> <title>brelex.cz</title> <link type="text/css" href="styl.css" rel="stylesheet"> </head> <body> </body> </html> (Připojení stylu k dokumentu pomocí odkazu) Vysvětlení V hlavičce dokumentu mezi tagy <html></html> je umístěn odkaz na soubor se stylem stránky pomocí tagu <link >. Typ souboru určuje atribut type. Důležitým atributem je href, kde je uvedena cesta k souboru s CSS stylem. Poslední atribut rel vyjadřuje typ vztahu k dokumentu (stylesheet - styl). 15

14 2 Dynamické webové stránky S dalším rozvojem internetu a World Wide Webu a s příchodem skriptovacích jazyků se začal objevovat termín Dynamické webové stránky. Vlastností těchto stránek je poskytovat interaktivitu ( dynamičnost ) mezi uživatelem a serverem, jsou to tedy stránky, jejichž obsah je generován na základě požadavků uživatelů nebo hodnot proměnných, design a obsah žiji odděleně od sebe, data jsou uložena v databázi a jsou zobrazena tehdy, kdy o ně uživatel žádá, výhodou je že obsah se může měnit pouhým přidáním požadovaných dat do databáze nebo jejich úpravou. V postatě interaktivita může probíhat dvěma způsoby. 2.1 Client-Side Scripting Prvním způsob je Client-Side Scripting, tedy skript běžící na straně uživatele přímo v prohlížeči, který reaguje na jeho chování, sleduje tedy akce myši, klávesnice atp., může ale také reagovat na časové události. Webový prohlížeč je tedy typickou aplikací, která je na straně klienta spuštěna a uvnitř této aplikace běží další aplikace, se kterými uživatel pracuje nebo do nich zapisuje. Využití je tedy vhodné tehdy, kdy server nedisponuje výkonem, který by dostačoval pro připojení a souběžnou práci několika uživatelských aplikací najednou. Navíc aplikace běžící na straně klienta nezatěžují síť zasíláním dat, je zde také rychlejší odezva a zvyšuje se bezpečnost zpracovaný dat, které nejsou vystaveny riziku odposlechu. V praxi to probíhá tak, že se webová stránka načte ze serveru a obsahem dokumentu jsou také zakomponované skripty (aplikace), jejich funkce se však provádí už jen na straně klienta. Technologie, která se pro tento způsob používá, se označuje Dynamické HTML. U Client-Side Scriptingu se využívají skriptovací jazyky jako jsou JavaScript, ActionScript, které se současně používají s technologiemi DHTML (dynamické HTML) a Flash. To vše zajišťuje interaktivou v podobě zvuku, animací a změn textu na dané webové stránce. Příklad použití uvádím níže. 16

15 Příklad: <html> <head> <title>dhtml Test</title> <script> function changeall() { document.getelementbyid('div1').style.color ='blue'; } </script> </head> <body> <div id="div1" style="color: red;" onmouseover="changeall()"> Tento text se po najetí myší obarví modrou barvou... </div> </body> </html> (Příklad použití JavaScriptu (Client-side scriptu) ) Vysvětlení : Mezi atributy <script></script> je umístěn JavaScript, tedy skript, který definuje funkci changeall pro změnu atributu stylu style a jeho barvy color na modrou. Dále je v blokovém elementu <div></div>, který je identifikován pomocí id= div1, umístěn také atribut style, ve kterém definujeme barvu color:red;. Funkci changeall() našeho skriptu voláme v následujícím atributu onmouseover, který označuje uživatelskou událost. Tím je tedy řečeno, že text uvnitř blokového elementu se změní z barvy červené na modrou po najetí myši na tento text. 2.2 Server-Side Scripting Dalším způsob pro zajištění interaktivity je Server-Side Scripting, zde probíhá komunikace výhradně mezi servrem a webovým prohlížečem uživatele. Odpověď serveru a výsledná podoba stránky může být závislá například na datech odeslaných pomocí 17

16 HTML formulářů, na stavech proměnných v URL adrese, na časových hodnotách nebo například na stavu serveru. Ve starších dobách se provádělo server-side scriptování za použití kombinace programovacích jazyků C, Perl a Shell skriptů s využitím Common Gateway Interface. Tyto skripty byly vykonávány operačním systémem, Výsledky byly poté jednoduše odesílány pomocí web servru klientovi. V dnešní době jsou tyto on-line skripty psané v jazycích ASP, PHP a jiné. O jejich vykonání se stará přímo server, nebo nějakým rozšiřující modul. Pomocí Server-Side Scriptingu, je tedy interaktivita zajištěna na straně severu, mezi ty nejznámější programovací jazyky, kterých se v tomto případě využívá, můžeme řadit PHP, ASP, JSP nebo Perl, o některých z nich se dále ještě zmíním. Následující příklad uvádí užití jazyka PHP. Příklad: <form action="vstup.php" method="post"> <input type="text" name="vek"> Zapište váš věk <input type="submit" value="poslat"> </form> <?php $vek = $_POST['vek']; // převezme proměnou vek ze // vstupního pole formuláře if ($vek>=18) {$hlaska="jste zletilý";} // podmínka // jestli je věk větší nebo roven // 18ti do proměnné $hlaska // Zapíše hodnotu Jste zletilý if ($vek<18) {$hlaska="jste nezletilý";} // podmínka, jestli je věk menší // 18 zapíše do proměnné // Jste nezletilý?> <p> <?php echo "$hlaska"; // vypíš proměnnou $hlaska?> Je Vám : 18

17 <?php echo "$vek"; // vypíše proměnnou Věk?> let. </p> (Jednoduchy skript PHP) Vysvětlení: Tento příklad využívá HTML formulář zapsaný pomocí tagů <form ></form>, v kterém je umístěné vstupní pole a odesílací tlačítko (tagy <input>), do kterých uživatel zapíše svůj věk. Formulář se odešle serveru a ten pomocí následujícího PHP skriptu, uzavřeného ve značkách <?php,?>, převezme proměnné z formuláře a vyhodnotí pomocí podmínek (if) zda je uživatel zletilý či nezletilý a výsledek zapíše do proměnné $hlaska. Tato proměnná se poté vypíše jako výsledek pomocí funkce (echo) na obrazovce uživatele. 2.3 Skriptovací jazyky a jejich základní vlastnosti Skriptovací jazyky jsou vysoce úrovňové jazyky pro vytváření programovacích kódů, které jsou interpretovány přímo za chodu, narozdíl například od programů napsaných v programovacím jazyce C nebo C++, které jsou kompilovány pomocí počítačového procesoru a až poté spouštěny. Skriptovací jazyky, jejichž kódy jsou částí HTML dokumetu se obvykle používají pro připojení funkce webové stránce. Nejznámějšími skriptovacími jazyky jsou PHP, ASP, JavaScript, JSP a jiné PHP Tento skriptovací jazyk, za jehož tvůrce se pokládá Dánsko-Grónský programátor Rasmus Leordorf, byl vyvinut v roce 1995 především pro tvorbu webových aplikací. PHP je v podstatě směsí jazyků (Perl, C, Pascal a Java) a je platformě nezávislé, skripty tedy běží bez větších úprav na mnoha operačních systémech. PHP je opensource skriptovací 19

18 jazyk, je tedy volně šiřitelné a pro jeho využití není potřeba koupě licence, má velkou podporu knihoven pro grafické účely, práci s textem, práci se soubory, práci s většinou databázových systémů MySQL, ODBC, Oracle, PostgreSQL, MSSQL. Podporována je také velká řada internetových protokolů FTP, HTTP, POP3, SMTP, SMNP, IMAP. Skripty psaná v jazyce PHP jsou začleněny přímo do HTML nebo XHTML. Obvykle je PHP spuštěno na serveru pod názvem Apache, který slouží jako tzv. filtr pro textové a instrukční toky, uvnitř se tyto instrukce vykonají a výstupem je jen textový soubor většinou v podobě HTML dokumentu. Jak již bylo řečeno, jazyk byl vyvinut pro vývoj a tvorbu dynamických stránek a aplikací a je založen na server-side scriptování, podobně jako ostatní jazyky například ASP od firmy Microsoft nebo JavaServe Pages od Sun Microsistems. Pro PHP je také vyvíjena celá řada frameworků, tedy softwarových struktur, které při vývoji slouží jako podpora velkých webových projektů ve smyslu využití často psaného programového kódu. Jazyk PHP je velice oblíbený díky jeho jednoduchosti použití a také vývojářům nechává částečnou svobodu, protože kombinuje několik programovacích jazyků, to je výhoda tehdy, kdy vývojář přechází například z jazyka C++ na PHP. Proměnné jsou definovány pomocí předpony dolarového symbolu "$" a typ proměnné nemusí být specifikován jako v jiných jazycích, jazyk PHP je dynamicky typový, typ proměnné se nastaví teprve v době přiřazení hodnot, proto má PHP pro porovnávání dva operátory. Při použití operátoru == dojde při porovnání ke konverzi porovnávaných proměnných, druhý operátor je === a porovnání je pravdivé jen jsou-li operandy stejného typu. Na rozdíl od jmen funkcí a tříd se u jmen proměnných rozlišuje velikost písmen. Pro výstup slouží příkaz echo, je jedním z mnoha příkazů který výstup umožňují. PHP má tři typy jak komentovat kód, první je /* */ ten slouží pro blokové komentáře a zbylé dva // a #, které jsou pro řádkové komentáře. PHP má podobný styl syntaxe jako jiné vysoce úrovňové jazyky, podmínky if, smyčky for a while a návratové funkce jsou velice podobné jazykům C, C++, Java nebo Perl. Příklad: // Přiřazení a současná definice proměnných 20

19 $cislo = 200; // definice proměnné typu int $retezec = Můj první řetězec ; // definice proměnné typu string $pole = array('a', 'b', 1, 2 ) // definice heterogenního pole // Výpis proměnných echo $cislo; // vypíše číslo 200 echo $retezec; // vypíše řetězec Můj první řetězec echo $pole; // vypíše heterogenní pole // Test porovnání $cislo = 100; // definice čísla 100 jako proměnné int $retez = '100'; // definice čísla 100 jako řetězce // Toto porovnání ('==') platí díky automatické typové konverzi if ($retez == $cislo) { echo 'Jsou stejné'; } // Ale porovnání pomocí '===' neplatí, neboť nejsou stejné typy if ($retez === $cislo) { echo 'To by nešlo'; } Samotné PHP disponuje stovkami funkcí. Tyto funkce jsou dobře dokumentované na stránkách pro podporu a standardizaci PHP V současné době PHP neposkytuje funkce pro vláknové programování. Samotné funkce se definují klíčovým slovem function a následuje název funkce. Za tímto názvem jsou kulaté závorky, ty jsou prázdné tehdy, kdy funkce nepotřebuje žádné vstupní parametry. Tělo procedury je ohraničeno složenými závorkami a uvnitř může být jakýkoliv funkční PHP kod. Funkce a procedury se v PHP definují stejným klíčovým slovem (function) funkce se ale od procedury liší tím, že vracejí nějakou hodnotu. To zajišťuje klíčové slovo return, výraz, který je uveden za tímto klíčovým slovem a vrácen jako výstup funkce, jakýkoliv kód, který je uveden dále, se již neprovede. Pro znázornění uvádím příklad s popisem. 21

20 Příklad: <?php function DPH ($cena, $sazba) { $vysledek = $cena + (($cena/100)*$sazba); // výpočet ceny s dph return $vysledek; // vrácení výsledku funkce }?> Vysvětlení: Takto může vypadat jednoduchá funkce pro výpočet ceny s DPH. Název funkce je DPH, její vstupní parametry jsou $cena a $sazba. V tělu funkce se spočte DPH a přičte se k ceně položky, výsledek se uloží do proměnné $vysledek. Výsledek se poté pomocí return vrátí jako výstup funkce ASP Active Server Pages (ASP) je dalším server-side skriptovacím jazykem vyvinutým firmou Microsoft. ASP byl jeden z prvních jazyků, který v sobě integroval spouštění aplikací přímo na webovém serveru. Jeho největšími konkurenty jsou jazyky PHP a JSP. ASP je funkčně podobný jazyku PHP, je tedy možno pomocí něj vytvářet kvalitní dynamické HTML stránky, ale na rozdíl od PHP není volně šiřitelný, je u něj třeba koupě licence. Není tedy divu, že jeho podpora na webových serverech není taková jako u PHP. Pro chod webových aplikací napsaných v jazyce ASP je potřeba spuštěný webový server pro ASP. Nejčastěji je to server Microsoft IIS (Internet Information Server). ASP samozřejmě podporuje práci s databázemi na různých platformách, využívá k tomu technologii ODBC (Open Database Connectivity), která je rozhraním pro přístup k různým 22

21 druhům databází například SQL. Nejprve je však nutno mít na serveru nainstalované ovladače pro ODBC a dále definovat datový zdroj. Jazyk ASP definuje tzv. COM (Component Object Model) což je sada objektů, která lze v ASP kódu jednoduše vyvolat. Tyto modely zahrnují skupiny často využívaných funkcí a datových atributů. Mezi objekty ASP patří Application, Session, Request, Response a Server. Například objekt Session je objekt, sloužící pro práci s Cookies, tedy s proměnnými, jejichž hodnoty jsou udržovány při přechodu mezi různými stránkami. Využití leze uvést například tehdy, kdy potřebujeme udržovat hodnoty přihlášeného uživatele, který nakupuje a prochází stránkami naší aplikace internetového obchodu. Další objekt Request slouží například pro získání různých dat přes formuláře nebo dat o klientovi. Vlastnosti a metody Objektu Response pak mohou posloužit například k vracení obsahu prohlížeči. Objekt Server poskytuje různé metody pro převod speciálních znaků na jejich HTML ekvivalenty nebo znaků vhodných pro sestavení URL adresy. Dále je to objekt, který zprostředkovává přístup k různým externím metodám a funkcím. Samotný jazyk ASP se uvnitř HTML kódu odděluje těmito značkami <% a %>.Všechen text (kód) mezi těmito značkami je tedy ještě před odesláním zpracován a vyhodnocen. Pro příklad uvádím jednoduchý skript: Příklad: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="content-type" content="text/html;charset=windows-1250"> <title>první ASP skript</title> </head> <body> <h1>výpis textu pomocí ASP</h1> <% Response.Write "Hello World." %> </body> 23

22 </html> Vysvětlení: Příklad využívá výše zmíněný objekt Response, který pomocí metody Write vypíše text. Výsledkem je tedy vypsání textu Hello World v prohlížeči klienta JavaScript Javascript je typickým příkladem client-side skriptu. Jedná se o interpretovaný skriptovací jazyk, je tedy hned pomocí interpretu po spuštění vykonáván, na rozdíl od překládaných jazyků, kde se musí jazyk pro spuštění nejdříve přeložit překladačem. Slouží pro vytváření dynamických stránek a jeho kód se vkládá přímo do HTML nebo XHTML kódu webových stránek. Ačkoli by se mohlo zdát JavaScript, kromě svého pojmenování, v zásadě nesouvisí s programovacím jazykem Java. Oba jazyky převzaly podobnou syntaxi z programovacího jazyka C. O prvotní vznik JavaScriptu se zasloužil Berndan Eich, tehdejší pracovník firmy Netscape. Tehdy nesl tento skriptovací jazyk jméno Mocha. Později byl přejmenován na LiveScript a nakonec dostal název JavaScript. Pojmenování bylo s největší pravděpodobností marketingovým tahem, neboť budí dojem, že JavaScript vychází z programovacího jazyku Java a firma Netscape tím chtěla dát JavaScriptu punc nového, vysoce kvalitního programovacího jazyka pro webové aplikace, ačkoli kromě pojmenování má podobnou pouze syntaxi. Lidé se mohli s prvními JavaScripty setkat v prohlížeči Netscape ve verzi 2.0B3 v prosinci roku JavaScript byl a je velmi flexibilním programovacím jazykem a proto se stal jedním z nejpopulárnějších a snadno naučitelných skriptovacích jazyků, který se v roce 1997 dočkal také standardizace, asociací ECMA (Europian Computer Manufacutres Association) a v srpnu 1998 asociací ISO (International Organization for Standardization). 24

23 Jak již bylo řečeno primární použití JavaScriptu je vkládání funkcí do HTML, tyto funkce poté mohou vykonávat následující operace: Otevírání kontrolních oken například s různými nástroji nebo samotné navigační menu. Provádění validačních operací, pro akceptaci dat před jejich odesláním na server. Nebo změnu obrázků kurzoru při přejetí myši nad odkazem. Java aplikace je spuštěna v prohlížeči uživatele, z toho důvodu je odezva na spuštěné operace rychlejší než u Server-side skriptu, tím se stává aplikace více živější. Navíc jsou JavaScripty schopné reagovat na uživatelské úkony jako například stisky různých kláves. O překlad JavaScriptů se stará JavaScript Interpreter. Prvním takový překladač byl implementován pomocí jazyka C a to Brendanem Eichem pro prohlížeč Netscape nesoucí název Spider Monkey. Nejběžnějším prostředím pro spouštění java skriptů je tedy webovský prohlížeč, ten typicky používá aplikační programovací rozhraní API pro vytváření objektů programovaných v JavaScriptu. Následující příklad uvádí jednoduchý skript spuštěný v prohlížeči uživatele. <html> <head><title>jednoduchý skript</title></head> <body> <script type="text/javascript"> document.write('ahoj světe!'); </script> </body> </html> Skript jednoduše vypíše pomocí funkce dokument.write() text Ahoj světe do prohlížeče uživatele. 25

24 3 Návrh webových aplikací pomocí WebML V dnešní době vývoje rozsáhlých webových projektů jako jsou internetové obchody, redakční systémy nebo třeba bankovní systémy, je nutné takový projekt přesně analyzovat a navrhnout pro zajištění správné funkčnosti a chodu. Proto v oblasti softwarového inženýrství vznikla metodika pro danou problematiku určená. Je to metodika a také modelovací jazyk WebML (Web Modeling Language) vyvinutý na technické univerzitě v Miláně. WebML nabízí dnešním programátorům webových aplikací posun v oblasti vývoje o jednu úroveň výše. V podstatě se vývojář zabývá již jen analýzou, návrhem a optimalizací aplikace a nestará se o programový kód psaný například v jazyce ASP, to značně snižuje jak finanční tak časové nároky. Výchozím cílem WebML metodiky je tedy podpora návrhu a implementace rozsáhlých webových aplikací, které jsou typické především sběrem a udržování velkého množství dat. Takovými systémy mohou být právě internetové obchody, webové aplikace různých institucí, digitální knihovny nebo velké korporátní portály. WebML je sadou formláních grafických specifikací a podporuje celý životní cyklus vyvíjeného produktu. V dnešní době vzniká i komerční využití tohoto jazyka (metodiky) například v podobě CASE nastroje WebRatio. Metodika je založena na těchto základních modelech datový, hypertextový a prezentační, tím se v podstatě oddělí informační obsah od struktury a navigace webové aplikace. Všechny modely jsou u WebML ukládány ve formátu XML, takto může například vypadat Obrázek č.1 - Strom XML dokumentu 26

25 Datový model je v podstatě konceptuální model, který je víceméně shodný s entitně relačním ER diagramem modelovacího jazyka UML. Jeho hlavním smyslem je návrh datové struktury webové aplikace. Tento model lze po jeho sestavení snadno převést do různých databázových relačních systémů jako je Oracle, MSSQL, PostgreSQL a další. Dalším modelem je model hypertextový, je nejdůležitějším modelem celé metodiky a je složen z dalších dvou modelů. První je kompoziční model, který popisuje samostatné webové stránky a logické části na webových stránkách uložené (unist). A druhý je model navigační, ten sleduje provázanost mezi jednotlivými stránkami. V podstatě se dá říci, že hypertextový model sleduje funkčnost a strukturu aplikace na konceptuální úrovni, tedy na úrovni, kdy ještě není známo, jak bude aplikace vypadat po grafické stránce, a tehdy, kdy nezáleží na implementačních detailech. Posledním modem je model prezentační, který je chápán jako transformace předešlých modelů do konkrétní grafické podoby. Transformace se provede ze strukturálního a hypertextového modelu, které jsou zapsány pomocí značkovacího jazyka XML. Vstupem pro prezentační model je tedy XML dokument. Prezentace proběhne tak, že se připojí dokument se styly XSL ke vzhledu stránek. XSL styly berou jako vstup WebML specifikaci psanou v XML dokumentu, která vyhovuje standardu DTD (definice typu dokumentu) standardu správné struktury. Výstupem jsou poté grafické šablony stránek zahrnující značkovací jazyk a ostatní programové skripty. WebML může obsahovat mnoho předdefinovaných prezentačních šablon stylů. Podrobněji popíši jednotlivými modely v dalších kapitolách. 3.1 Fáze vývoje webové aplikace WebML metodika samozřejmě také definuje přesný návod na to, jak postupovat při celkovém návrhu webové aplikace. WebML metodika nezahrnuje jen fázi návrhu webové aplikace, ale také definuje tzv. Development Process jehož struktura zahrnuje její celý životní cyklus. Do životního cyklu aplikace paří tyto fáze: specifikace požadavků, návrh datového modelu, návrh hypertextového modelu, implementace, testování a údržba. Následující kapitoly bych rád věnoval fázi zadání tedy specifikaci požadavků. 27

26 3.1.1 Specifikace požadavků na aplikaci Tato fáze vývoje je nepochybně jedna z nejdůležitějších fází, která zásadním způsobem ovlivňuje kvalitu a úspěch celého projektu. Nedostatečné úsilí věnované této problematice vede při změně zadání - specifikace požadavků k velice nákladným a pracným zásahům do rozpracovaného či hotového projektu. Proto je nezbytnou nutností věnovat této části maximální pozornost. Kvalita zadání je přímo úměrná kvalitě výsledné webové aplikace. Výsledkem fáze specifikace požadavků je uživatelsky orientovaná a snadno pochopitelná specifikace. Je to soubor požadavků na webovou aplikaci, který je srozumitelný pro obě strany, jak pro stranu zákazníka tak dodavatele. Specifikace požadavků se skládá ze dvou částí, kterými jsou sběr požadavků a analýza požadavků. Sběr požadavků je fáze, ve které musíme vytvořit základní obraz budované aplikace. Požadavky na aplikaci nejčastěji získáme při konzultacích se zákazníkem, nebo také sběrem různých druhů dokumentace týkajících se našeho projektu. Zkušenější zákazníci dodávají kvalitní soubor požadavků, který vytvořili na základě schvalování budoucí aplikace. Tyto dokumenty nám samozřejmě mohou také velice pomoci. Při sběru požadavků rozlišujeme následující typy informací: Uživatelská identifikace jedná se o sepsání druhů uživatelů, kteří budou hotovou aplikaci používat. Funkční požadavky popisují veškeré funkce, které bude vyvíjená aplikace poskytovat. Patří mezi základní část sběru požadavků. Pro tento účel slouží nejčastěji Use-Case diagramy často využívané i v jiných metodikách týkajících se návrhu softwaru. Požadavky na data - slouží pro identifikaci veškerých dat, se kterými bude naše aplikace pracovat. Jedná se spíše o konceptuální návrh, kompletní návrh se provede až v datovém modelu. Požadavky na personalizaci jedná se o koncept návrhu obsahu a funkcí pro různé uživatele, založený na přístupových právech a jiných preferencích. Nefunkční požadavky popisují především technologické požadavky, tedy například požadavky jako jsou: 28

27 použitelnost (přístupnost aplikace tak, aby se uživatel v aplikaci jednoduše orientoval a mohl aplikaci snadno obsluhovat), výkonnost udává se v počtu operací, které zvládne webová aplikace provézt za jednotku času a také časovou odezvu při práci s aplikací. bezpečnost definice požadavků na ochranu dat, osobních údajů, autentifikace uživatelů, šifrování dat mezi uživatelem a aplikací atp.. rozšířitelnost popisuje požadavky na jednoduchost rozšíření aplikace v důsledku různých změn nebo úprav požadavků. Další fází při specifikaci požadavků je analýza požadavků, ta se týká formalizací požadavků, které jsme získali při jejich sběru v předešlé fázi. Nejdříve bude nutné rozdělit jednotlivé uživatele naší aplikace do různých skupin. Ke každé skupině bychom měli sepsat jejich popis, dále případy užití aplikace, data která budeme u dané skupiny sledovat (jméno, příjmení, ), kdo bude nadřazenou/podřazenou skupinou dané skupiny uživatelů a také popis dat, ke kterým bude mít uživatel přístup a které bude moci spravovat. Analýza požadavků se dále týká Use-Case diagramů. Tyto diagramy jsou také často využívány i v jiných metodikách - nejznámější např. UML (unified modeling language), použití a notace je prakticky stejná i u WebML metodiky. Use-Case diagramy formálně popisují případy užití skupin uživatelů. Každá skupina má své specifické případy užití, u kterých je nutno popsat jejich průběh, různé podmínky (vstupní, výstupní) a účel. Příkladem případu užití může být například sestavení (zadání) semestrální práce a jejich náležitostí vyučujícím. Use-Case tohoto příkladu uvádím na obrázku

28 Obrázek č.1 Use-Case zadání semestrální práce. Obrázek č.29 ukazuje jednoduchý případ užití, kdy kantor jako reprezentant jedné skupiny uživatelů sestavuje zadání pro studenty s jeho dalšími náležitostmi. Nejprve sestaví samotné zadání, poté vybere studenty (řešitele) tohoto zadání ze seznamu (výběr je ošetřen smyčkou), dále zadá termín odevzdání, popřípadě více termínů a nakonec zapíše popis požadovaného zadání a systém odešle automaticky vybraným studentům, který je informuje o zadané semestrální práci. Další záležitostí při řešení analýzy požadavků je sestavení datového slovníku (Data Dictionary). při jeho sepisování se snažíme nalézt veškeré důležité objekty resp. entity, které jsme nalezli při sběru požadavků. Každý takovýto objekt je identifikován jménem, popisem, základními vlastnostmi, příkladem instancí a vztahy s jinými objekty. Součástí analýzy požadavků je také sestavení mapy webové aplikace. Tento krok je možný po výše zmíněných fází analýzy požadavků, kdy máme sestaveny skupiny uživatelů, připravené případy užití systému (Use-Case diagramy) a sepsaný datový slovník. Toto vše nám slouží jako vstup při tvorbě těchto map. Výstupem jsou poté mapy webové aplikace představující určité pohledy na webové stránky. Počet těchto pohledů je závislý na počtu uživatelských skupin a požadavků na personalizaci aplikace. Každá taková mapa je poté definována parametry jako jsou jméno, popis mapy, skupina, pro kterou je daná mapa určena, případy užití, které se týkají dané mapy a nakonec oblasti, do kterých se mapa rozčleňuje. 30

29 Poslední částí, kterou bych rád zmínil, je definice základních grafických elementů webové aplikace, tedy sestavení základního grafického návrhu. Návrh zahrnuje rozložení nejrůznějších sloupců, tabulek nebo buněk uvnitř stránek. Součástí je také návrh rozmístění navigačních komponent, grafických reklamních prostředků (loga,banery). Návrh se také týká stylu nadpisů, odstavců a dalších textových prvků. Mezi základní požadavky grafického návrhu samozřejmě patří také kompatibilita mezi webovými prohlížeči. 3.2 Datový model Jak jsem již uvedl, datový model slouží k modelování datové struktury pro webové aplikace a jejich databázové systémy. Datové modelování je základem každé softwarové analýzy, a proto se nevyhne ani modelování webových aplikací. Datové struktuře by se měl klást veliký význam, neboť zásadně ovlivňuje správný chod, udržitelnost a rozšiřitelnost webové aplikace. Výsledkem je konceptuální datový model, který vytváří jednoduchý a srozumitelný pohled na data, kdy výsledná podoba tohoto modelu není závislá na implementaci. Model je v podstatě zobecněním datové struktury, která se může dále implementovat pro různé databázové systémy, jako jsou MySQL, Oracle apod.. U datového modelování se nejprve vytváří konceptuální model. Základním prvkem konceptuálního modelu je entita její instance a vztah mezi entitami. Entita je prvek, který definuje daný soubor objektů reálného světa pod jedním jménem. Příkladem může být entita student, osoba, pacient. Její instance pak může být např. Jan Novák, Petr Malina, Josef Novotný. Každá entita dále disponuje svými atributy. Atribut můžeme popsat jako vlastnost dané entity, tak například u entity osoba můžeme sledovat atributy jméno, adresa, telefon nebo věk. Ke každému atributu náleží také jeho datový typ, metodika WebML definuje následující datové typy : INTEGER STRING FLOAT DATE TEXT TIME 31

30 URL BLOB BOOLEAN Entity s jejími atributy uvádím na příkladě : Obrázek č.2 Entita Kniha s atributy (Titul, Rok Cena, Obrázek). Z předešlého textu vyplývá, že všechny modely ve WebML jsou vnitřně ukládány v jazyce XML. Definice naší entity Kniha v XML pak vypadá následujícím způsobem: <ENTITY id= Kniha > </ENTITY> <ATRIBUTE id= Titul type= String /> <ATRIBUTE id= Rok type= String /> <ATRIBUTE id= Cena type= Float /> <ATRIBUTE id= Obrázek type= Image /> Vztahy mezi entitami a kardinalita Víme již že, mezi entitami existují vztahy. WebML povoluje pouze binární vztahy, tedy vztahy vznikající jen mezi dvěma objekty. Vztahy se používají pro modelování mnoho 32

31 různých typů vazeb (fyzická, logická, závislostní atp. ) mezi entitami. Dále je nutné definovat termín role, který značí jeden ze směrů, na který můžeme pohlížet ve vztahu. Příklad vztahu je na obrázku č.3. Obrázek č.3 - Vazba mezi dvěma entitami (Autor, Kniha). Pro každý směr vztahu může dále existovat kardinalita vztahu. Kardinalita představuje minimální nebo maximální počet instancí u dané entity. Pro jednoduchost uvedu výše uvedený příklad. Máme vztah mezi instancemi Kniha a Autor, u role autorem_knihy je kardinalita 0:N, která říká, že autor může vydávat žádnou nebo více knih. V opačném směru kniha_od_autora je kardinalita 1:N a znamená, že kniha je napsána minimálně jedním nebo více autory. Vše je pro názornost ještě uvedeno na obrázku č.4. Obrázek č.4 - Vazba mezi dvěma entitami (Autor, Kniha) s kardinalitami 33

32 Kardinalita u datového modelování důležitou součástí, protože více zpřehledňuje datový model, který je pak více srozumitelný, jak pro analytika, tak pro programátora. Navíc má velký vliv na design fyzické struktury dat ukládaných v databázi stránky Strukturované atributy Strukturovaný atribut je atribut, který má svou vnitřní strukturu. Prakticky to znamená, že má entita atribut nebo kolekci atributů, které mají svou vnitřní stavbu. Metodika WebML řeší tuto problematiku pomocí tzv. slabých entit (weak entity) a to tak, že se k hlavní entitě vytvoří jiná entita, která nemůže existovat bez té hlavní. Mezi hlavní a závislou entitou se vytvoří vztah a definuje se potřebná kardinalita. Příklad strukturovaného atributu může být ten, kdy u jedné osoby sledujeme více adres. Pro lepší představu uvádím obrázek č.5. Obrázek č.5 Strukturovaný atribut I SA hierarchie Jako v jiných metodikách, tak i WebML umožňuje definici hierarchie entit nebo-li tzv. I-SA hierarchie někdy také generalizaci. Je to v podstatě spojení dvou entit tak, že jedna entita je nadřazena té druhé. Podřazená entita nikdy nemůže existovat bez nadřazené a dědí po ní její atributy. Hierarchie může mít několik úrovní, avšak podřazená entita může mít pouze jednu entitu, která je jí nadřazená. 34

33 Obrázek č.6 - Generalizace mezi entitami Příklad datového modelu Jako závěr této kapitoly uvádím příklad návrhu datového modelu, který byl implementován do dnes funkčního internetového obchodu. Tento příklad mi byl inspirací z učebních materiálů z internetových stránek Entity, které se vyskytují v našem modelu, zjistíme ve fázi sběru funkčních požadavků, který je nedílnou součástí analýzy každého softwarového projektu a je prováděna v úvodní části všech návrhů. Funkční požadavky konzultujeme se zákazníkem a na základě těchto rozhovorů sestavíme seznam všech potřebných entit nutných pro návrh datového modelu. Dále ke každé entitě vytvoříme její atributy a vazby, tím vznikne kompletní datový model. V našem názorném příkladě se jedná o společnost, která se zabývá prodejem nábytku po celém světě a její snahou je přilákat další zákazníky tím, že vytvoří webovou aplikaci / internetový obchod s nabídkou svých produktů. U aplikace / internetového obchodu budeme sledovat tyto entity: produkty, které firma nabízí, speciální nabídku tj. kombinaci zboží prodaného za zvýhodněnou cenu. Dále sledujeme zásoby produktu, jeho technický popis a jeho fotografii(grafické znázornění). První návrh konceptuálního datového modelu by tedy mohl vypadat takto: 35

34 Obrázek č.7 Návrh datového modelu internetového obchodu ACME. Jak je vidět, všechny jmenované entity jsou znázorněny i s jejich kardinalitami. Speciální nabídka je kombinací zboží a je ve vztahu s entitou produkt. U entity produkt je kardinalita 0:N a znamená, že 0 nebo více produktů je obsaženo v kombinaci. Kardinalita 1:N u kombinace vypovídá, že součástí kombinace může být minimálně jeden nebo několik produktů. Dalším vztahem je produkt-fotografie, zde je u produktu kardinalita 0:N, která říká, že produkt má žádnou nebo několik fotografií, a kardinalita 1:1 naznačuje, že právě jedna fotografie patří pouze k jednomu produktu. Každý produkt dále obsahuje technický popis. Ve vztahu kardinalita 0:1 znamená, že produkt má buď žádný, nebo maximálně jeden technický popis a právě jeden popis patří maximálně k jednomu produktu, což naznačuje kardinalita 1:1. Poslední entita zásoba není ve vztahu k žádné z předešlých entit a s louží k informativním účelům o stavu zásob v různých prodejnách na celém světě. Dále nám chybí v modelu definice atributů u jednotlivých entit. Entity, jejich vztahy a atributy můžeme také odhalit analýzou grafických náhledů stránek. Při analýze hledáme objekty na stránkách, které nám odhalí entity a atributy a seznamy objektů, které nám usnadní nalezení vztahů mezi entitami. Názorný příklad toho, jak je možné odhalit entitu s jejími atributy v náhledu stránky lze vidět na obrázku č

35 Obrázek č.8 - Náhled stránky a odvození entity produkt. Obrázek č.9 Hotový datový (strukturální) model. 3.3 Hypertextový model Po dokončení datového modelu následuje neméně důležitá část, která na datový model přímo navazuje. Jedná se o hypertextový model, který popisuje logickou strukturu uspořádání a funkčnost jednotlivých stránek. Hypertextový model také definuje odkazy mezi jednotlivými stránkami a částmi stránek. V podstatě se hypertextové modelování skládá ze dvou neoddělitelných sub-modelů, kde není možná existence jeden bez druhého. Jedná se o model kompozice a model navigace Model kompozice WebML definuje kompoziční model jako logické uspořádání elementů na každé webové stránce. Každá webová stránka je tedy sestavena z tzv. Units (elementárních částí) jsou to atomické informační prvky stránek a mají své charakteristické vlastnosti. Každá Unit musí získávat nějakým způsobem svůj obsah, pro tento účel se Units skládají ze 37

Databázové aplikace pro internetové prostředí. 01 - PHP úvod, základní princip, vkládání skriptu, komentáře, výpis na obrazovku

Databázové aplikace pro internetové prostředí. 01 - PHP úvod, základní princip, vkládání skriptu, komentáře, výpis na obrazovku Databázové aplikace pro internetové prostředí 01 - PHP úvod, základní princip, vkládání skriptu, komentáře, výpis na obrazovku Projekt: Inovace výuky prostřednictvím ICT Registrační číslo: CZ.1.07/1.5.00/34.250

Více

Vývoj Internetových Aplikací

Vývoj Internetových Aplikací 2 Vývoj Internetových Aplikací HTML a CSS Ing. Michal Radecký, Ph.D. www.cs.vsb.cz/radecky HTML a CSS - Tvorba webových stránek - Struktura - Obsah - Vzhled - Funkcionalita zdroj: http://www.99points.info

Více

PHP PHP je skriptovací programovací jazyk dynamických internetových stránek PHP je nezávislý na platformě

PHP PHP je skriptovací programovací jazyk dynamických internetových stránek PHP je nezávislý na platformě PHP PHP původně znamenalo Personal Home Page a vzniklo v roce 1996, od té doby prošlo velkými změnami a nyní tato zkratka znamená Hypertext Preprocessor. PHP je skriptovací programovací jazyk, určený především

Více

Tvorba webových stránek

Tvorba webových stránek Tvorba webových stránek Kaskádové styly Úprava vzhledu webové stránky pomocí atributů má několik nevýhod a úskalí. Atributy nabízejí málo možností úprav. Obtížně se sjednocují změny na různých částech

Více

Škola: Gymnázium, Brno, Slovanské náměstí 7 III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Název projektu: Inovace výuky na GSN

Škola: Gymnázium, Brno, Slovanské náměstí 7 III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Název projektu: Inovace výuky na GSN Škola: Gymnázium, Brno, Slovanské náměstí 7 Šablona: III/2 Inovace a zkvalitnění výuky prostřednictvím ICT Název projektu: Inovace výuky na GSN prostřednictvím ICT Číslo projektu: CZ.1.07/1.5.00/34.0940

Více

Internet 2 css, skriptování, dynamické prvky

Internet 2 css, skriptování, dynamické prvky Internet 2 css, skriptování, dynamické prvky Martin Hejtmánek hejtmmar@fjfi.cvut.cz http://kmlinux.fjfi.cvut.cz/ hejtmmar Počítačový kurs Univerzity třetího věku na FJFI ČVUT Znalci 26. března 2009 Dnešní

Více

(X)HTML, CSS a jquery

(X)HTML, CSS a jquery Prezentační vrstva webové aplikace (X)HTML, CSS a jquery jquery Java Scriptová knihovna Ing. Martin Dostal (X)HTML první stránka Textový soubor s příponou.htm nebo.html: moje

Více

Tvorba WWW stránek. přehled technologií používaných na webu principy jednotlivých technologií a možnosti jejich vzájemného kombinování

Tvorba WWW stránek. přehled technologií používaných na webu principy jednotlivých technologií a možnosti jejich vzájemného kombinování Tvorba WWW stránek přehled technologií používaných na webu principy jednotlivých technologií a možnosti jejich vzájemného kombinování HTML/XHTML kaskádové styly PHP spolupráce PHP s databázemi Technologie

Více

HTML Hypertext Markup Language

HTML Hypertext Markup Language HTML Hypertext Markup Language je jazyk určený na publikování a distribuci dokumentů na Webu velmi jednoduchý jazyk používá ho mnoho uživatelů má výkonné prostředky (příkazy) k formátování dokumentů (různé

Více

INOVACE PŘEDMĚTŮ ICT. MODUL 11: PROGRAMOVÁNÍ WEBOVÝCH APLIKLACÍ Metodika

INOVACE PŘEDMĚTŮ ICT. MODUL 11: PROGRAMOVÁNÍ WEBOVÝCH APLIKLACÍ Metodika Vyšší odborná škola ekonomická a zdravotnická a Střední škola, Boskovice INOVACE PŘEDMĚTŮ ICT MODUL 11: PROGRAMOVÁNÍ WEBOVÝCH APLIKLACÍ Metodika Zpracoval: Jaroslav Kotlán srpen 2009s Úvod Modul Programování

Více

language="javascript">... .

language=javascript>... </script>. WWW (World Wide Web) je dnes společně s elektronickou poštou nejvyužívanější službou internetu. URL (Uniform Resource Locator) slouží ke kompletní adresaci informace na internetu. Udává jak protokol, který

Více

Maturitní otázky z předmětu PROGRAMOVÁNÍ

Maturitní otázky z předmětu PROGRAMOVÁNÍ Wichterlovo gymnázium, Ostrava-Poruba, příspěvková organizace Maturitní otázky z předmětu PROGRAMOVÁNÍ 1. Algoritmus a jeho vlastnosti algoritmus a jeho vlastnosti, formy zápisu algoritmu ověřování správnosti

Více

rychlý vývoj webových aplikací nezávislých na platformě Jiří Kosek

rychlý vývoj webových aplikací nezávislých na platformě Jiří Kosek rychlý vývoj webových aplikací nezávislých na platformě Jiří Kosek Co je to webová aplikace? příklady virtuální obchodní dům intranetový IS podniku vyhledávací služby aplikace jako každá jiná přístupná

Více

MATURITNÍ OTÁZKY ELEKTROTECHNIKA - POČÍTAČOVÉ SYSTÉMY 2003/2004 PROGRAMOVÉ VYBAVENÍ POČÍTAČŮ

MATURITNÍ OTÁZKY ELEKTROTECHNIKA - POČÍTAČOVÉ SYSTÉMY 2003/2004 PROGRAMOVÉ VYBAVENÍ POČÍTAČŮ MATURITNÍ OTÁZKY ELEKTROTECHNIKA - POČÍTAČOVÉ SYSTÉMY 2003/2004 PROGRAMOVÉ VYBAVENÍ POČÍTAČŮ 1) PROGRAM, ZDROJOVÝ KÓD, PŘEKLAD PROGRAMU 3 2) HISTORIE TVORBY PROGRAMŮ 3 3) SYNTAXE A SÉMANTIKA 3 4) SPECIFIKACE

Více

Inovace výuky prostřednictvím šablon pro SŠ

Inovace výuky prostřednictvím šablon pro SŠ Název projektu Číslo projektu Název školy Autor Název šablony Název DUMu Stupeň a typ vzdělávání Vzdělávací oblast Vzdělávací obor Tematický okruh Inovace výuky prostřednictvím šablon pro SŠ CZ.1.07/1.5.00/34.0748

Více

HTML XHTML JavaScript PHP ASP.Net Zajímavé odkazy

HTML XHTML JavaScript PHP ASP.Net Zajímavé odkazy V čem se píší web. dokumenty HTML XHTML JavaScript PHP ASP.Net Zajímavé odkazy HTML HTML (HyperText Markup Language, značkovací jazyk pro hypertext) standart pro vytváření stránek v systému aplikací World

Více

VÝUKOVÝ MATERIÁL. Bratislavská 2166, 407 47 Varnsdorf, IČO: 18383874 www.vosassvdf.cz, tel. +420412372632 Číslo projektu

VÝUKOVÝ MATERIÁL. Bratislavská 2166, 407 47 Varnsdorf, IČO: 18383874 www.vosassvdf.cz, tel. +420412372632 Číslo projektu VÝUKOVÝ MATERIÁL Identifikační údaje školy Vyšší odborná škola a Střední škola, Varnsdorf, příspěvková organizace Bratislavská 2166, 407 47 Varnsdorf, IČO: 18383874 www.vosassvdf.cz, tel. +420412372632

Více

STŘEDNÍ ŠKOLA INFORMAČNÍCH TECHNOLOGIÍ A SOCIÁLNÍ PÉČE

STŘEDNÍ ŠKOLA INFORMAČNÍCH TECHNOLOGIÍ A SOCIÁLNÍ PÉČE STŘEDNÍ ŠKOLA INFORMAČNÍCH TECHNOLOGIÍ A SOCIÁLNÍ PÉČE WEBOWÉ STRÁNKY TŘÍD KAMIL POPELKA ZÁVĚREČNÁ MATURITNÍ PRÁCE BRNO 2011 Prohlášení Prohlašuji, že maturitní práce je mým původním autorským dílem, které

Více

HTML - Úvod. Zpracoval: Petr Lasák

HTML - Úvod. Zpracoval: Petr Lasák HTML - Úvod Zpracoval: Petr Lasák Je značkovací jazyk, popisující obsah HTML stránek Je z rodiny SGML jazyků, jako např. XML, DOCX, XLSX Nejedná se o programovací ale značkovací jazyk Dynamičnost dodávají

Více

APLIKACE XML PRO INTERNET

APLIKACE XML PRO INTERNET APLIKACE XML PRO INTERNET Jaroslav Ráček Fakulta Informatiky, Masarykova Universita Brno Abstrakt Text je věnován možnostem využití XML technologie pro prezentaci dokumentů pomocí Internetu. V úvodu je

Více

Vstupní požadavky, doporučení a metodické pokyny

Vstupní požadavky, doporučení a metodické pokyny Název modulu: Základy PHP Označení: C9 Stručná charakteristika modulu Modul je orientován na tvorbu dynamických stánek aktualizovaných podle kontextu volání. Jazyk PHP umožňuje velmi jednoduchým způsobem

Více

VÝVOJ INTERNETOVÝCH APLIKACÍ - VIA

VÝVOJ INTERNETOVÝCH APLIKACÍ - VIA Metodický list č. 1 Způsob zakončení : Úvod Technologie webových aplikací Protokol HTTP Po zvládnutí tématického celku bude student mít základní přehled o problematice programování internetových (webových)

Více

Nové přístupy tvorby web site. Doc. Ing. Zdeněk Havlíček, CSc. KIT PEF CZU - 13/11/2001

Nové přístupy tvorby web site. Doc. Ing. Zdeněk Havlíček, CSc. KIT PEF CZU - 13/11/2001 Nové přístupy tvorby web site Doc. Ing. Zdeněk Havlíček, CSc. KIT PEF CZU - 13/11/2001 Osnova Úvod Web site - jasný cíl Technologie - dynamický web Forma - vyšší interaktivita Obsah - stálá aktualizace

Více

Současný svět Projekt č. CZ.2.17/3.1.00/32038, podpořený Evropským sociálním fondem v rámci Operačního programu Praha adaptabilita

Současný svět Projekt č. CZ.2.17/3.1.00/32038, podpořený Evropským sociálním fondem v rámci Operačního programu Praha adaptabilita Aktivní webové stránky Úvod: - statické webové stránky: pevně vytvořený kód HTML uložený na serveru, ke kterému se přistupuje obvykle pomocí protokolu HTTP (HTTPS - zabezpečený). Je možno používat i různé

Více

Olga Rudikova 2. ročník APIN

Olga Rudikova 2. ročník APIN Olga Rudikova 2. ročník APIN Redakční (publikační) systém neboli CMS - content management system (systém pro správu obsahu) je software zajišťující správu dokumentů, nejčastěji webového obsahu. (webová

Více

Ing. Přemysl Brada, MSc., Ph.D. Ing. Martin Dostal. Katedra informatiky a výpočetní techniky, FAV, ZČU v Plzni

Ing. Přemysl Brada, MSc., Ph.D. Ing. Martin Dostal. Katedra informatiky a výpočetní techniky, FAV, ZČU v Plzni Webové aplikace Ing. Přemysl Brada, MSc., Ph.D. Ing. Martin Dostal Katedra informatiky a výpočetní techniky, FAV, ZČU v Plzni Harmonogram Dopolední blok 9:00 12:30 Ing. Dostal Úvod, XHTML + CSS Ing. Brada,

Více

Tvorba webu. Úvod a základní principy. Martin Urza

Tvorba webu. Úvod a základní principy. Martin Urza Tvorba webu Úvod a základní principy Martin Urza World Wide Web (WWW) World Wide Web (doslova celosvětová pavučina ) je označení pro mnoho dokumentů rozmístěných na různých serverech po celém světě. Tyto

Více

Základy WWW publikování

Základy WWW publikování Ing. Igor Kopetschke Oddělení aplikované informatiky Ústav nových technologií a aplikované informatiky Fakulta mechatroniky a mezioborových inženýrských studií Technická univerzita v Liberci Email : igor.kopetschke@tul.cz

Více

Mgr. Vlastislav Kučera přednáška č. 1

Mgr. Vlastislav Kučera přednáška č. 1 Mgr. Vlastislav Kučera přednáška č. 1 jazyk (x)html kaskádové styly Castro, E.: HTML, XHTML a CSS. CPress, 2007 Písek, S.: HTML a XHTML, začínáme programovat. Grada Publishing, 2003 Wempen, F.: HTML a

Více

PHP tutoriál (základy PHP snadno a rychle)

PHP tutoriál (základy PHP snadno a rychle) PHP tutoriál (základy PHP snadno a rychle) Druhá, vylepšená offline verze. Připravil Štěpán Mátl, http://khamos.wz.cz Chceš se naučit základy PHP? V tom případě si prostuduj tento rychlý průvodce. Nejdříve

Více

Čtvrtek 3. listopadu. Makra v Excelu. Obecná definice makra: Spouštění makra: Druhy maker, způsoby tvorby a jejich ukládání

Čtvrtek 3. listopadu. Makra v Excelu. Obecná definice makra: Spouštění makra: Druhy maker, způsoby tvorby a jejich ukládání Čtvrtek 3. listopadu Makra v Excelu Obecná definice makra: Podle definice je makro strukturovanou definicí jedné nebo několika akcí, které chceme, aby MS Excel vykonal jako odezvu na nějakou námi definovanou

Více

Kaskádové styly základy grafiky

Kaskádové styly základy grafiky 1 Kaskádové styly základy grafiky Vymezení pojmů Historie Základy stylů 2 Co je to CSS? Vznik CSS a je možné zařadit přibližně do roku 1997. Pojem CSS by se dal shrnout definicí :"souhrn pravidel a metod

Více

24-2-2 PROMĚNNÉ, KONSTANTY A DATOVÉ TYPY TEORIE DATUM VYTVOŘENÍ: 23.7.2013 KLÍČOVÁ AKTIVITA: 02 PROGRAMOVÁNÍ 2. ROČNÍK (PRG2) HODINOVÁ DOTACE: 1

24-2-2 PROMĚNNÉ, KONSTANTY A DATOVÉ TYPY TEORIE DATUM VYTVOŘENÍ: 23.7.2013 KLÍČOVÁ AKTIVITA: 02 PROGRAMOVÁNÍ 2. ROČNÍK (PRG2) HODINOVÁ DOTACE: 1 24-2-2 PROMĚNNÉ, KONSTANTY A DATOVÉ TYPY TEORIE AUTOR DOKUMENTU: MGR. MARTINA SUKOVÁ DATUM VYTVOŘENÍ: 23.7.2013 KLÍČOVÁ AKTIVITA: 02 UČIVO: STUDIJNÍ OBOR: PROGRAMOVÁNÍ 2. ROČNÍK (PRG2) INFORMAČNÍ TECHNOLOGIE

Více

DELTA - STŘEDNÍ ŠKOLA INFORMATIKY A EKONOMIE, s.r.o. Obor informační technologie AJAX ESHOP. Maturitní projekt. Třída:

DELTA - STŘEDNÍ ŠKOLA INFORMATIKY A EKONOMIE, s.r.o. Obor informační technologie AJAX ESHOP. Maturitní projekt. Třída: DELTA - STŘEDNÍ ŠKOLA INFORMATIKY A EKONOMIE, s.r.o. Obor informační technologie AJAX ESHOP Maturitní projekt Vypracoval: Denis Ptáček Třída: 4B Rok: 2014/2015 Obsah 1. Použité nástroje... 3 1.1 NetBeans

Více

14. Jazyk HTML (vývoj, principy, funkce, kostra stránky). Jazyk XML, XHTML. Algoritmizace - cyklus for, while a do while, implementace v jazyce

14. Jazyk HTML (vývoj, principy, funkce, kostra stránky). Jazyk XML, XHTML. Algoritmizace - cyklus for, while a do while, implementace v jazyce 4. Jazyk HTML (vývoj, principy, funkce, kostra stránky). Jazyk XML, XHTML. Algoritmizace - cyklus for, while a do while, implementace v jazyce PHP. HyperText Markup Language Z Wikipedie, otevřené encyklopedie

Více

8.2 Používání a tvorba databází

8.2 Používání a tvorba databází 8.2 Používání a tvorba databází Slide 1 8.2.1 Základní pojmy z oblasti relačních databází Slide 2 Databáze ~ Evidence lidí peněz věcí... výběry, výpisy, početní úkony Slide 3 Pojmy tabulka, pole, záznam

Více

Jazyk XSL XPath XPath XML. Jazyk XSL - rychlá transformace dokumentů. PhDr. Milan Novák, Ph.D. KIN PF JU České Budějovice. 9.

Jazyk XSL XPath XPath XML. Jazyk XSL - rychlá transformace dokumentů. PhDr. Milan Novák, Ph.D. KIN PF JU České Budějovice. 9. Jazyk XSL - rychlá transformace dokumentů 9. prosince 2010 Osnova 1 Jazyk XSL Úvod Princip zpracování pomocí stylů Formátování dokumentu pomocí XSL FO Osnova 1 Jazyk XSL Úvod Princip zpracování pomocí

Více

Mgr. Vlastislav Kučera přednáška č. 1

Mgr. Vlastislav Kučera přednáška č. 1 Mgr. Vlastislav Kučera přednáška č. 1 jazyk HTML5 CSS3 HTML5 a CSS3: CASTRO, E. HTML5 a CSS3. Computer press, 2012 GOLDSTEIN, A., LAZARIS, L. a WEYL, E. HTML5 a CSS3 pro webové designéry. Brno: Zoner Press,

Více

Maturitní témata Školní rok: 2015/2016

Maturitní témata Školní rok: 2015/2016 Maturitní témata Školní rok: 2015/2016 Ředitel školy: Předmětová komise: Předseda předmětové komise: Předmět: PhDr. Karel Goš Informatika a výpočetní technika Mgr. Ivan Studnička Informatika a výpočetní

Více

Unifikovaný modelovací jazyk UML

Unifikovaný modelovací jazyk UML Unifikovaný modelovací jazyk UML Karel Richta katedra počíta tačů FEL ČVUT Praha richta@fel fel.cvut.czcz Motto: Komunikačním m prostředkem informační komunity se postupem času stala angličtina. Chcete-li

Více

PHP framework Nette. Kapitola 1. 1.1 Úvod. 1.2 Architektura Nette

PHP framework Nette. Kapitola 1. 1.1 Úvod. 1.2 Architektura Nette Kapitola 1 PHP framework Nette 1.1 Úvod Zkratka PHP (z anglického PHP: Hypertext Preprocessor) označuje populární skriptovací jazyk primárně navržený pro vývoj webových aplikací. Jeho oblíbenost vyplývá

Více

Inovace bakalářského studijního oboru Aplikovaná chemie http://aplchem.upol.cz

Inovace bakalářského studijního oboru Aplikovaná chemie http://aplchem.upol.cz Inovace bakalářského studijního oboru Aplikovaná chemie http://aplchem.upol.cz CZ.1.07/2.2.00/15.0247 Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky. Tvorba

Více

MBI - technologická realizace modelu

MBI - technologická realizace modelu MBI - technologická realizace modelu 22.1.2015 MBI, Management byznys informatiky Snímek 1 Agenda Technická realizace portálu MBI. Cíle a principy technického řešení. 1.Obsah portálu - objekty v hierarchiích,

Více

První kapitola úvod do problematiky

První kapitola úvod do problematiky První kapitola úvod do problematiky Co je to Flex Adobe Flex je ActionSript (AS) framework pro tvorbu Rich Internet Aplications (RIA), tedy knihovna AS tříd pro Flash. Flex používáme k vytvoření SWF souboru

Více

Webové stránky. 2. Úvod do jazyka HTML. Datum vytvoření: 11. 9. 2012. str ánk y. Vytvořil: Petr Lerch. www.isspolygr.cz

Webové stránky. 2. Úvod do jazyka HTML. Datum vytvoření: 11. 9. 2012. str ánk y. Vytvořil: Petr Lerch. www.isspolygr.cz Webové stránky 2. Úvod do jazyka HTML Vytvořil: Petr Lerch www.isspolygr.cz Datum vytvoření: 11. 9. 2012 Webové Strana: 1/6 Škola Ročník Název projektu Číslo projektu Číslo a název šablony Autor Tématická

Více

1. Úvod do Ajaxu 11. Jak Ajax funguje? 13

1. Úvod do Ajaxu 11. Jak Ajax funguje? 13 Obsah Úvodem 9 1. Úvod do Ajaxu 11 Jak Ajax funguje? 13 Popis 13 Ukázky 13 Jaké jsou možnosti tvorby interaktivních webových aplikací? 15 Co je třeba znát? 16 Jak fungují technologie Ajaxu 16 Jak funguje

Více

Tvorba fotogalerie v HTML str.1

Tvorba fotogalerie v HTML str.1 Tvorba fotogalerie v HTML str.1 obr. A obr. B 1) Spustíme PsPad, vytvoříme nový dokument a otevře se nám okno nový soubor, kde si můžeme zvolit jaký chceme typ. My označíme HTML a potvrdíme. 2) Pro správné

Více

1. Dědičnost a polymorfismus

1. Dědičnost a polymorfismus 1. Dědičnost a polymorfismus Cíl látky Cílem této kapitoly je představit klíčové pojmy dědičnosti a polymorfismu. Předtím však je nutné se seznámit se základními pojmy zobecnění neboli generalizace. Komentář

Více

ANOTACE vytvořených/inovovaných materiálů

ANOTACE vytvořených/inovovaných materiálů ANOTACE vytvořených/inovovaných materiálů Číslo projektu Číslo a název šablony klíčové aktivity Tematická oblast Formát Druh učebního materiálu Druh interaktivity CZ.1.07/1.5.00/34.0722 III/2 Inovace a

Více

MATLABLINK - VZDÁLENÉ OVLÁDÁNÍ A MONITOROVÁNÍ TECHNOLOGICKÝCH PROCESŮ

MATLABLINK - VZDÁLENÉ OVLÁDÁNÍ A MONITOROVÁNÍ TECHNOLOGICKÝCH PROCESŮ MATLABLINK - VZDÁLENÉ OVLÁDÁNÍ A MONITOROVÁNÍ TECHNOLOGICKÝCH PROCESŮ M. Sysel, I. Pomykacz Univerzita Tomáše Bati ve Zlíně, Fakulta aplikované informatiky Nad Stráněmi 4511, 760 05 Zlín, Česká republika

Více

Systém elektronického rádce v životních situacích portálu www.senorady.cz

Systém elektronického rádce v životních situacích portálu www.senorady.cz Systém elektronického rádce v životních situacích portálu www.senorady.cz Obec Senorady Miroslav Patočka 2006 Obsah: 1. Úvodní informace 1.1 Informace pro uživatele 1.1.1 Přístupnost HTML, PDA, WAP, XML

Více

Dnešní téma. Oblasti standardizace v ICT. Oblasti standardizace v ICT. Oblasti standardizace v ICT

Dnešní téma. Oblasti standardizace v ICT. Oblasti standardizace v ICT. Oblasti standardizace v ICT Dnešní téma Oblasti standardizace v ICT Případové studie standardizace v ICT: 1) Znakové sady 2) Jazyk 1. technická infrastruktura transfer a komunikace informací, přístup k informacím, sdílení zdrojů

Více

VÝUKOVÝ MATERIÁL. Bratislavská 2166, 407 47 Varnsdorf, IČO: 18383874 www.vosassvdf.cz, tel. +420412372632 Číslo projektu

VÝUKOVÝ MATERIÁL. Bratislavská 2166, 407 47 Varnsdorf, IČO: 18383874 www.vosassvdf.cz, tel. +420412372632 Číslo projektu VÝUKOVÝ MATERIÁL Identifikační údaje školy Vyšší odborná škola a Střední škola, Varnsdorf, příspěvková organizace Bratislavská 2166, 407 47 Varnsdorf, IČO: 18383874 www.vosassvdf.cz, tel. +420412372632

Více

================================================================================ =====

================================================================================ ===== Název: VY_32_INOVACE_PG4101 Základní struktura HTML stránky Datum vytvoření: 01 / 2012 Anotace: DUM seznamuje se základní strukturou a členěním HTML stránky, s jednotlivými složkami - HTML, CSS, externí

Více

Uspořádání klient-server. Standardy pro Web

Uspořádání klient-server. Standardy pro Web Návrh a tvorba WWW stránek 1/11 Uspořádání klient-server klient na straně uživatele (browser, prohlížeč) server program obsluhující požadavky uživatele Standardy pro Web HTTP Hypertext Transfer Protocol

Více

24. XML. Aby se dokument XML vůbec zobrazil musí být well-formed (správně strukturovaný). To znamená, že splňuje formální požadavky specifikace XML.

24. XML. Aby se dokument XML vůbec zobrazil musí být well-formed (správně strukturovaný). To znamená, že splňuje formální požadavky specifikace XML. 24. XML Úvod Značkovací jazyk XML (extensible Markup Language) vznikl ze staršího a obecnějšího jazyku SGML (Standard Generalized Markup Language). XML byl vyvinut konsorciem W3C, aby poskytl standardní

Více

Internet WEB stránky HTML, Hypertext MarkUp Language - nadtextový jazyk - Místo příkazů obsahuje tagy - značky

Internet WEB stránky HTML, Hypertext MarkUp Language - nadtextový jazyk - Místo příkazů obsahuje tagy - značky Internet WEB stránky HTML, Hypertext MarkUp Language - nadtextový jazyk - Místo příkazů obsahuje tagy - značky Fungování internetu je celosvětový systém navzájem propojených počítačových sítí ve kterých

Více

Návrh stránek 4IZ228 tvorba webových stránek a aplikací

Návrh stránek 4IZ228 tvorba webových stránek a aplikací 4IZ228 tvorba webových stránek a aplikací Jirka Kosek Poslední modifikace: $Date: 2013/12/12 20:40:58 $ Obsah Úvod... 3 Recept na dobré webové stránky... 4 Použitelnost... 5 Jak se pozná použitelný web...

Více

Tvorba WWW stránek. Mojmír Volf mojmir.volf@tul.cz https://www.nti.tul.cz/wiki/wikiuser:mojmir.volf 485 353 675

Tvorba WWW stránek. Mojmír Volf mojmir.volf@tul.cz https://www.nti.tul.cz/wiki/wikiuser:mojmir.volf 485 353 675 Tvorba WWW stránek Mojmír Volf mojmir.volf@tul.cz https://www.nti.tul.cz/wiki/wikiuser:mojmir.volf 485 353 675 Zdroje KRUG: Web design - nenuťte uživatele přemýšlet.. Computer Press, 2003. PROKOP M.: CSS

Více

Postupy práce se šablonami IS MPP

Postupy práce se šablonami IS MPP Postupy práce se šablonami IS MPP Modul plánování a přezkoumávání, verze 1.20 vypracovala společnost ASD Software, s.r.o. dokument ze dne 27. 3. 2013, verze 1.01 Postupy práce se šablonami IS MPP Modul

Více

1. Začínáme s FrontPage 2003 11

1. Začínáme s FrontPage 2003 11 Úvod 9 1. Začínáme s FrontPage 2003 11 Instalace programu 12 Spuštění a ukončení programu 15 Základní ovládání 16 Hledání souborů 30 Najít a nahradit 31 Tisk 32 Schránka sady Office 34 Nápověda 36 Varianty

Více

Metody tvorby ontologií a sémantický web. Martin Malčík, Rostislav Miarka

Metody tvorby ontologií a sémantický web. Martin Malčík, Rostislav Miarka Metody tvorby ontologií a sémantický web Martin Malčík, Rostislav Miarka Obsah Reprezentace znalostí Ontologie a sémantický web Tvorba ontologií Hierarchie znalostí (D.R.Tobin) Data jakékoliv znakové řetězce

Více

Databázové systémy. Doc.Ing.Miloš Koch,CSc. koch@fbm.vutbr.cz

Databázové systémy. Doc.Ing.Miloš Koch,CSc. koch@fbm.vutbr.cz Databázové systémy Doc.Ing.Miloš Koch,CSc. koch@fbm.vutbr.cz Vývoj databázových systémů Ukládání dat Aktualizace dat Vyhledávání dat Třídění dat Výpočty a agregace 60.-70. léta Program Komunikace Výpočty

Více

ŠKODA Portal Platform

ŠKODA Portal Platform ŠKODA Portal Platform Struktura LESS stylů Jan Obrátil Účel dokumentu Účelem tohoto dokumentu je vysvětlit strukturu stylů v Portálové Platformě tak, aby bylo možné je správně použít a rozšířit je pro

Více

CZ.1.07/1.5.00/34.0527

CZ.1.07/1.5.00/34.0527 Projekt: Příjemce: Digitální učební materiály ve škole, registrační číslo projektu CZ.1.07/1.5.00/34.0527 Střední zdravotnická škola a Vyšší odborná škola zdravotnická, Husova 3, 371 60 České Budějovice

Více

Nový způsob práce s průběžnou klasifikací lze nastavit pouze tehdy, je-li průběžná klasifikace v evidenčním pololetí a školním roce prázdná.

Nový způsob práce s průběžnou klasifikací lze nastavit pouze tehdy, je-li průběžná klasifikace v evidenčním pololetí a školním roce prázdná. Průběžná klasifikace Nová verze modulu Klasifikace žáků přináší novinky především v práci s průběžnou klasifikací. Pro zadání průběžné klasifikace ve třídě doposud existovaly 3 funkce Průběžná klasifikace,

Více

22. Tvorba webových stránek

22. Tvorba webových stránek 22. Tvorba webových stránek Webové stránky jsou spolu s elektronickou poštou nejpoužívanější prostředky internetu. Brouzdáme li internetem používáme nějaký prohlížeč. To, co vidíme na obrazovce v prohlížeči

Více

Webová stránka. Matěj Klenka

Webová stránka. Matěj Klenka Webová stránka Matěj Klenka Osobní webová stránka Toto je dokumentace k mé webové stránce This is a documentation to my web page Já, Matěj Klenka, prohlašuji, že má webová stránka byla vytvořena mnou a

Více

Individuální projekt z předmětu webových stránek 2012/2013 - Anketa

Individuální projekt z předmětu webových stránek 2012/2013 - Anketa Individuální projekt z předmětu webových stránek 2012/2013 - Anketa Daniel Beznoskov, 2 IT A Skupina 1 Úvod Prohlášení o autorství Prohlašuji, že jsem individuální projekt z předmětu webových stránek na

Více

SRSW4IT Inventarizační SW. Prezentace aplikace. Vedoucí DP: ing. Lukáš Macura Autor: Bc. Petr Mrůzek

SRSW4IT Inventarizační SW. Prezentace aplikace. Vedoucí DP: ing. Lukáš Macura Autor: Bc. Petr Mrůzek Prezentace aplikace Vedoucí DP: ing. Lukáš Macura Autor: Bc. Petr Mrůzek Osnova Úvod Programovací jazyk - PHP Etapy vývoje Funkce aplikace Co SW umí Na čem se pracuje Vize do budoucna Úvod Úvod Inspirováno

Více

Relační databáze. V dnešní době existuje řada komerčních DBMS, nejznámější jsou:

Relační databáze. V dnešní době existuje řada komerčních DBMS, nejznámější jsou: Relační databáze Pojem databáze, druhy databází Databází se myslí uložiště dat. V době začátků využívání databází byly tyto členěny hlavně hierarchicky, případně síťově (rozšíření hierarchického modelu).

Více

DUM č. 11 v sadě. 36. Inf-12 Počítačové sítě

DUM č. 11 v sadě. 36. Inf-12 Počítačové sítě projekt GML Brno Docens DUM č. 11 v sadě 36. Inf-12 Počítačové sítě Autor: Lukáš Rýdlo Datum: 06.05.2014 Ročník: 3AV, 3AF Anotace DUMu: WWW, HTML, HTTP, HTTPS, webhosting Materiály jsou určeny pro bezplatné

Více

Mgr. Stěpan Stěpanov, 2013

Mgr. Stěpan Stěpanov, 2013 Mgr. Stěpan Stěpanov, 2013 Abstrakt V tomto kurzu se seznámíme se základními pojmy HTML, klíčovými pravidly pro práci se značkami a atributy a strukturou dokumentu. Také se dozvíte, jak a v čem lze vytvářet

Více

PŘÍLOHA C Požadavky na Dokumentaci

PŘÍLOHA C Požadavky na Dokumentaci PŘÍLOHA C Požadavky na Dokumentaci Příloha C Požadavky na Dokumentaci Stránka 1 z 5 1. Obecné požadavky Dodavatel dokumentaci zpracuje a bude dokumentaci v celém rozsahu průběžně aktualizovat při každé

Více

Obsah. Úvodem 9 Zpětná vazba od čtenářů 10 Zdrojové kódy ke knize 10 Errata 10

Obsah. Úvodem 9 Zpětná vazba od čtenářů 10 Zdrojové kódy ke knize 10 Errata 10 Obsah Úvodem 9 Zpětná vazba od čtenářů 10 Zdrojové kódy ke knize 10 Errata 10 KAPITOLA 1 Co budeme potřebovat 11 Co knihovna jquery nabízí 11 Editor zdrojového kódu 12 Webový server 12 Software pro ladění

Více

Reliance 3 design OBSAH

Reliance 3 design OBSAH Reliance 3 design Obsah OBSAH 1. První kroky... 3 1.1 Úvod... 3 1.2 Založení nového projektu... 4 1.3 Tvorba projektu... 6 1.3.1 Správce stanic definice stanic, proměnných, stavových hlášení a komunikačních

Více

3. Je defenzivní programování technikou skrývání implementace? Vyberte jednu z nabízených možností: Pravda Nepravda

3. Je defenzivní programování technikou skrývání implementace? Vyberte jednu z nabízených možností: Pravda Nepravda 1. Lze vždy z tzv. instanční třídy vytvořit objekt? 2. Co je nejčastější příčinou vzniku chyb? A. Specifikace B. Testování C. Návrh D. Analýza E. Kódování 3. Je defenzivní programování technikou skrývání

Více

Web. Získání informace z internetu Grafické zobrazení dat a jejich struktura Rozšíření funkcí pomocí serveru Rozšíření funkcí pomocí prohlížeče

Web. Získání informace z internetu Grafické zobrazení dat a jejich struktura Rozšíření funkcí pomocí serveru Rozšíření funkcí pomocí prohlížeče Web Získání informace z internetu Grafické zobrazení dat a jejich struktura Rozšíření funkcí pomocí serveru Rozšíření funkcí pomocí prohlížeče Technologické trendy v AV tvorbě, Web 2 DNS Domain Name Systém

Více

Inovace výuky prostřednictvím šablon pro SŠ

Inovace výuky prostřednictvím šablon pro SŠ Název projektu Číslo projektu Název školy Autor Název šablony Název DUMu Stupeň a typ vzdělávání Vzdělávací oblast Vzdělávací obor Tematický okruh Inovace výuky prostřednictvím šablon pro SŠ CZ.1.07/1.5.00/34.0748

Více

Modely datové. Další úrovní je logická úroveň Databázové modely Relační, Síťový, Hierarchický. Na fyzické úrovni se jedná o množinu souborů.

Modely datové. Další úrovní je logická úroveň Databázové modely Relační, Síťový, Hierarchický. Na fyzické úrovni se jedná o množinu souborů. Modely datové Existují různé úrovně pohledu na data. Nejvyšší úroveň je úroveň, která zachycuje pouze vztahy a struktury dat samotných. Konceptuální model - E-R model. Další úrovní je logická úroveň Databázové

Více

WWW a HTML. Základní pojmy. Ivo Peterka

WWW a HTML. Základní pojmy. Ivo Peterka WWW a HTML Základní pojmy WWW World Wide Web systém navzájem propojených stránek Stránky se mohou skládat z částí nacházejících se v různých částech světa. HTML HyperText Markup Language Slouží k psaní

Více

Mgr. Vlastislav Kučera lekce č. 2

Mgr. Vlastislav Kučera lekce č. 2 Mgr. Vlastislav Kučera lekce č. 2 Struktura stránky hlavička meta tagy titulek stránky připojení stylů,... CSS to je to, co se

Více

INFORMAČNÍ SYSTÉM VIDIUM A VYUŽITÍ MODERNÍCH TECHNOLOGIÍ

INFORMAČNÍ SYSTÉM VIDIUM A VYUŽITÍ MODERNÍCH TECHNOLOGIÍ INFORMAČNÍ SYSTÉM VIDIUM A VYUŽITÍ MODERNÍCH TECHNOLOGIÍ Michal Brožek, Dominik Svěch, Jaroslav Štefaník MEDIUM SOFT a.s., Cihelní 14, 702 00 Ostrava, ČR Abstrakt Neustále rostoucí význam sběru dat, možnost

Více

Aplikační vrstva. Úvod do Php. Ing. Martin Dostal

Aplikační vrstva. Úvod do Php. Ing. Martin Dostal Aplikační vrstva Úvod do Php Ing. Martin Dostal Co to je PHP? php soubory se nekompilují, interpret je spouští přímo bez překladu php běží na serveru php soubor je.txt soubor obsahující php kód: Zkrácený

Více

Základní pojmy spojené s webovým publikováním ~ malý slovníček pojmů~ C3231 Základy WWW publikování Radka Svobodová, Stanislav Geidl

Základní pojmy spojené s webovým publikováním ~ malý slovníček pojmů~ C3231 Základy WWW publikování Radka Svobodová, Stanislav Geidl Základní pojmy spojené s webovým publikováním ~ malý slovníček pojmů~ C3231 Základy WWW publikování Radka Svobodová, Stanislav Geidl Internet celosvětová síť spojení jednotlivých síťí pomocí uzlů (síť

Více

Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky. PORTÁL KUDY KAM. Manuál pro administrátory. Verze 1.

Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky. PORTÁL KUDY KAM. Manuál pro administrátory. Verze 1. Tento projekt je spolufinancován Evropským sociálním fondem a státním rozpočtem České republiky. PORTÁL KUDY KAM Manuál pro administrátory Verze 1.0 2012 AutoCont CZ a.s. Veškerá práva vyhrazena. Tento

Více

KAPITOLA 2 - ZÁKLADNÍ POJMY INFORMAČNÍCH A KOMUNIKAČNÍCH TECHNOLOGIÍ

KAPITOLA 2 - ZÁKLADNÍ POJMY INFORMAČNÍCH A KOMUNIKAČNÍCH TECHNOLOGIÍ KAPITOLA 2 - ZÁKLADNÍ POJMY INFORMAČNÍCH A KOMUNIKAČNÍCH TECHNOLOGIÍ KLÍČOVÉ POJMY Internet World Wide Web FTP, fulltext e-mail, IP adresa webový prohlížeč a vyhledávač CÍLE KAPITOLY Pochopit, co je Internet

Více

Registrační číslo projektu: Škola adresa:

Registrační číslo projektu: Škola adresa: Registrační číslo projektu: CZ.1.07/1.4.00/21.3712 Škola adresa: Základní škola T. G. Masaryka Ivančice, Na Brněnce 1, okres Brno-venkov, příspěvková organizace Na Brněnce 1, Ivančice, okres Brno-venkov

Více

Využití OOP v praxi -- Knihovna PHP -- Interval.cz

Využití OOP v praxi -- Knihovna PHP -- Interval.cz Page 1 of 6 Knihovna PHP Využití OOP v praxi Po dlouhé teorii přichází na řadu praxe. V následujícím textu si vysvětlíme možnosti přístupu k databázi pomocí různých vzorů objektově orientovaného programování

Více

Střední odborná škola a Střední odborné učiliště, Hořovice

Střední odborná škola a Střední odborné učiliště, Hořovice Kód DUM : VY_32_INOVACE_DYN.1.06 Název materiálu: Anotace Autor Jazyk Očekávaný výstup 06 Základ psaní skriptů v jazyce PHP DUM provede žáka jednoduchým skriptem, který sečte a znásobí dvě čísla Ing. Vladimír

Více

Zabezpečení proti SQL injection

Zabezpečení proti SQL injection Zabezpečení proti SQL injection ESO9 intranet a.s. Zpracoval: Tomáš Urych U Mlýna 2305/22, 141 Praha 4 Záběhlice Dne: 19.9.2012 tel.: +420 585 203 370-2 e-mail: info@eso9.cz Revize: Urych Tomáš www.eso9.cz

Více

Publikování map na webu - WMS

Publikování map na webu - WMS Semestrální práce z předmětu Kartografická polygrafie a reprografie Publikování map na webu - WMS Autor: Ondřej Dohnal, Martina Černohorská Editor: Filip Dvořáček Praha, duben 2010 Katedra mapování a kartografie

Více

Mgr. Vlastislav Kučera přednáška č. 2

Mgr. Vlastislav Kučera přednáška č. 2 Mgr. Vlastislav Kučera přednáška č. 2 Struktura stránky hlavička meta tagy titulek stránky připojení stylů,... CSS

Více

DBS Konceptuální modelování

DBS Konceptuální modelování DBS Konceptuální modelování Michal Valenta Katedra softwarového inženýrství FIT České vysoké učení technické v Praze Michal.Valenta@fit.cvut.cz c Michal Valenta, 2010 BIVŠ DBS I, ZS 2010/11 https://users.fit.cvut.cz/

Více

DSL manuál. Ing. Jan Hranáč. 27. října 2010. V této kapitole je stručný průvodce k tvorbě v systému DrdSim a (v

DSL manuál. Ing. Jan Hranáč. 27. října 2010. V této kapitole je stručný průvodce k tvorbě v systému DrdSim a (v DSL manuál Ing. Jan Hranáč 27. října 2010 V této kapitole je stručný průvodce k tvorbě v systému DrdSim a (v současné době krátký) seznam vestavěných funkcí systému. 1 Vytvoření nového dobrodružství Nejprve

Více

Identifikátor materiálu: ICT-3-55

Identifikátor materiálu: ICT-3-55 Identifikátor materiálu: ICT-3-55 Předmět Téma sady Téma materiálu Informační a komunikační technologie Počítačové sítě, Internet Funkce a přehled internetových prohlížečů Autor Ing. Bohuslav Nepovím Anotace

Více

UML. Unified Modeling Language. Součásti UML

UML. Unified Modeling Language. Součásti UML UML Unified Modeling Language 1995 počátek 1997 verze 1.0 leden dnes verze 2.0 (vývoj stále nedokončen) Standardní notace OMG podpora velkých firem (Microsoft, IBM, Oracle, HP ) popisuje struktury popisuje

Více

Analýza a návrh webových aplikací I N G. M A R T I N M O L H A N E C, C S C. Y 1 3 A N W

Analýza a návrh webových aplikací I N G. M A R T I N M O L H A N E C, C S C. Y 1 3 A N W Analýza a návrh webových aplikací I N G. M A R T I N M O L H A N E C, C S C. Y 1 3 A N W Osnova dnešní přednášky Proč tento předmět vlastně existuje? Proč nestačí standardní metodiky SI? Co standardním

Více

Internet - základní pojmy

Internet - základní pojmy Název školy: Střední odborná škola stavební Karlovy Vary Sabinovo náměstí 16, 360 09 Karlovy Vary Autor: Ing. Hana Šmídová Název materiálu: VY_32_INOVACE_07_INTERNET_P2 Číslo projektu: CZ 1.07/1.5.00/34.1077

Více