Technológie internetu

1. Cvčenie

Prednáška: Základné pojmy, Unix

1. Spojením typu SSH (putty) sa presuňte na počítač sigma.tuke.sk.
2. V adresári public_html vytvorte adresár ti, pod ním cvic1 a s ňom adresáre vysiel a prijem.
3. Precvičte prácu s editorom vi. V adresári vysiel vytvorte súbor pom.x s obsahom 1. Subor pom.x, 2. Student MENO.
4. Prekopírujte súbor pom.x do adresára Prijem a premenujte ho na sub.y.
5. Do súboru sub.y pridajte (editor vi) ďalšie dva riadky 3. Fakulta BERG, 4. Odbor: -vypíšte zvolený odbor-.
6. Prezrite obsah súborov pom.x a sub.y.
7. Precvičte prácu s editorom joe. V adresári prijem vytvorte súbor sub1.y s obsahom 1. Subor sub1.y, 2. Student -vase meno-, 3. Bydlisko -Vaše mesto-.
8. Prekopírujte súbor sub.y do adresára Vysiel.
9. Prekopírujte súbor sub.y v adresári Vysiel na pom1.txt.
10. Zrušte súbor sub.y v adresári Prijem.
11. Urobte výpis obsahu adresára Vysiel a Prijem.
12. Odhláste sa z práce na počítači sigma.tuke.sk.

1. Spojením typu SFTP sa pripojte na počítač sigma.tuke.sk.
2. Skontrolujte súbory a adresáre vo Vašom adresári public_html , ti, pod ním Cvic1 a s ňom adresáre Vysiel a Prijem.
3. Na PC pri ktorom sa nachádzate vytvorte v zložke Dokumenty adresár ti a v ňom adresár s Vašim nickom: nick. Skopírujte doňho adresár Cvic1 .
4. Otvorte v editore PSPad súbor pom1.x a doplňte doňho jednu vetu o dnešnom počasí. Uložte ho a prekopírujte na omegu omega.tuke.sk.
5. V editore PSPad nastavte zobrazenie číslovania riadkov, pravítka, zobrazenie tabuľky ASCII, zobrazenie farieb na výber
6. Nastavte formát súboru pom1.x na UTF-8 a uložte (aj na sigma)
7. V programe Winscp nastavte, aby bol editor PSPad predvolený editor.
8. Odhláste sa z práce na počítači sigma.tuke.sk.

3. cvičenie - HTML formulár v HTML5

Prednáška: HTML, formulár, email

1. Prihláste sa na počítač sigma.tuke.sk, vytvorte v adresári html adresár Cvic3 .
2. Spustite PSPad editor a vytvorte a uložte do svojho počítača súbor index.html .
3. Upravte údaje v hlavičke súboru, zadajte titulok, popis, kódovanie UTF-8 a uložte vo formáte UTF-8. Súbor index.html uložte a prekopírujte do adresára Cvic3 (na sigma. tuke.sk).
4. V súbore vytvorte menu, ktoré bude pozostávať z dvoch odkazov, na stránky form.html a stránku kontakt.html.
5. Vytvorte formulár na zaujímavú anketu s použitím legendy, formulárových vstupov typu text, select, radio, checkbox a pomenujte ho form.html.
6. Vytvorte stránku kontakt.html, do ktorej pomocou prvku adress zadáte kontakt na seba a e-mail. podľa:
   Written by W3Schools.com
   Email us
   Address: Box 564, Disneyland
   Phone: +12 34 56 78
7. Všetky súbory zvalidujte http://validator.w3.org/.
8. Všetky potrebné súbory prekopírujte do adresára Cvic3 na sigma.tuke.sk

5. cvičenie Kaskádové štýly

Prednáška: Kaskádové štýly

1. Prihláste sa na počítač sigma.tuke.sk, vytvorte v adresári html adresár Cvic5 .
2. Z cvičenia 2 prekopírujte obsah súboru  index.html  a uložte ho pod názvom  prvky.html , z cvičenia 3 prekopírujte súbory index.html, form.html a kontakt.html .
3. Do súboru  index.html  doplňte link na súbor  prvky.html .
4. Pre jednotlivé súbory zadefinujte grafickú úpravu pomocou kaskádového štýlu, ktorého ukážka je umiestnená v súbore subor.css .
5. Vami vytvorený subor.css pripojte do html súborov pomocou značky link, ktorú umiestnite do hlavičky dokumentu:  <link rel="stylesheet" href="subor.css" >.
6. Ukážka súborov kaskádového štýlu je   kaskádový štýl 1 a  kaskádový štýl 2 a  kaskádový štýl 3 Príkazy zo súborov modifikujte tak, aby ste zlepšili vzhľad stránok.
7. Všetky súbory  index.html   a  subor.css, form.html , kontakt.html a  prvky.html  zvalidujte http://validator.w3.org/ a prekopírujte do adresára Cvic5 na sigma.tuke.sk

