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í webových aplikací Výuka tohoto předmětu bude probíhat prezenční formou v počítačových učebnách. Programování je také součástí předmětu, který se na něj specializuje, proto vynecháme kapitoly týkající se algoritmizace. Dalším aspektem je silná mezipředmětová provázanost a spolupráce mezi vyučujícími. Nebudeme se zabývat do hloubky principy programování, ale zaměříme se na praktické příklady. Výuka bude rozdělena do čtyř částí, které se budou vyučovat ve 2. a 3. ročníku. Ve 4. ročníku se všechny vědomosti spojí do celku a absolvent modulu bude schopný naprogramovat menší webovou aplikaci, která bude spolupracovat s databází. Cíle modulu Zopakování základních znalostí o internetu Zvládnutí tvorby WWW stránek pomocí HTML o Syntaxe o Formátování textu o Odkazy o Odrážky o Tabulky o Obrázky o Formuláře o Základy grafiky na WWW Zoner Calisto Zoner GifAnimator o CSS Princip tvorby stránek pomocí CSS Možnosti zápisu do HTML Popis základních vlastností Kaskáda Pozicování pomocí <div> </div> Absolutní Relativní o Využití Java skriptu na stránkách Začlenění skriptu do stránek Základy syntaxe
Proměnné a datové typy Výrazy a operátory Větvení Cykly Objekty Události Propojení s formulářem Funkce Pole Objektový model Využití jazyka PHP jako základ pro programování webových aplikací o Statické a dynamické stránky o Verze PHP o Nastavení PHP na počítači o Vložení PHP kódu do HTML o Proměnné Základní datové typy Konstanty o Příkaz echo o Podmínky a větvení If Case o Cykly For While Do.. While o Pole o Funkce o Integrované funkce v PHP Řetězcové funkce Funkce pro práci s datem a časem o Formuláře Vytvoření formuláře s odesláním dat Přenášení dat mezi formuláři Napojení databáze MySQL pomocí PHP o Databáze
Úvod do databází Relační databáze o Instalace a konfigurace MySQL o Práce s phpmyadmin o Dotazy SQL Select, Insert, Delete, Update o Propojení s PHP Zpracování výsledků dotazu
Hodnocení a klasifikace Hodnocení a klasifikace žáka bude stanoveno dle školního klasifikačního řádu. Známka se bude skládat z následujících částí: - teoretická znalost hodnocené problematiky (váha 20%) - praktické dovednosti (váha 80%) Plán modulu a činností Modul Služby informační sítě je koncipován na 99 výukových hodin (99 x 45 minut) Výuka bude rozdělena do následujících částí: 1. úvod, vstupní diagnostika Rozsah: 2 vyučovací hodiny Obsah: Zjištění vstupní úrovně znalostí a dovedností studentů. Případné doplnění základních informací nutných pro další studium. 2. tvorba www stránek Rozsah: 31 vyučovacích hodin (1. Pololetí druhého ročníku) Obsah: Student se seznámí se základy tvorby www stránek. Naučí se vytvářet www stránky pomocí HTML kódu. Dále zvládne navrhovat vzhled stránek pomocí kaskádových stylů (CSS). Dále využije znalosti z předmětu Grafika na PC pro vytvoření uživatelsky přívětivého rozhraní. Nakonec vytvoří vlastní, pokud možno validní internetové stránky a umístí je na web. 3. JavaScript Rozsah: 33 vyučovacích hodin (2. Pololetí druhého ročníku) Obsah: Student se seznámí s principem fungování skriptovacích jazyků. Uvědomí si možnosti využití při tvorbě internetových stránek. Bude schopen zvážit úskalí spojená s použitím scriptování na straně uživatele. Vytvoří menší projekt, kde využije JavaScript. 4. PHP Rozsah: 33 vyučovacích hodin (1. Pololetí třetího ročníku) Obsah: Student pochopí rozdíl mezi vykonáváním kódu na straně
uživatele a na straně serveru. Zvládne základy PHP, což opět prokáže vytvořením vlastního projektu. 5. MySQL Rozsah: 33 vyučovacích hodin (2. Pololetí třetího ročníku) Obsah: Student využije znalosti z předmětu APC, ve kterém se seznámí s principem fungování relačních databází. 6. Spojení znalostí o tvorbě stránek, PHP a MySQL Rozsah: 66 vyučovacích hodin (čtvrtý ročník) Obsah: Student si vybere téma dle vlastního uvážení odpovídající náročnosti pro vytvoření menší, ale zároveň plně funkční webové aplikace. Využije zde znalosti z předchozích ročníků a použije v něm nabyté znalosti. Rozpis jednotlivých lekcí modulu 1. úvod, vstupní diagnostika Rozsah 2 vyučovací hodiny Cíl Cílem je zjistit vstupní znalosti studentů. Po této fázi učitel se žáky formou řízené diskuse shrne všeobecně známé pojmy spojené s internetem a tvorbou webových stránek. Pomůcky PC s MS Windows, internetový prohlížeč, internet: pro studenty PC s MS Windows, internet, internetový prohlížeč, dataprojektor: pro učitele Postup Seznámení s cílem výuky Řízená diskuse na téma internet a tvorba webových stránek Zhodnocení, jestli byly cíle lekce splněny Obsah výuky Připomenutí běžně známých termínů používaných v internetu Metody výuky Přednáška Projekce Diskuse
Forma výuky Individuální výuka Frontální výuka Práce ve skupinách Hodnocení a klasifikace Ústní hodnocení I N V E S T I C E D O R O Z V O J E V Z D Ě L Á V Á N Í 2. Tvorba www stránek Rozsah 31 vyučovacích hodin Cíl Cílem je zvládnout základy tvorby www stránek pomocí HTML kódu a CSS. Nedílnou součástí bude příprava grafiky pomocí programu Zoner Calisto. Na závěr žák vytvoří vlastní internetové stránky, které vystaví na internetu. Stránky budou validní a budou se stejně zobrazovat ve všech běžně používaných prohlížečích. Pomůcky PC s MS Windows, internetový prohlížeč, internet, Zoner Calisto, editor HTML: pro studenty PC s MS Windows, internet, internetový prohlížeč, editor HTML, Zoner Calisto, dataprojektor: pro učitele Postup Zopakování základních pojmů, které se týkají internetu Vysvětlení principu zobrazování webových stránek a upozornění na některá úskalí plynoucí z existence různých prohlížečů Základy HTML Co to je HTML dokument Základy syntaxe Základní tagy (značky) Kostra HTML dokumentu Pokročilejší HTML Formátování textu
Formátování odstavce Odrážky a číslování Odkazy Tabulky Obrázky Zoner Calisto Vytvoření grafiky pro www Vyhodnocení práce v Zoneru Calisto Formuláře a formulářové prvky Diskuse se studenty Studenti si vyberou téma, které bude nosné pro vytvoření vlastních internetových stránek Kaskádové styly (CSS) Vysvětlení principu používání CSS Jak rozvrhnout stránku Jak nadefinovat různé oblasti Výběr základních vlastností a vysvětlení možnosti jejich použití Tvorba vlastní stránky Konzultace s vyučujícím Vyhodnocení práce studentů Obsah výuky Viz cíle výuky a postup Metody výuky Přednáška Projekce Diskuse Domácí úkoly Samostatná práce Forma výuky
Individuální výuka Frontální výuka Práce ve skupinách E-learning I N V E S T I C E D O R O Z V O J E V Z D Ě L Á V Á N Í Hodnocení a klasifikace Hodnocení proběhne formou testů přímo v hodině, které se budou vykonávat na PC formou zvládnutí praktických příkladů. 3. JavaScript Rozsah 33 vyučovacích hodin Cíl Cílem je zvládnout základy JavaScriptu, jako jedné z možností, jak oživit internetové stránky. Mimo zvládnutí samotného jazyka bude student schopen uvážit rizika, která sebou přináší použití scriptování na www stránkách. Výuka bude zakončena vytvořením JavaScriptové aplikace. Pomůcky PC s MS Windows, internetový prohlížeč, internet, editor HTML: pro studenty PC s MS Windows, internet, internetový prohlížeč, editor HTML, dataprojektor: pro učitele Postup Vysvětlení rozdílu mezi spouštěním kódu na straně uživatele a na straně serveru Zopakování základních principů programování Java Script Začlenění skriptu do stránek Základy syntaxe Proměnné a datové typy Výrazy a operátory Test Vyhodnocení testu Větvení
Test Vyhodnocení testu Cykly Test Vyhodnocení testu Objekty Události Test Vyhodnocení testu Propojení s formulářem Zadání závěrečného projektu Funkce Test Vyhodnocení testu Pole Objektový model Konzultace k projektu Vyhodnocení projektu Obsah výuky Viz cíle výuky a postup Metody výuky Přednáška Projekce Diskuse Domácí úkoly Samostatná práce Forma výuky Individuální výuka Frontální výuka Práce ve skupinách E-learning Hodnocení a klasifikace Hodnocení proběhne formou testů přímo v hodině, které se budou vykonávat na PC formou zvládnutí praktických příkladů. Důležitým
aspektem bude zdárné zvládnutí závěrečného projektu. 4. PHP Rozsah 33 vyučovacích hodin Cíl Cílem je zvládnout programovací jazyk PHP. PHP je serverový skriptovací jazyk, proto je nutné zvládnout nejenom programování samotné, ale také instalace PHP a webového serveru a jejich nastavení. Aby mohli studenti pracovat plnohodnotně jako administrátoři, budou pracovat na virtuálním PC se svým operačním systémem. Pomůcky PC s MS Windows, internetový prohlížeč, internet, editor HTML, virtuální PC: pro studenty PC s MS Windows, internet, internetový prohlížeč, editor HTML, dataprojektor: pro učitele Postup Zopakování základních programátorských dovedností Teoretická příprava pro instalaci PHP a webového serveru Instalace webového serveru Instalace PHP PHP Statické a dynamické stránky Verze PHP Vložení PHP kódu do HTML Proměnné Základní datové typy Konstanty Příkaz echo Zadání projektu Test
Vyhodnocení testu Podmínky a větvení If Case Test Vyhodnocení testu Cykly For While Do.. While Test Vyhodnocení testu Pole Funkce Test Vyhodnocení testu Integrované funkce v PHP Řetězcové funkce Funkce pro práci s datem a časem Formuláře Vytvoření formuláře s odesláním dat Přenášení dat mezi formuláři Konzultace projektu Vyhodnocení projektu Obsah výuky Viz cíle výuky a postup Metody výuky Přednáška Projekce Diskuse Domácí úkoly Samostatná práce Forma výuky Individuální výuka Frontální výuka
Práce ve skupinách E-learning I N V E S T I C E D O R O Z V O J E V Z D Ě L Á V Á N Í Hodnocení a klasifikace Hodnocení proběhne formou testů přímo v hodině, které se budou vykonávat na PC formou zvládnutí praktických příkladů. Důležitým aspektem bude zdárné zvládnutí závěrečného projektu. 5. MySQL Rozsah 33 vyučovacích hodin Cíl Cílem je zvládnout propojení databáze s programem napsaným v PHP. Opět je nutné na PC nainstalovat databázi a rozhraní, pomocí kterého budeme databázi spravovat. Tím bude MySQLAdmin. Dále žák použije znalosti z databázových systémů. Pomůcky PC s MS Windows, internetový prohlížeč, internet, editor HTML, virtuální PC: pro studenty PC s MS Windows, internet, internetový prohlížeč, editor HTML, dataprojektor: pro učitele Postup Zopakování základních programátorských dovedností Zopakování znalostí o databázích Zadání projektu MySQL Instalace a konfigurace MySQL Práce s phpmyadmin Dotazy SQL Select, Insert, Delete, Update Test Vyhodnocení testu
Propojení s PHP Zpracování výsledků dotazu Test Vyhodnocení testu Konzultace k projektu Vyhodnocení projektu Obsah výuky Viz cíle výuky a postup Metody výuky Přednáška Projekce Diskuse Domácí úkoly Samostatná práce Forma výuky Individuální výuka Frontální výuka Práce ve skupinách E-learning Hodnocení a klasifikace Hodnocení proběhne formou testů přímo v hodině, které se budou vykonávat na PC formou zvládnutí praktických příkladů. Důležitým aspektem bude zdárné zvládnutí závěrečného projektu. 6. Spojení znalostí o tvorbě stránek, PHP a MySQL Rozsah 66 vyučovacích hodin Cíl Cílem je propojit znalosti z tvorby stránek, PHP a Mysql. Student bude umět analyzovat daný problém a vytvořit funkční aplikaci. V rámci práce bude zároveň probíhat příprava k maturitní zkoušce z oblastí, které se
vyučovaly v průběhu studia. Pomůcky PC s MS Windows, internetový prohlížeč, internet, editor HTML, virtuální PC: pro studenty PC s MS Windows, internet, internetový prohlížeč, editor HTML, dataprojektor: pro učitele Postup Zopakování tvorby www stránek Zopakování JavaScriptu Zopakování PHP Zopakování MySQL Zadání ztečného projektu Konzultace projektu Průběžné opakování k maturitě Vyhodnocení projektu Obsah výuky Viz cíle výuky a postup Metody výuky Přednáška Projekce Diskuse Domácí úkoly Samostatná práce Forma výuky Individuální výuka
Frontální výuka Práce ve skupinách E-learning I N V E S T I C E D O R O Z V O J E V Z D Ě L Á V Á N Í Hodnocení a klasifikace Hodnocení proběhne formou testů přímo v hodině, které se budou vykonávat na PC formou zvládnutí praktických příkladů. Důležitým aspektem bude zdárné zvládnutí závěrečného projektu a výsledky testů z opakování k maturitě.