7. cvičenie - Interaktivita, úvod do PHP - echo, for, if, date

Prednáška: Interaktivita web stránky, úvod do PHP

1. Prihláste sa na počítač sigma.tuke.sk, vytvorte v adresári html adresár Cvic7 .
2. Vyskúšajte si jednoduché príkazy php, vytvorte súbor  prvy.php .
3. Do súboru  pocet.php  zapíšte funkčný skript na počítanie prístupov na stránku. Ukážka php pre počet prístupov je   pocet.php.

8. cvičenie - PHP - riadiace štruktúry, formuláre

1. Vytvorte na počítači sigma.tuke.sk adresár Cvic8 v adresári html.
2. Súbory z minulého cvičenia index.html a form.html a subor.css prekopírujte do adresára Cvic8:
3. Vytvorte súbor spracuj.php, ktorý bude čítať a vypisovať údaje zadané do formulára, komunikovať s používateľom na základe zadaných údajov. Komunikáciu vytvárajte postupne pre premenné, a zakaždým dolaďujte spúšťaním cez omega.tuke.sk podľa ukážky,
4. Použite overenie splnenia podmienok pomocou if a else.
5. Zrealizujte výpočet na základe dvoch číselných údajov z formulára a výsledok vypíšte.
6. Vhodne upravte formát vypisovaného výsledku.
7. Ukážka ako má vyzerať komunikácia medzi formulárom (form.html) a súborom spracuj.php.
8. Všetky súbory zvalidujte http://validator.w3.org/.
9. Všetky potrebné súbory prekopírujte do adresára Cvic8 na sigma.tuke.sk

9. cvičenie - Základy SQL

Prednáška: Základy SQL

1. Vo svojom adresári na "sigma.tuke.sk" vytvorte adresár cvic9 a do neho uložíte všetky súbory, ktoré vytvoríte na cvičení.
2. Do svojich počítačov stiahnite súbory db.php a create.php select.php} Podľa Vašich prihlasovacích údajov k databáze na   sigma.tuke.sk   upravte skript s názvom  db.php.
3. Vytvorte pre svoju tabuľku (z cvičenia 1) SQL príkaz na jej vytvorenie vo vašej databáze.
4. Vytvorte pre svoju tabuľku (z cvičenia 1) SQL príkaz na vloženie 3 záznamov.
5. Vytvorte pre svoju tabuľku (z cvičenia 1) SQL aspoň 3 príkazy na výber z tabuľky (podľa ukážky).
6. Podľa predchádzajúcich pokynov a cvičení vytvárajte ďalšie príkazy na vytváranie tabuliek, vkladanie údajov do tabuliek a vyhľadávanie v tabuľkách podľa rôznych kritérií. Overte funkčnosť týchto príkazov napríklad s použitím aplikácie workbench.
7. Prácu s troma tabuľkami si vyskúšajte s pomocou nasledujúcej ukážky: Ukážky sql dotazov.
8. Nasledujúce súbory globals , query , query_res uložte v adresári mysql a premenujte ich na *.php. Súbor globals.php vyplňte podľa Vašich prihlasovacích údajov ku databáze. Následne celý adresár umiestnite na server sigma.tuke.sk a otvorte súbor query.php. V tomto prostredí si môžete vyskúšať používanie sql dotazov.

10. cvičenie - PHP a SQL

1. Vo svojom adresári na "sigma.tuke.sk" vytvorte adresár cvic10 v adresári html. a do neho uložíte všetky súbory, ktoré vytvoríte na cvičení.
2. S využitím princípov jazyka SQL vytvorte štruktúru tabuľky (prípadne viacerých tabuliek) pre váš semestrový projekt, ktorá obsahuje názov tabuľky, názvy stĺpcov tabuľky, ich údajový typ (int, char, varchar, float) s dĺžkou a špecifikáciu primárneho kľúča.
3. S využitím vašej štruktúry zostavte skript create.php pre vytvorenie tabuľky.
4. Ku Vášmu semestrálnemu zadaniu vytvorte formulár a skript s názvom zapis.php na zápis údajov do vašej databázovej tabuľky s využitím SQL príkazu INSERT, ktorého súčasťou sú jednotlivé hodnoty php premenných. Nezabudnite prepojenie (napr. $meno=_REQUEST['meno']).
5. Yytvorte skript s názvom vypis.php na výpis údajov z vašej databázovej tabuľky s využitím SQL príkazu SELECT.
6. Na záver nezabudnite všetky súbory (aj s príponou css), ktoré sa chystáte umiestniť do adresára s dnešným cvičením opraviť podľa http://validator.w3.org/   po úspešnej validácii umiestnite na spodok stránky ikony.
7. Podľa ukážky select.php a podľa štruktúry Vašej tabuľky vytvorte jej výpis na obrazovku.
8. Podľa ukážky agr.php a podľa štruktúry Vašej tabuľky vytvorte výpis niekoľkých agregačných funkcií.

11. cvičenie Tvorba aplikácie / samostatná práca na zadaní

Prednáška: Skripty pre prácu s troma tabuľkami

1. Prihláste sa na počítač sigma.tuke.sk, vytvorte v adresári html adresár Cvic11 .
2. Z cvičenia 10 budete používať súbory  vytvor.php ,  form.html , spracuj.php, select.php a súbor so štýlmi subor.css .
3. Nasledujúce úlohy bude každý riešiť samostatne a výsledok bude na konci cvičenia vyhodnotený. podklady ku vypracovaniu úloh nájdete na stránke: help
   • Vytvorte súbor hladaj.php , ktorý umožní vyhľadávanie záznamov na základe zvolených kritérií a k nemu príslušný súbor vysledok.php  .
   • Vytvorte súbory  update.php  ktorým zvolíte záznam podľa id a  update1.php , ktorý umžoní jeho úpravu prostredníctvom formulárových polí.
   • Vytvorte súbory  delete.php  ktorým zvolíte záznam podľa id a  delete1.php , ktorý vymaže zvolený záznam.
   • Všetky súbory z cvičenia prekopírujte do adresára Cvic11 na sigma.tuke.sk

12. cvičenie Tvorba aplikácie / samostatná práca na zadaní

Prednáška: Postup pri tvorbe php skriptov

1. Prihláste sa na počítač sigma.tuke.sk, vytvorte v adresári html adresár zadanie .
2. Cieľ zadania:
   • Vytvoriť hlavnú stránku (index.html) s minimálne jedným obrázkom a odkazmi na ďalšie dve podstránky.
   • Implementovať štýlovanie pomocou CSS/Bootstrap na celej webovej stránke.
   • Jedna z podstránok musí obsahovať formulár s minimálne štyrmi položkami.
   • Implementovať aby sa údaje z formulára po odoslaní zapísali do databázy pomocou SQL dotazov, vykonávať rôzne typy SQL dotazov.
3. Odovzdanie a obhajoba zadania:
   • Na cvičení z predmetu v 12./13. týždni
   • Podrobnosti: Hlavná stránka (index.html): Má obsahovať minimálne jeden obrázok. Odkazy na ďalšie dve podstránky.
   • Štýlovanie: Celá stránka musí byť štýlovaný pomocou CSS/Bootstrap.
   • Podstránka s formulárom: Musí obsahovať formulár s minimálne štyrmi položkami. Po odoslaní formulára sa musia údaje zaznamenať do databázy pomocou SQL dotazov.
   • Databáza: Tabuľka musí byť vytvorená vo Vašej databáze na serveri sigma.tuke.sk a pripravená na ukladanie údajov z formulára. Pri spojení s databázou musí byť využitých niekoľko rôznych SQL dotazov, pre tvorbu tabuľky, vytvorenie záznamov, zobrazenie záznamov, filtrovanie/zoradenie záznamov.
   • Obhajoba zadania: Pri obhajobe zadania je potrebné demonštrovať funkčnosť projektu a vysvetliť zdrojový kód.
     Bodovanie zápočtu (30 bodov):
     Aktivita a práca na cvičeniach – 10 bodov
     Funkčnosť zadania, formulára a zápisu do databázy - 10 bodov
     Štýlovanie pomocou CSS/Bootstrap – 5 bodov
     Obhajoba projektu - 5 bodov
4. Obsah semestrálneho zadania pre predmet s 1 kreditom:
   • Webová aplikácia pozostávajúca minimálne zo 4 webových stránok. Stránky sú jednotne naformátované s použitím technológií bootstrap a css. Každá stránka obsahuje menu a je možné medzi nimi preklikávať.
   • Jedna zo stránok obsahuje formulár, ktorý s použitím php odošle premenné, ktoré sa opíšu a vytvorí sa jednoduchý dialóg medzi formulárom a používateľom.
   • Hlavná stránka aplikácie je index.html. Všetky stránky aj formulár zodpovedajú textovým aj grafickým obsahom a téme zadania.
   • Zadanie obsahuje dynamické prvky php a javascript zosúladené s témou zadania.