Balík webdesignér a programátor web stránok špecialista - frontend developer a backend programátor a vyvojár

Balík webdesignér a programátor web stránok špecialista
frontend developer a backend programátor a vyvojár

Balík toto je balík 13 kurzov
cena kurzov Balík webdesignér a programátor web stránok špecialista - frontend developer a backend programátor a vyvojár
cena kurzov v balíku
pri kúpe kurzov
samostatne je
1 832,00 €
2 198,40 € s DPH
zľava kurzu Balík webdesignér a programátor web stránok špecialista - frontend developer a backend programátor a vyvojár
týmto balíkom kurzov
ušetríte oproti kúpe
kurzov samostatne až
632,00 €
758,40 € s DPH
cena balíka po zľave
konečná cena balíka
všetkých kurzov
po zľave je
1 200,00 €
1 440,00 € s DPH
Dĺžka balíka kurzov
dĺžka balíka kurzov
29 dní
Hotnotenia kurzu / počítačového školenia
hodnotenia účastníkov
priemerne 97,30 %
Miesto kurzu
Miesta otvorených kurzov:
Bratislava - centrum

Anotácia, popis kurzu:

akreditované a certifikované školiace stredisko - garancia spokojnosti - opakovanie kurzu zdarma

Tento profesionálny balík kurzov Vás je určený pre úplných začiatočníkov v oblasti tvorby a programovania web stránok. Prevedie Vás na našich kurzovch jazykmi ako HTML, CSS, JavaScript, jQuery, PHP a MySQL od základov po ich pokročilejšie možnosti. Tento balík je ideálny pre záujemcov o prácu na pozíciu fuul stack web programátora a developera a obsahuje všetky potrebné kurzy, ktoré ponúkame v tejto oblasti na to, aby sa z Vás stal webdeveloper - programátor webstránok profesionál.
Hodnotenie kurzu
Peter Bačinský
lektor kurzu
Tatiana P.  - hodnotenie kurzu: 100%
Velmi prakticke a prinosne skolenie, lektor pokryl nevyhnutne zaklady pre pracu s SQL Skuseny lektor, je vidiet, ze sa danej teme venuje, sharoval prakticke priklady. -
Bezplatné opakovanie kurzu
Každý termín môžete bezplatne opakovať, ak by ste kurz nezvládli na prvý raz.
Certifikovaný akreditovaný kurz
Sme akreditované školiace stredisko, certifikát získavate ihneď po kurze.
Všetko je v cene kurzu
Nemusíte si k nám nič nosiť, v cene kurzu sú materiály aj občerstvenie.

Kurz môžete u nás absolvovať:

Denne pondelok až piatok od 9:00 do 15:00 Večerne pondelok až piatok od 16:00 do 20:00 Cez víkend sobota a nedeľa od 9:00 do 14:00 Individuálne v akomkoľvek dni a čase podľa Vašej potreby Firemne uzatvorené firemné školenia kdekoľvek na Slovensku u Vás

Učebná osnova balíka
Balík webdesignér a programátor web stránok špecialista - frontend developer a backend programátor a vyvojár

Tento kurz je balíkom 13 kurzov, jeho osnova sa preto skladá z čiastkových osnov jednotlivých kurzov.

PHP I. - základy programovania a tvorba dynamických skriptov

  • Tvorba webstránok
    • trendy
    • potreba skriptovacích jazykov
    • kde sa nachádza HTML a kde PHP
    • lokálne a serverové jazyky
    • čo všetko sa na webe dnes dá spraviť
    • prečo web programovať a čo sú to redakčné systémy ako napr. Wordpress
  • Fronend a backend development alebo akú pozíciu zohráva PHP pri vývoji
    • kto je to návštevník a čo užívateľ vidí a čo nie
    • kto programuje užívateľskú časť
    • kto programuje serverovú časť
    • frameworky alebo keď sa programátorom nechce robiť
  • Serverové skriptovacie jazyky
    • porovnanie
    • PHP, Ruby, Asp, Python a iné
  • Webhosting a podpora servera
    • čo je to doména
    • čo je to webhosting
    • registrácia nového webhostingu a pripájanie sa na FTP server
    • podpora PHP jazyka
    • dovolené koncovky súborov pre PHP jazyk
    • podpora databáz
  • Inštalácia lokálneho servera
    • ako sa inštaluje lokálny server
    • WAMP, XAMP alebo MAMP
    • nastavenie a praktická inštalácia
    • koreňový adresár
    • kde ukladám svoje stránky
  • Vkladanie PHP do HTML jazyka
    • ako vkladám do hotovej stránky PHP skript
    • Short tag alebo skrátený zápis
    • prvá PHP skúška alebo “Ahoj Svet”
    • PHP súbor alebo PHP skript
    • viac blokov v jednom súbore
    • ukončovanie PHP skriptu
    • rozdiel medzi skriptom a PHP stránkou
  • Základné funkcie a kódová syntax či konštrukcie PHP jazyka
    • funkcia echo
    • funkcia print
    • ukončovanie riadkov
    • bloky a zátvorky
    • poznámky v kóde
    • výpis textu
    • vkladanie HTML značiek do PHP kódu
    •  jednoduchý príklad s výpisom dátumu a času
    • prvá aplikácia, prvý skript
  • Premenné a konštanty
    • premenné
    • definícia premenných
    • typy premenných
    • matematické funkcie nad premennými
    • algoritmizácia s premennými
    • konštanty
    • polia
    • ukazovatele
    • objekty
    • práca s premennými
  • Podmienky
    • čo je to podmienka
    • rozhodovanie – základ programovania
    • podmienka if
    • časť else
    •  else IF
    • switch
    • príklady na prácu s podmienkami
  • Cykly
    • čo sú to cykly
    • použitie
    • využitie
    • cyklus FOR, While a Foreach
  • Funkcie
    • používanie funkcií
    • vracanie hodnôt
    • parametre funkcií
    • práca s funkciami
  • Direktívy
    • premenné zo servera
    • superpolia alebo direktíva GET, POST a SERVER
    • GET – vracanie hodnôt s URL adresy alebo parametre nad spusteným skriptom
  • Skladba URL adresy
    • parametre
    • Rewrite mód
  • Vkladanie obsahu alebo na čo slúži include
    • ako sa vkladá obsah z iného súboru
    • Include a require a ich rozdiel
  • Tvorba komplexnej web stránky za použitia PHP
    • tvorba HTML šablóny
    • 3 spôsoby písania webstránky alebo komplexnej aplikácie
      • includovanie obsahu
      • rozdelenie na hlavičku a pätu
      • rewrite mód
    • tvorba webstránky s menu
    • vkladanie obsahu
    • úprava obsahu a titulkov
    • tvoríme aplikáciu
  • HTML formuláre
    • ako sa tvoria formuláre
    • typy formulárových polí: text, číslo, oblasť textu,  farba, dátum, výberové pole, radio button a checkbox
    • hotové možnosti: predpísaný text a overovanie hodnoty
    • atribúty akcia a metóda
    • tvorba jednoduchých formulárov
  • Spracúvanie formuláre v PHP
    • spolupráca HTML a PHP cez značku name
    • spracovanie formuláru
    • spôsoby odoslania formulára:
      • na tú istú stránku
      • odoslanie formuláru na stránku skriptu a rozhodovanie
      • odoslanie na web stránku
      • presmerovanie cez funkciu header
    • ochrana dát alebo overovanie na strane skriptu
  • Práca so súbormi
    • čo sú to súbory
    • textové súbory a binárne súbory
    • práca so súbormi na odkladanie a čítanie dát
    • otváranie súborov a módy
    • vkladanie riadkov do súborov
    • čítanie po riadkoch
    • tvorba praktických príkladov spolu so súbormi
  • Databáza nad súbormi
    • pojem záznam a riadky a stĺpec
    • tvorba dátových súborov
    • vkladanie dát cez formulár
    • čítanie dát cez while cyklus
    • databázová aplikácia obchod a produkty a užívatelia
  • Praktická tvorba alebo príklady, ktoré spravíme na kurze
    • galéria obrázkov
    • webstránka s menu a podstránkami
    • kniha návštev alebo jednoduchá databáza na súbore
    • anketa
    • počítadlo návštevníkov
  • Prenos súborov na webhosting a sfunkčnenie webstránky
  • Diskusia

PHP II. pre mierne pokročilých - úvod do objektového programovania

  • Úvodná diskusia
  • Nastavenie Apache servera a PHP jazyka
    • najčastejšie problémy v praxi
    • na čom “bežia” moje web stránky
    • čo môžem nastaviť a čo je pevné
    • nastavenia Apache prakticky: stránky typu 404 a errordocument, port, vykonávané dokumenty a procesy server, listovanie adresára, prístup do adresára a zakázanie prístupu, httpd.conf alebo .htaccess
    • základné Nastavenie PHP
    • ako môžem meniť nastavanie servera – PHP.ini alebo ini_set
  • Tvorba nových funkcií a bezpečnosť cez require
    • tvorba nových funkcií
    • parametre funkcií
    • výroba nových funkcií
    • Return alebo vracanie hodnôt
    • Include vs. require
  • Superglobálne premenné SESSION a COOKIE
    • čo je to SESSION
    • kde je uložené
    • ako sa prehliadač kontaktuje so serverom
    • registrácia SESSION premenných
    • vkladanie a čítanie dát do SESSION
    • registrácia PHP SESSION ID a kradnutie hodnoty
    • Cookie premenné
    • bezpečnosť COOKIE premennej
    • registrácia cez set_cookie
    • platnosť SESSION a COOKIE premennej
    • tvorba praktického príkladu
  • Práca s Emailom
    • posielanie emailu cez funkciu mail
    • posielanie emailu s hlavičkou
    • nastavanie emailu
    • posielanie prílohy
  • Serverové premenné
    • SERVER a jeho premenné
    • čo vieme o návštevníkovi
  • Tvorba praktickej aplikácie – programujeme štatistiku návštevnosti
  • Pokročilá práca so súbormi
    • tvorba adresárov
    • čítanie celého súboru
    • mazanie súborov
    • bezpečnosť súborov
  • HTTP hlavička
    • funkcia HEADER aj jej možnosti
    • názov skriptu
    • ako funguje HTTP hlavička a prehliadač
  • Dynamické generovanie dokumentov Obrázky, Word, Excel
    • ako fungujú dynamické dokumenty
    • princíp Word dokumentov
    • princíp Excel dokumentu
    • generovanie obsahu a tvorba dokumentov s dynamickými dátami
    • tvorba obrázkov alebo GD2 knižnica
    • jednoduchý príklad na obrázky alebo ako vytvoriť capcha obrázok
  • Bezpečnosť PHP skriptov
    • čitateľnosť
    • prípony
    • chybové hlášky
    • postupy hackerov
    • ako sa brániť
    • logovanie a sledovanie udalostí
    • Inlcudovanie za podmienky
    • vykonávanie za podmienok
    • adresáre pre skripty, pre súbory, obrázky a pre obsah
  • Zabezpečenie formulárov alebo XSS útok v praxi
    • základné zabezpečenie
    • čo je to XSS útok
    • ako sa brániť
  • Hashovanie a heslovanie – MD5
  • Úvod objektového programovania
    • čo je to objekt
    • rozdiel medzi objektom a funkciou
    • tvorba nového objektu
    • použitie objektu
    • rozdiel medzi funkciou a objektom
    • používanie a praktické cvičenia
  • Objekty v praxi – tvoríme PDF dokument
    • zakladáme objekt PDF
    • používame objekt PDF
    • vkladáme dáta
    • referenčná príručka a príkazy pre PDF knižnicu
    • exportujeme PDF
  • Úvod do problematiky SQL databáz
    • čo je to SQL databáza
    • MySQL a pripojenie pomocou objektu
    • objektové pripojenie cez MySQL
    • čítame dáta na obrazovku
  • Diskusia

PHP III. pre pokročilých - komunikácia s MySQL a tvorba databázových riešení

  • Keď sa povie databáza
    •  súbory vs. databáza
    •  architektúra databázy
    •  rozdiel medzi MySQL a Mária DB
    •  dotazovanie
    •  porty
    •  dáta
  • SQL jazyk
    • čo je to SQL
    • skúška SQL dotazu
    • základné dotazy nad databázou
    • odpovede servera
    • rozdelenie príkazov
  • Návrh databázy
    • čo je to databáza
    • čo je to tabuľka
    • čo sú to dáta
    • návrh jednoduchého databázového riešenia
    • kľúče a identifikátory a tvorba ID stĺpcov
    • relačná VS. Plošná schéma
  • Dátové typy alebo tvorba novej tabuľky
    •  stĺpce alebo riadky
    •  čísla, texty, dátumy a ostatné dáta
  • Tvorba databázy a úvod do programu PHP My Admin
    •  spustenie programu
    •  prihlásenie sa do programu
    •  používatelia a účty
    •  tvorba novej databázy
    •  tvorba tabuliek a štruktúry
    •  výroba novej tabuľky na základe zadania
  • SQL dotazy, ktoré budeme potrebovať
    •  select
    •  insert
    •  update
    •  delete
    •  klauzuly WHERE a ORDER
  • PHP a konektivita
    •  pripojenie sa na SQL server
    •  starý systém funkcia MySQL connect a nové objektové riešenia
    •  MySQL
    •  spúšťanie dotazov
    •  vyberanie výsledkov
    •  zobrazovanie na obrazovke
  • Vkladanie dát
    •  vkladáme dáta cez PHP My Admin
    •  tvorba PHP formulárov
    •  príkaz insert z PHP
  • Výpis dát na obrazovku
    •  výber dát cez fetch_array
    •  cyklus while
    •  balík údajov
    •  výpis na obrazovku
    •  odkazy a akcie
  •  Ako na akcie
    •  mazanie dát z obrazovky
    •  úprava dát alebo editácia
  • Prvé databázové riešenie – kniha návštev
    •  vyrobíme tabuľky
    •  vyrobíme formulár
    •  pridáme logiku a kód pre formulár
    •  vypíšeme výsledky
    •  kontrolujeme kód
  • Zoraďovanie a triedenie dát
    •  limity a stránkovanie
    •  radenie cez order
    •  filtrácia cez where alebo keď chceme iba niektoré záznamy
  • Tvorba druhej komplexnej databázovej aplikácie – knižnica krok po kroku
    •  návrh tabuliek
    •  tvorba tabuliek
    •  tvorba stránok
    •  tvorba formulárov
    • programovanie logiky
    • výpis dát do skriptov
    • manipulačné skripty na úpravu a mazanie dát
    • kontrola
  • 1. Samostatná úloha – jednoduchý internetový obchod
  • 2. Samostatná úloha – správa používateľov
  • jSON dáta alebo keď PHP s Echom nevládzu
    •  čo sú to jSON dáta
    •  vstavané funkcie PHP
    •  konvertovanie dát z MySQL do jSON
    •  výpis jSON dát cez JavaScript vs. dáta cez PHP
    •  ukážka v praxi
  • SQL inekcie a bezpečnosť dotazov
    •  bezpečnosť v praxi
    •  čo je to inekcia
    •  ako sa brániť
    •  kontrola dotazov
    •  PDO objekt a funkcie execute a prepace alebo budúcnosť bezpečného dotazovania
  • Diskusia

Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP

Úvod do problematiky tvorby www stránok

  • Čo je webová stránka? Ako sa dostane na môj počítač?
  • HTTP, HTTPS, FTP - protokoly v praxi protokol na prenos HTML
  • Čo je web a webserver?
  • Princíp tvorby webových stránok
    • Chcem si napísať obyčajný textový dokument, ale aby bol pekný
    • Potrebuje obsah - HTML
    • Vizuál - CSS
    • A interaktivitu - JavaScript, PHP
  • História HTML 4.01, XHTML, HTML5, www a web server
  • Trendy vo výrobe webových stránok
  • Editory na tvorbu webových stránok - porovnanie
  • Práca s programom na tvorbu a editovanie stránok: Notepad2, Brackets, Sublime Text, Atom a VS Code

Práca so súbormi

  • Základné prípony web stránok
  • Uloženie stránky
  • Otvorenie stránky
  • Otvorenie a uloženie súboru, otvorenie v prehliadači, znovu načítanie stránky
  • Optimalizácia klávesovými skratkami
  • utf-8 alebo ako na jazykovú sadu a jazyk web stránky

Základné princípy značkovacieho jazyka HTML

  • Základné príkazy a vkladanie HTML kódu do stránky
  • Ako sa vytvára webová stránka
    • !DOCTYPE
    • priznáme sa s verziou
    • hlavička stránky - meta údaje pre znakovú sadu, jazyk a titulok
    • telo stránky
    • štábna kultúra - správne odsadzujme náš kód
  • ako písať HTML príkazy
    • čo je to príkaz - element
    • čo je to atribút
  • Párové, nepárové značky a správne uzatváranie značiek
  • Formátovanie textu, B I U STRONG EM a BR
  • Nadpisy H1 - H6
  • Čiara HR
  • Práca s odstavcami - P
  • Vnáranie značiek do seba - ako spravím tučný a šikmý text?
  • Práca s oddielmi - DIV
  • Obrázky - IMG
    • vkladanie obrázkov
    • typy používaných obrázkov
    • používanie obrázkov ako pozadia
    • popisovanie obrázkov - ALT atribút
  • Zadávanie ciest k súborom
    • Relatívna cesta - na našej doméne
    • Absolútna cesta, URL - mimo našej domény
  • Hypertextové odkazy - A
    • textové odkazy
    • obrázkové odkazy
    • odkaz na e-mail
    • odkaz na stránku mimo našej domény
    • absolútna cesta odkazu
    • relatívna cesta
    • odkazy na iné súbory - na stiahnutie
    • odkaz na inú časť tej istej stránky
      • PDF
      • dokumenty Microsoft Word a Microsoft Excel
      • obrázky
      • iné
  • Zoznam UL OL LI
    • číslovaný
    • odrážkový
    • využívame zoznam na tvorbu navigačného menu
  • Tabuľky TABLE TR TH TD
    • zápis
    • používanie
    • tvorba záhlavia, riadkov, buniek
  • Rámce a iframe - IFRAME
  • Iné HTML tagy
  • HTML parametre, ktoré sa nepoužívajú
  • HTML tagy, ktoré sa nepoužívajú

Moderné princípy web stránok a príkazy jazyka HTML5

  • rozdiely medzi verziami HTML
  • prístupnosť
  • sémantické elementy a správna štruktúra web stránky

Základy a princípy jazyka CSS

  • história CSS jazyka a verzie CSS 1, 2 a CSS 3
  • Tvorba moderných webových stránok, využívanie CSS na zadávanie štýlu
    • oddelenie grafiky od textu
  • Ako CSS vkladáme do stránky?
    • priamy štýlopis - Nie je to veľmi dobré, ale keď musíš, tak musíš
    • STYLE v hlavičke súboru - Lepšie, ale predsa len ...
    • externý súbor - ideálne
    • merné jednotky - percentá, PX, EM a REM
    • vkladanie CSS štýlu
      • selektory v CSS jazyku
      • priamy štýlopis
      • CSS zápis priamo v HTML súbore
      • CSS zošit
      • nanášanie cez identifikátor
      • nanášanie štýlu cez triedu - class
  • preberanie referenčnej CSS príručky
  • CSS selektory
    • Na čo slúžia?
    • Ako sa píšu?
      • Selektor podľa HTML značky
      • Selektor podľa triedy - class
      • Selektor podľa identifikátora - ID
  • textové efekty
    • farba písma
    • typ písma
    • tučné, šikmé, zarovnané vpravo, na stred, do bloku, riadkovanie
    • práca s fontom
    • štýly písma
    • ostatné CSS príkazy
  • Bližšie vysvetlenie jednotiek v CSS - px a %
  • Farby v CSS - pomenovaná farba, RGB model, hexakód
  • Zápis fontov v CSS , možnosti, ake nemám daný font
  • práca s pozadím - farba alebo obrázok
    • Obrázok na pozadí ako kachličky
    • Obrázok na pozadí ako veľká fotka
  • práca obrázkami na pozadí
  • práca so zarovnávaním
  • Vrátenie sa k HTML - delíme našu stránku na oddiely/škatule - DIV
  • Všetko je škatuľa - box model a vlastnosti veľkosti, odsadenia a obrysy objektov
    • šírka a výška HTML elementov
    • Pretekanie obsahu
    • Odsadenie z vnútra - padding - niekedy nafukuje (box-sizing)
    • Odsadenie z vonku - margin
    • Rámček/bordúra dookola
  • Zarovnáme škatule vpravo a na stred?
  • nanášanie CSS jazyka priamo na elementy a atribút STYLE
  • Praktický príklad: Tvoríme svoju prvú hotovú webovú stránku
    • Tvoríme rozloženie: stredový stĺpec s 3 oddielmi - hlavička, menu a obsah
    • Prepájame stránky odkazmi
    • nastavujeme menu
    • tvoríme štruktúru
    • vytvárame obsah
    • nastavujeme vzhľad cez CSS štýl
    • vytvárame a vkladáme grafiku
    • kopírujeme stránku a linkujeme menu
    • editujeme obsah podstránok
  • FTP a domény, publikujeme webovú stránku
    • aký webhosting budeme potrebovať, aké sú možnosti na trhu
    • akú doménu si zvolíme
    • aké programy používame na kopírovanie cez FTP
    • registrujeme si bezplatný webhosting a stránku kopírujeme na webový server

CSS štýly a grafika na web stránkach:

  • CSS selektory - optimalizujeme náš CSS kód
    • Kombinujeme selektory - selektor dietaťa (>), selektor potomka (medzera)
    • Viac selektorov pre jednu definíciu (,)
    • nanášanie CSS jazyka NIE priamo
    • selektor - názov HTML tagu
    • selektor - názov triedy
    • selektor - identifikátora
    • selektor - rodič a potomok
  • Tvoríme ďalší príklad a novú hotovú webovú stránku
  • Upravujeme webstránku s novými CSS efektami
    • nastavujeme menu, tentokrát vyžívame zoznam
    • tvoríme novú grafiku
    • nanášanie vlastností cez identifikátor
    • nanášanie štýlu cez triedu - class
    • tvoríme viacstĺpcový design stránky alebo aj navigácia v riadku
    • ukladáme 2 odstavce vedľa seba - vlastnosť float
    • pracujeme s relatívnymi pozíciami
    • upravujeme obsah

Tvorba dynamických webov a JavaScript a PHP začiatočník:

  • Čo je dynamický web?
  • Dynamickosť na strane servera a klienta - jazyky PHP a JavaScript
  • JavaScript
    • Beží lokálne - môj počítač mení stránku
    • Čo JavaScript môže a čo už nie
    • Ako a kde JavaScript zapisujeme?
    • Základný princíp: akcia - reakcia: kliknem a niečo sa zmení
    • Pravidlá syntaxe a zápis - ukážka
  • PHP
    • Beží na serveri - iný počítač mi mení a tvorí HTML kód
    • Stránky sa skladajú dynamicky - po kúskoch ako lego
    • Čo je to Apache?
    • Čo môže robiť PHP?
    • Ako a kde zapisujeme PHP?
    • Pravidlá syntaxe a zápis - ukážka
    • Ukážka príkazov echo a include

Odborná diskusia s lektorom

  • Trendy vo vývoji HTML a CSS jazyka
  • responzívny webdesign a mobilné aplikácie, CSS grid
  • Aké webové stránky sa ľuďom páčia
  • Aký typ grafiky si zvoliť
  • Webhosting, ceny, služby, prieskum trhu
  • Domény, registrácia, možnosti
  • Diskusia s účastníkmi

MySQL a SQL jazyk I. - inštalácia, správa, úvod do databáz a SQL programovanie

  • Úvod do databáz a SQL
    •  čo je to databáza
    •  čo je to databázový server
    •  čo je to SQL
    •  rozdiely medzi platformami alebo ako sa vo svete SQL a databázových riešení vyznať
  • Základné pojmy v prostredí databáz a SQL servera
    • databáza
    • relačná databáza
    • databázový server
    • tabuľka
    • pole
    • záznam
    • relácia
    • funkcia
    • dotaz
  • Úvod do databáz MySQL
    • možnosti inštalácie
    • inštalácia
    • základné nastavenie
    • spustenie MySQL servera
    • prihlásenie na MySQL server lokálne
    •  prihlasovanie sa na sieťový server
  • Databázové schémy
    •  ako sa tvorí návrh
    •  spôsob kreslenia návrhov
    •  ako sa vo svete databáz premýšľa
    •  odkladanie dát a správne triedenie
    •  databázové štruktúry a schémy
    •  plošná schéma
    •  relačná schéma
  • Úvod do jazyka SQL
    • čo je to SQL
    • databázové platformy SQL a ich rozdiely
    • základná syntax jazyka SQL
    • všeobecné príkazy pre prácu s MySQL serverom
    •  rozdelenie SQL príkazov
  • Dátové typy
    •  Čo sú to dátové typy
    •  rozdelenie dátových typov
    •  preberanie a prehľad dátových typov
  • SQL konzola
    •  Práca s konzolou
    •  logovanie záznamov
    •  práca s oknom
    •  opakovanie príkazu
    •  vkladanie príkazov
    • delimiter
  • Vytváranie dátovej štruktúry
    • vytváranie databáz, príkaz CREATE DATABASE a USE
    • vytváranie tabuliek, príkaz CREATE TABLE
  • Modifikácia dátovej štruktúry
    • úprava databáz, príkaz ALTER DATABASE
    • mazanie databáz, príkaz DROP DATABASE
    • úprava tabuliek, príkaz ALTER TABLE
    • mazanie tabuliek, príkaz DROP TABLE
  • Modifikácia dát v tabuľkách
    • vkladanie dát do tabuliek - príkaz INSERT
    • úprava dát v tabuľkách - príkaz UPDATE
    • mazanie dát z tabuliek - príkazy DELETE, TRUNCATE
  • Výber dát z tabuliek
    • úvod do práce s príkazom SELECT
    • horizontálne a vertikálne filtrovanie záznamov
    • zoraďovanie výberu - ORDER
    • výber unikátnych záznamov
    • výber určitého počtu záznamov LIMIT
  • Import dát
  • SQL transakcia
  • Zálohovanie dát
  • Webový prístup cez PhpMyAdmin
    • spustenie programu
    • práca s programom
      • prehľad obrazovky
      • výber tabuliek
      • výber databáz
      • práca s dátami
    • pracovné prostredie
    •  tvorba nových databáz
    •  tvorba nových tabuliek
    • práca s dátami
    • import
    •  export
    •  SQL príkazy
  • Heidi SQL – inštalácia a používanie
  • Tvorba praktických príkladov
  • Diskusia

MySQL a SQL II. - pokročilé SQL, relačné databázy a Workbench

  • Opakovanie a diskusia
  • Čo sú to dátové relácie
  • Dôvody používania relačných vzťahov
  • Vytváranie relačnej dátovej štruktúry
    • typy relácií
    • 1:1, 1:N, M:N
    • vytváranie relačných tabuliek
    • spôsob prepájania a logika tvorby tabuliek
    • práca s indexami
    • kľuče
    • práca s unikátnymi indexami
  • praktické príklady a cvičenia relácií
  • Nové tabuľky na základe dát
    •  Pohľadové tabuľky – VIEW
    •  čo sú to pohľady
    •  správa pohľadov
    •  zobrazenie dotazu nad pohľadom
    •  mazanie pohľadov
    •  Nové tabuľky na základe SELECTov
  • Výber z viacerých tabuliek naraz
    • príkaz JOIN
    • spôsoby vnorených dotazov
    • SELECT z viacerých tabuliek za použitia WHERE filtrovania
    • INNER
    • LEFT
    • RIGHT
    • optimalizácia dotazu
    • úvod do technológií ladenia dátovej štruktúry
    • práca s indexami
  • Praktické príklady
    •  knižnica
    •  e-shop
  • MySQL WorkBench
    •  Inštalácia
    •  spustenie
    •  tvorba sedenia a pripájanie sa k databázovým serverom
    • úvod do práce s programom
    • základné funkcie, pravidlá a prostriedky
    • práca s tabuľkami a dátami
    • administrácia servera
    • úvod do modelovania dát
    • tvorba diagramov a dátovej štruktúry podľa návrhu
    • reverzné inžinierstvo
    • ako dostať nákres do SQL jazyka
    • návrh databáz
    • tvorba tabuliek bez nutnosti programovania
    • práca s programom
  • Pokročilý výber dát z tabuliek
    • agregačné funkcie a výpočty v tabuľkách
    • základné matematické operácie, SUM, AVG, COUNT, MIN, MAX
    • dátumové funkcie
    • textové funkcie
    • šifrovacie a hashovacie funkcie
  • Mysql Dump  - záloha a obnova cez príkazový riadok
    • zálohovanie databáz
      • export dát
      • import dát
  • Praktické príklady
    • banka
    • predajňa
    • iné – podľa požiadaviek účastníkov

 

Tvorba, programovanie webstránok III. - expert HTML a CSS, pokročilé selektory, médiá a formuláre

Pokročilé CSS vlastnosti a selektory

  • Vyskakujúci podzoznam - finta s :hover a display,
  • kombinátor selektorov  - súrodenci (+, ~)

Moderné formátovanie tabuliek

  • CSS vlastnosti - border, border-collapse, border-spacing, vertical-align
  • Zafarbenie riadkov na preskačku - selektory :first-child, :nth-child(), :last-child

Fonty a ikonky

  • HTML entity (napr  ) a iné akože ikonky
  • Emoji
  • Fonty s ikonami na stránke, Font Awesome, Glyphicons, …
  • Pseudo-element selektory ::before a ::after a CSS vlastnosť content

Pozadie stránky - rozšírené

  • Farebné prechody v pozadí - linear-gradient(), radial-gradient()
  • Viacnásobné pozadia
    • Pozícia: background-position
    • Obrázky, priehľadné textúry, filtre
    • gradienty

Médiá a videá na stránke

  • Kedysi Flash, dnes už nie
  • Vkladáme video z Youtube/Vimeo
  • AUDIO element a jeho SOURCE
  • VIDEO element
  • Atribúty controls, autoplay, muted, loop
  • Podporované formáty - mp3, mp4, ogg
  • Video ako pozadie stránky

Formuláre na stránke

  • Čo je formulár? (FORM)
  • Ako sa posielajú dáta? - atribút METHOD
    • Aké sú možnosti?
    • Aké výhody má GET? - URL ma dostane priamo na n-tú stránku
    • Aké výhody má POST - dáta idú skryto
  • Element INPUT
    • Atribúty TYPE, NAME, VALUE
    • Bežné typy inputov -
      • TEXT, PASSWORD a atribút MAXLENGTH
      • Prečo máme HIDDEN?
      • RADIO - pozor na name a value atribúty
      • CHECKBOX - atribút CHECKED
      • SUBMIT, RESET - nepoužijeme radšej BUTTON element?
      • FILE - atribút ACCEPT pre výber typu súboru, atribút MULTIPLE
    • Nové typy inputov - COLOR, DATE, EMAIL, NUMBER, RANGE
    • Nové atribúty - MIN, MAX, PLACEHOLDER
    • Atribút PATTERN - definovanie vlastného inputu
    • Podpora nových inputov
    • Kde si môžem skontrolovať podporu HTML a CSS vlastností? - caniuse.com
    • Náhrada - jQuery UI datepicker,...
  • Element SELECT + OPTION - výber rôznych hodnôt
  • Element DATALIST - našepkávač hodnôt
  • Element TEXTAREA
  • Element LABEL a spravenie prístupnejšieho formulára
    • Použitie atribútu TABINDEX
  • Element FIELDSET a LEGEND - rámčekovanie nášho formulára
  • Validácia formulárov prehliadačom
    • Atribúty REQUIRED, READONLY, DISABLED, ACCEPT

Formátovanie formulárov

  • Selektor podľa atribútu [type], [type=xyz]
  • Pseudo-class selektory - :required, :disabled, :read-only, :checked, :focus
  • Prefixované CSS vlastnosti  -moz-, -webkit-
  • Špecificita selektorov - čo určuje, ktorý selektor sa uplatní?
  • Upravíme si formulár pomocou nových selektorov a vlastností
    • orámujeme inputy, odsadíme a otieňujeme
    • Uplatníme nové selektory a vlastnosti

Prechody a animácie

  • CSS vlastnosť transition
    • aplikujeme na :hover selektor
    • Postupná zmena
      • Čo sa má zmeniť?
      • Trvanie
      • Omeškanie
      • Prechodové funkcie
        • Ease
        • Linear
        • Ease-in
        • Ease-out
        • Ease-in-out
        • steps
        • Cubic-beziere
      • Viaceré prechody
    • Spravíme si animované tlačidlo
  • CSS vlastnosť transform - Geometrické transformácie
    • Otáčanie - rotate
    • Škálovanie - scale
    • Skosenie - skew
    • Posun - translate
  • CSS vlastnosť animation
    • Čo môžem animovať a čo nie? - animatable
    • @keyframes pravidlo
    • Animujeme ako film - postupnosť zmien
    • Trvanie, omeškanie a prechodové funkcie ako transition
    • počet opakovaní
    • Smerovanie
    • Fill-mode
    • Pozastavenie animácie

Tvorba, programovanie webstránok V. - jQuery, interaktivita a úvod do JavaScriptu

  • Pohľad na modernú webstránku
    • Dnes využívané technológie
    • HTML5 a podpora JavaScriptu
    • Vývoj jazyka JavaScript
    • Podpora prehliadačov
    • Čo všetko dnes vieme spraviť na webe?
  • Píš menej, urob viac – jQuery
    • Čo je to knižnica jQuery?
    • Ako sa v jQuery programuje?
    • Čo budeme potrebovať?
    • Nástroje na ladenie skriptov
    • Dostupnosť a verzie
    • Výhody a nevýhody
    • Čo sa robí cez jQuery a čo pomocou CSS a HTML5?
  • Pripájame do stránky jQuery
    • Aktuálna verzia
    • Podpora IE
    • Čo je to plná verzia a čo jQuery min?
    • Stiahneme si jQuery lokálne, alebo máme použiť CDN?
    • Prvý príklad
  • Predstavme si dôležité možnosti a funkcionality
    •  Funkcie
    •  Prístup k objektom
    •  Animácie
    •  Interaktivita
  • Začíname programovať v JavaScripte s pomocou jQuery
    •  Elementy, selektory a atribúty
    •  Objektový model dokumentu – DOM
    •  Vlastné selektory a pozičné selektory
    •  Vyberáme a pristupujeme na objekty cez
      • Názov
      • Atribút
      • Triedu
    •  Prvé príkazy: .html, .text, .css, .hide, .show, .toggle, .addClass
    •  Syntax „jazyka“
    •  Ostatné selektory: všetko, tagy v tagoch, podľa obsahu, podľa potomkov, podľa atribútov, ...
    •  Tagy podľa hodnoty atribútu a iné
    •  Pozičné selektory v praxi – tabuľky a zoznamy
    •  Pracujeme s DOM
      • Zabudnime na onclick = “moja funkcia();“ – máme niečo lepšie!
      • Skrývame a odkrývame na jeden klik
      • CSS ešte efektívnejšie
  • Nový selektor - Hľadáme texty :contains
  • jQuery a udalosti
    •  Čo sú to udalosti?
    •  Priame nanášanie udalostí – eventuality
    •  Prepojenie eventualít a jQuery
    •  Obsluha udalostí
    •  Obsluhujeme selecty a sledujeme hodnoty
    •  Zväzujeme udalosti .on
      • Zisťujeme pozíciu kurzora
      • Zisťujeme informácie o objektoch
      • .mouseenter vs. .mouseover
      • Ostatné udalosti: mousedown, mouseup, mouseleave
      • Nanášame na objekt viac udalostí
      • pageX a pageY
    • Obsluhujeme klávesnicu
      • Sledujeme stlačené znaky
      • Kontrolujeme vstupy
      • Focusin, focusout
  • Efekty za pár sekúnd
    • Neprogramujme – používajme
    • CSS vlastnosti display a opacity
    • Show, hide, toogle, fadein, fadeout a vlastnosť duration
    • Slideup, slidedown, slidetoogle
    • Pokročilé grafické efekty a animácie
  • .animate a jej vlastnosti
  • jQuery a vstavané AJAX funkcie
    •  Z čoho sa skladá AJAX?
    •  Využívanie $.ajax
    •  Čítame externý obsah bez nutnosti refreshu celého prehliadača
    •  Jednoduchý príklad – hodiny
    •  Tvoríme záložkový AJAX systém
    •  Spracovávame hodnoty z formulára cez AJAX
    •  Rozdiel medzi požiadavkami POST a GET
    • metóda .load
  • Programujeme a tvoríme praktické príklady
  • Diskusia

Tvorba, programovanie webstránok II. - pokročilé HTML, CSS a moderný webdesign

Zopakovanie HTML tagov, ktoré budeme potrebovať

  • práca s textom
  • práca s odstavcami
  • Obrázky a odkazy
  • Zoznamy a tabuľky
  • oddiely a časti webstránky
  • obrázky a pozadia
  • odkazy
  • nástroje pre vývojára alebo DEVELOPERS TOOLS v prehliadači

Nové HTML Elementy

  • Čo sú sémantické elementy? W3 štandard
  • Aký majú význam značky STRONG, EM, INS, DEL, ADDRESS, ABBR, BLOCKQUOTE, CITE?
  • Blokové sémantické elementy - HEADER, FOOTER, NAV, ASIDE, ARTICLE, SECTION, MAIN
  • Prerobíme DIVká na stránke na sémantické elementy

Grafika na webstránkach

  • na čo sa používajú obrázky
  • kedy sa používajú obrázky pozadia
  • rozdelenie grafických formátov
    • rastrové
      • JPG
      • png8 a png24
      • PNG
      • GIF
      • Animácie
    • Vektorové - SVG
  • použite grafických formátov - na čo je ktorý formát vhodný
  • kde nájdem vhodnú grafiku? - fotobanky, platené/zadarmo, ikony
  • obrázky a legislatíva
  • Úprava rastrových obrázkov
    • Šetríme prenosové pásmo, zrýchľujeme stránku pomocou obrázkov vhodnej veľkosti a kvality
    • Vhodná veľkosť - orezanie obrázku online služby/Photoshop
    • Optimalizácia kvality - online služby/Photoshop
  • Prečo je vektorová grafika budúcnosť webu?
    • SVG je bratranec HTML
    • SVG formát

Zopakovanie CSS jazyka

  • CSS I., CSS II. a CSS III.
  • Syntax
  • zápis CSS štýlu
    • priamo
    • Štýl v HTML súbore
    • externý súbor
    • výhody / nevýhody
  • Selektory
    • Podľa HTML značky
    • Podľa triedy - class
    • Podľa identifikátora - ID
    • Kombinácie selektorov (child selector a descendant selector)

CSS pokročilý

  • Nové jednotky na veľkosť - em, rem
    • Aká je základná veľkosť fontu? Čo je 1em?
    • Rozdiely em a rem a ich využitie - prístupnosť
  • Využitie nových fontov na stránke
    • Google fonts
    • Prečo je font-weight udaná v číslach?
    • @font-face direktíva na vkladanie vlastných fontov - čo obsahuje?
    • Vložíme si manuálne do stránky nový font (z 1001fonts/dafont)
  • Definície a volanie farieb
    • Nové definovanie farieb s priehľadnosťou - rgba(), hsl(), hsla()
    • hexakód a priehľadnosť - podpora nových vecí prehliadačmi: caniuse.com
  • Margin, padding - komplexnejší príklad
    • Dvoj, troj a štvorhodnotový zápis margin a padding
  • Problémy pri box modeli - margin collapse,  box-sizing
  • Niekedy je lepšie použiť padding ako margin a naopak
  • Pre kontorlu použijeme DEVELOPER TOOLS v prehliadači
  • CSS reset - keď prehliadač robí napriek
  • Spravíme si jednoduchý reset pre box-sizing, využijeme selektor všetkého (*)

Pozíciovanie - CSS vlastnosť position

  • Static - to, čo doteraz
  • Relative - relatívne voči originálnemu miestu
  • Posúvame veci left, right, top a bottom
  • Fixed - fixne na obrazovku
  • Absolute - najkomplikovanejšie ale najpoužívanejšie

Vlastnosť display a viditeľnosť v CSS

  • Keď chcem elementy skrývať
  • Meníme blokovitosť a riadkovitosť
  • Spravíme si riadkové menu
  • Prekresľujeme z príkladov
    • základom je aby po kurze účastníci vedeli kopírovať vizuálne vzhľad z predlohy a vedeli to vytvoriť a zapísať do HTML a CSS kódu, preto je súčasťou kurzu aj nácvik prekresľovania obrázku stránky do HTML a CSS aj nasledujúce cvičenia:
      • prekresľovanie rôznej grafiky do HTML a CSS
      • kontrola a vyhodnocovanie
      • zapracovanie šablóny do webstránky
  • Záverečná diskusia a priestor na otázky

Kurz JavaScript I. - programovanie a základy jazyka

Čistý JavaScript

  • Úvod do jazyka
  • História
  • Podpora prehliadačov
  • Čo vlastne JavaScript vie
  • Čo s JavaScriptom neurobíme

Začíname programovať

  • Ukážka skriptu
    • Kde JavaScript píšem?
    • Do HTML, externý súbor
    • Ako JavaScript využijem? - Reagujem na udalosti
    • Čo sú udalosti - eventuality?
    • HTML atribúty on***
    • Nájdenie elementu - funkcia getElementById
    • Zmeníme text - vlastnosť innerHTML

Syntax jazyka

  • Spôsob zápisu a syntax
  • Premenné a spôsob zápisu
  • Rozdelenie premenných na privátne, lokálne
  • Poznámky a komentáre
  • Typy premenných
    • Číslo
    • Text
  • Čo s nimi môžem robiť?
    • Matematika +, -, *, /
    • Spájanie textov +
  • Konštanty
  • Objekty
  • Zápis premenných do textu, resp. do stránky

Výpis na obrazovku

  • Alert
  • Document.write
  • InnerHTML
  • console.log
  • Rozdiely

Funkcie

  • Čo je funkcia?
  • Funkcia - kamarát, ktorý pracuje za nás
  • Tvorba funkcií
  • Zápis funkcie
  • Parametre funkcie - žiadny alebo niekoľko
  • Výstup funkcií - return
  • Spravíme si konvertor jednotiek

Podmienky

  • Podmienka IF
  • Operátory - porovnávanie hodnôt
    • Pravdivostné hodnoty
    • >, >=, <, <=, ==, ===, !=
  • Praktické príklady
  • AND a OR alebo keď jedna podmienka nestačí
  • Negatívna časť podmienky - časť ELSE
  • ELSE IF
  • Podmienka SWITCH
  • Praktické príklady

Cykly

  • Problematika cyklov
  • Využívanie cyklov
  • Cyklus for
    • syntax
    • Využitie
    • Operátor ++
    • praktický príklad
  • Cyklus While
    • syntax
    • využitie
    • praktický príklad
  • metód poľa Foreach
    • syntax
    • vyžitie
    • praktický príklad
  • Zastavenie cyklov - break
  • Riadiaca premenná

Polia

  • Rôzne hodnoty v jednom balíku
  • Index začína od nuly
  • Vlastnosť “length”
  • “Poľoidné” hodnoty z funkcií getElementsByClassName, getElementsByTagName a querySelectorAll

Nástroje prehliadača

  • Konzola
  • Chyby v JS a ich ladenie
  • Sledovanie programu krok za krokom

Tvorba, programovanie webstránok IV. - responzívny dizajn, media pravidlá, flex a grid rozloženie

Úvod do responzívneho webdizajnu:

  • Responzívny web dizajn
    • Čo to je?
    • Prečo to robíme?
    • Dnes už nutnosť - rozšírenie mobilných zariadení
    • Fluidný design - používame percentá
    • Adaptívny design - cielime zariadenia
    • Responzívny design - cielime obrazovky
      • mobil
      • tablet na výšku
      • tablet na šírku
      • počítač
      • FHD/4k monitory
    • Iné varianty - m.doména - slabé SEO
  • Prakticky robíme responzívnu stránku
    • Mobile first prístup
    • Metaznačka viewport
    • CSS pixel
    • Nastavenie bodov zalomenia - koľko ich treba?
    • Dôležitá je pohodlnosť pre užívateľov
    • float vs. display vs. tabuľky
    • pozície v CSS jazyku a spoľahlivosť rozmerov

Media:

  • @media knižnice pravidláalebo keď "@" zmení celý web
    • čo sú to @media knižnice pravidlá
    • keď ide JavaScript bokom
    • príkazy podmienky @media - max-width, min-width, orientation, ...
    • podpora prehliadačov
  • Responzívne obrázky
    • Veľká obrazovka - veľký obrázok, malá obrazovka - malý obrázok
    • Problém s rôznymi veľkosťami
    • Problém s umeleckým dojmom obrázku - art direction
    • Rôzne veľkosti obrázkov, ako na to?
    • Atribúty SRCSET a SIZES
    • Čo je jednotka “w”?
    • Media podmienky
    • Úprava obrázkov

Rozloženie stránky pomocou Flexbox:

  • Čo je flex layout?
  • Podpora prehliadačov
  • Elementy už nie sú len block a inline
  • Flex-rodič a flex-deti
  • Flex smerovanie a zalamovanie
  • Vieme zarovnávať horizontálne ale aj vertikálne
  • Vycentrovanie elementu v kontajneri na 3 riadky
  • Order - premiestňujem elementy v CSS
  • Aká je veľkosť mojich elementov?
  • Width nefunguje - flex-basis
  • Funguje max-width a min-width
  • Zväčšovanie a zmenšovanie - flex-grow a flex-shrink
  • Spravíme si galériu obrázkov

Rozloženie stránky pomocou Grid:

  • Čo je grid layout?
  • Podpora prehliadačov
  • Grid rodič - kontajner, grid dieťa
  • Čiary a trate v grid rozložení - stĺpce a riadky
  • Grid-template - delíme našu mriežku
  • Používame veľkosti alebo názvy čiar
  • CSS funkcie REPEAT, MINMAX, FIT-CONTENT
  • CSS jednotka FR
  • Grid-area - definovanie plôch mriežky
  • Grid-gap - medzery v našej mriežke
  • Align a justify - zarovnávanie
  • Implicitná a explicitná mriežka - grid-auto
  • CSS hodnota dense
  • Elementy mriežky - CSS hodnota SPAN
  • Spravíme si stránku novín

Praktické cvičenia na kurze:

  • prerábanie jednoduchej šablóny na responzívnu
  • lektor dodá grafické zadanie - obrázok s popisom veľkosti
  • prekresľovanie šablóny
  • kontrola lektora počas vypracúvania
  • účastníci budú prekresľovať aspoň grafické návrhy, ktoré budú vopred pripravené
  • kontrola a vyhodnocovanie
  • Prekresľovanie šablóny za pomoci FLEX a GRID rozloženia

Bootstrap I. pre začiatočníkov - responzívny HTML, CSS a JS framework

  • Čo je Bootstrap
    • Čo je responzivita a prečo mať stránky responzívne.
    • Prečo Bootstrap - ako mi pomôže s responzivitou.
    • Bootstrap a podpora prehliadačov.
  • Ako Bootstrap použiť
    • Stiahnutie a "inštalácia"
    • Minimálna šablóna.
    • Ošetrenie kompatibility.
  •  Ako je Bootstrap delený
    • CSS - na vylepšenie a skrášlenie obsahu - písma, farby, zarovnanie a pod
    • Komponenty -Na logické združenie obsah a pridelenie významu - skupiny tlačítok, upozornenia a pod
    • JavaScript - Na oživenie obsahu - "kolotoče", "harmoniky", "vyskakovacie okná" a pod. 
  •   Tvoríme Bootstrap (responzívnu) stránku
    • Návrh -Čo je "mobile first".
    • Prečo a ako deliť obsah do blokov už pri návrhu.
    • Tvorba štruktúry
    • Povinná štruktúra stránky
    • Kontajnery
    • Riadky
    • Bloky
  • Práca s blokmi
    • Čo je responzívna sieť - responsive grid
    • Vnáranie blokov 
  • Pomocné triedy
    • Odsadzujeme / posúvame bloky - offset
    • Meníme poradie blokov - pull, push
    • Skrývame/zobrazujeme bloky - hide, show
    • Riešime problémy s nerovnakou výškou blokov - clearfix
  • Vkladáme menu
    • Vyberáme typ menu
    • Práca s navigačnými záložkami - nav tabs
    • Práca s navigačnými tlačítkami - nav pills
    • Práca s navigačným panelom - nav bars
  • Vkladáme obsah
    • Text    
    • Nadpisy
    • odseky
    • Skratky
    • Citácie
    • Zoznamy

 

  • Tabuľky
    • Formuláre
    • Obrázky
    • Videá

      

  •   Formátujeme obsah bez vlastného CSS
    • Vylepšujeme textové prvky
    • Vylepšujeme tabuľky
    • Vylepšujeme obrázky
    • Vylepšujeme videá
  • Vkladáme komponenty
    • Ikony - glyphicons
    • Tlačítka - buttons
    • Panely - panel, well, jumbotron
    • Stránkovanie - pager
    • Upozornenia - alert
    • Ukazatele priebehu - progress bar
  • Oživujeme obsah
    • Rozbaľovacie tlačítka - dropdowns
    • Vyskakovacie okná - modals
    • Potvrdzovateľné upozornenia
    • Záložkový systém pre obsah - tabs
    • Kolabovateľný obsah - accordion
    • Kolotoč obrázkov - carousel
    • Riadková a bloková pomoc pre obsah - tooltip, popover 
  • Testujeme stránku
  • Ako ďalej - beyond bootstrap
  • Úprava Bootstrap
  • Vylepšenia Bootstrap
  • Material design
  • Podpora tém
  • Hotové komponenty
    • Hotové príklady
    • Zdroje informácií
    • Iné frameworky

Kurz JavaScript II. - JSON a dáta, pokročilé možnosti a konštrukcie jazyka

  • Opakovanie

    • hľadanie v DOM

    • eventy - na čo môžme reagovať

    • čo môžme meniť

    • ukazka zmeny na viacerých elementoch

    • Dátové typy a operácie s nimi

    • funkcie

    • Podmienka If

    • Cykly For a While

  • Objekt

    • Čo je objekt?

    • Iný druh poľa - pomenované prvky

    • Bodková notácia vlastností

    • Objekt window, document

    • Vlastnosti môžu byť aj funkcie

  • Funkcie v objekte

    • Zápis funkcie ako vlastnosti objektu - function expression

    • Vlastnosť “this”

  • vstavané objekty a čo s nimi môžeme robiť

    • Math

      • Zaokrúhľovanie

      • generovanie náhodného čísla

    • Number

      • Konverzia z textu na číslo - parseInt, parseFloat

    • String

      • Hľadanie v texte - includes, indexOf, replace

      • Orezávanie textov - split, slice, trim

    • Date

      • Získanie dátumu

      • Manipulácia - počítanie s dňami, mesiacmi, rokmi

    • Spravíme si formulár s úrokovou kalkulačkou

  • Funkcie, ktoré voláme spätne - callback funkcie

    • Zbavíme sa on*** atribútov

    • Použijeme “počúvadlo na udalosti” s callback funkciou - addEventListener()

    • Anonymné callback funkcie - píšeme ako obyčajné parametre

    • Udalosť nahratia celej stránky - DOMContentLoaded

    • Parameter event pre callback funkciu

    • Reagujeme na stlačenie kláves - event.which

    • Reagujeme na pozíciu myší - event.clientX, event.clientY

    • Vybublávanie udalostí - preventDefault(), stopPropagation()

    • Spravíme si jednoduchú hru

  • Polia s callback funkciami

    • Array.forEach

    • Array.map

    • Array.filter

  • JSON

    • Spôsob zápisu JS objektov

    • porovnanie s XML

    • využitie

    • Objekt JSON a metódy parse() a stringify()

  • AJAX

    • Čo to je? - zmením stránku bez refreshu

    • Aké typy requestov môžeme robiť? - GET, POST

    • Objekt XMLHttpRequest

    • Na čo musíme počkať? - state

    • HTTP Status kódy

      • Dobré - 20x

      • Presmerovania - 30x

      • Zlé - 40x, 50x

    • Reagujeme, keď prídu údaje

    • Reagujeme, keď nastane chyba

    • Úloha - spravíme si menovú kalkulačku, údaje stiahneme AJAXom z NBS

  • DOM manipulácia

    • Vytváranie elementov - createElement()

    • Vkladanie do stránky - appendChild()

    • Vyberanie a náhrada - removeChild(), replaceChild()

    • Úloha - spravme si vlastný datePicker

  • Knižnice na uľahčenie programovania

    • Nevymyslame znova koleso

    • jQuery, lodash

Výstupné vedomosti po kurze / školení:

Naši lektori tohoto kurzu - zistite, kto Vás bude učiť

Ing. Martin Klaučo, PhD.
Ing. Martin Klaučo, PhD.
Hodnotenie lektora 98,03% spokojnosť

Martin je lektor s maximálnym nasadením, je trpezlivý s bohatými prezentačnými skúsenosťami. Venuje programovaniu webov v PHP a zároveň sa špecializuje ma Office, najviac sa však venuje Excelu a analýzam dát v Exceli. V praxi sa okrem programovania intenzívne venuje vyučovaniu na STU, kde sa sústreďuje na výučbu technických predmetov.
Mgr. Michal Dobšovič
Mgr. Michal Dobšovič
Hodnotenie lektora 97,81% spokojnosť

Michal je našim lektorom už od vzniku spoločnosti. Venuje sa administrácii operačných systémov Windows Server a Linux, administrácii serverových služieb, najmä SQL Server a Exchange Server a implementáciou cloudových služieb Azure a Office 365. Michal je držiteľom v súčasnosti najvyššej úrovne certifikácie od spoločnosti Microsoft: MCSE – Microsoft Certified Solutions Expert v oblastiach Productivity (Office 365 a Exchange Server) a Core Infrastructure (Windows Server) a je aj držiteľom prestížneho titulu Microsoft Certified Trainer už od roku 2008. Okrem toho pôsobí ako konzultant a externý správca serverov pre rôzne, aj nadnárodné spoločnosti. V našej spoločnosti ho môžete stretnúť na kurzoch Windows Server, SQL Server, Microsoft Exchange, PowerShell a na kurzoch počítačových sietí. Vo voľnom čase sa venuje vývoju webových aplikácií na platforme PHP, pričom sa zameriava najmä na objektové programovanie.
Mgr. Radoslav Lovecký
Mgr. Radoslav Lovecký
Hodnotenie lektora 95,82% spokojnosť

Rado je dlhoročným lektorom so zameraním najmä na databázy, programovanie a spracovanie údajov. Je držiteľom certifikátov Oracle Database SQL Certified Expert (OCE), Oracle Advanced PL/SQL Developer Certified Professional (OCP) a Oracle Database 11g Administrator Certified Associate (OCA). Prednáša tiež vyššiu úroveň Excelu ako aj ostatné programy balíka Microsoft Office.
Ondrej Krumlovský
Ondrej Krumlovský
Hodnotenie lektora 97,69% spokojnosť

Ondrej je frontendový programátor s bohatou praxou. Spolupracoval aj na významných medzinárodných projektoch, kde získal cenné skúsenosti. Jeho vášňou sú digitálne médiá a grafika, ktorej sa tiež profesionálne venuje.
Peter Hecht
Peter Hecht
Hodnotenie lektora 98,32% spokojnosť

Peťo je lektorom od vzniku spoločnosti. Jeho hlavným zameraním je programovanie web stránok, grafika a internetový marketing. Má na svedomí vzhľad našich web stránok, je zároveň marketingovým riaditeľom spoločnosti. Okrem toho, že navrhuje, programuje a tvorí pre IT Learning, konzultuje témy ohľadom online marketingu aj pre iné spoločnosti. Nebojí sa na kurzoch podeliť o svoje praktické skúsenosti a know-how.
Vladislav Ladický
Vladislav Ladický
Hodnotenie lektora 97,36% spokojnosť

Vlado je špecialista na programovanie a počítače v globále. Je to veľmi vzdelaný odborník asi v každej počítačovej oblasti. Vie programovať v množstve jazykov, rozumie počítačovým sieťam a linuxovým OS. Jeho najväčšia špecializácia je moderný web design a jazyky HTML, CSS, JavaScript, PHP, jQuery, Node JS a iné moderné webové technológie.
Peter Bačinský
Peter Bačinský
Hodnotenie lektora 97,50% spokojnosť

Peter je profesionálny programátor v PHP. Spolupracoval na viacerých medzinárodných projektoch. Taktiež sa podieľa na vývoji open-source PHP knižníc. Nie je mu cudzie ani front-end kódovanie.
Ing. Ľudovít Mydla
Ing. Ľudovít Mydla
Hodnotenie lektora 98,80% spokojnosť

Ľudo je programátor s niekoľkoročnou praxou v rôznych oblastiach informatiky. Najviac ho ale baví robiť webstránky, čo aj prednáša na kurzoch.

Posledné komentáre účastníkov, ktorí už absolvovali tento kurz

Balík webdesignér a programátor web stránok špecialista - frontend developer a backend programátor a vyvojár od roku 2008 u nás absolvovalo už približne 165 účastníkov. Hodnotenia a reakcie sa zobrazujú iba z vyplnených hodnotení od roku 2014.
zobrazených komentárov: 50 z celkového počtu 422 priemerné hodnotenie: 98,80%
Petra Č.
16.05.2019

hodnotenie lektora:
95%
Vladislav Ladický
lektor kurzu Vladislav Ladický
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Kurz dal účastníkom to, čo sľuboval. Nejaké poznatky z tejto témy som už mala, preto som nových nezískala tak veľa, no zapadli mi nejaké veci, ktorým som doteraz úplne najviac nerozumela. Náš lektor mal s účastníkmi neuveriteľnú trpezlivosť, vedel na otázky odpovedať tak, aby téme porozumel aj úplný začiatočník.
Pavol H.
16.05.2019

hodnotenie lektora:
100%
Vladislav Ladický
lektor kurzu Vladislav Ladický
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Vsetko super, prihlasujem sa na pokracovanie Osobny pristup, profesionalita
Marek R.
13.05.2019

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok II. - pokročilé HTML, CSS a moderný webdesign
Určite by som ho chcel na nasledujúcom kurze... som nadmieru spokojný
Čavajda, P.
24.04.2019

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Árpád M.
18.04.2019

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Adam O.
18.04.2019

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Robert R.
15.04.2019

hodnotenie lektora:
100%
Vladislav Ladický
lektor kurzu Vladislav Ladický
lektor kurzu
Adam O.
12.04.2019

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok II. - pokročilé HTML, CSS a moderný webdesign
Prebiehal vynikajucim tempom a dodal nove vedomosti a pohlad na web design. Velmi prijemny a ochotny dokazal nam pomoc ak sme sa zasekli a vysvetlit ak sme nevedeli. Mali sme vsetko co bolo treba, ucebna bola vybavena a cista takze sa dobre ucilo a obcerstvenie bolo ako ceresnicka na torte.
Eva B.
01.04.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Peter P.
01.04.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Diana T.
29.03.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Miroslava H.
29.03.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Prvý deň sa mi zdalo, že by sme mohli zvoliť aj rýchlejšie tempo. No koncom druhého dňa a najmä tretí sa už prejavil objem nových informácií a tempo sa ukázalo v podstate ako primerané. Prednášajúci je skvelý. Ochotný, s nadšením pre vec Ochotný prednášajúci a s nadšením pre vec s príjemným prístupom. V prípade 3-dňového kurzu tá istá maličká sladkosť naozaj omrzí. Podľa opisu školení a vybavenosti som očakávala aj nejaké ovocie alebo nejakú obmenu dobošky.
Ladislav C.
29.03.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Výborný lektor. Vysvetľoval veľmi zrozumiteľne a jednoducho na pochopenie. Zaslúži si max.hviezdičiek. Výborný !!!!
Marek R.
04.03.2019

hodnotenie lektora:
95%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Super kurz.. naučil som sa základy a určite budem pokračovať v ďalších kurzoch. Som spokojný. Len by som prijal viac času na zapísanie poznámok.
Ján K.
21.02.2019

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Martin Š.
21.02.2019

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Filip F.
15.02.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Skvelý kurz ako úvod do programovania. Priebeh je príjemný, žiadne naháňačky, ak máte problému aj niečo počas kurzu vybaviť, nie je problém. Cítil som sa veľmi prijemne a naučil som sa presne to, čo som očakával od úvodu. Odporúčam. Veľmi príjemný lektor, ktorý má vedomosti vo vyučovanej téme a ochotne poradí alebo sa zamyslí nad riešením aj nad rámec výučby. Prístup profesionálne-osobný, takže sa nehanbíte niečo opýtať alebo ozvať, keď máte problém. Ďakujem
Patrik G.
14.02.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Marian K.
13.02.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Max spokojnosť, školitel perfektne vysvetloval a naučil som sa veľa nového. Posunul som sa dopredu a otvorilo to ovela väčší záujem. Určite zvážim aj ďalšie školenia. Perfektne vysvetloval, max spokojnosť. Naučil ma veľa nového a už sa teším na ďalšie školenie. všetko bolo super, nič mi nechýbalo, či vadilo.
Valúch, B.
13.02.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Výborný kurz. Lektor skvelo vysvetluje, veľmi sympatický človek. Teším sa na ďaľší kurz :-) Ľudo veľmi dobre vysvetluje, ide skvelým tempom a je veľmi ochotný a nápomocný. Odviedol skvelú prácu, tento kurz mi dal veľa a ďalší kurz určite budem hľadat s ním. Káva zadarmo je skvelá. Ešte by som ponúkol snacky ako čerstvé ovocie napríklad a už by som ani neodišiel.
Robert R.
22.01.2019

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Ludmila Ď.
11.01.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Dorota R.
10.01.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Kurz bol skutočne náučný, zároveň zábavný, príjemný dokonca oddychový Ľudo bol veľmi príjemný, ochotný, nápomocný Na školení IT learningu som bola prvýkrát, hodnotím ho ako veľmi náučný kurz.
Lucia B.
10.01.2019

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Jaroslav V.
18.12.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Štefan Ď.
12.12.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Štefan Ď.
12.12.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Michal B.
11.12.2018

hodnotenie lektora:
95%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Matúš R.
03.12.2018

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Daniela M.
03.12.2018

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Vladimír B.
03.12.2018

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok II. - pokročilé HTML, CSS a moderný webdesign
Kurz mi dal všetko, čo som očakával. Vie zaujať a zrozumiteľne vysvetliť nejasnosti Uvedený kurz bol výborný, možno by som zvážil túto tému natiahnuť na 3 dni.
Ľudmila B.
30.11.2018

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Jaroslav J.
30.11.2018

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Jaroslav V.
14.11.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok II. - pokročilé HTML, CSS a moderný webdesign
Som naozaj veľmi spokojný s týmto kurzom, lektor sa snažil venovať všetkým účastníkom kurzu, správal sa veľmi profesionálne a veľa nás naučil, Vďaka.
Zoltan Z.
07.11.2018

hodnotenie lektora:
90%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Monika L.
31.10.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Daniel H.
24.10.2018

hodnotenie lektora:
85%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Tatiana P.
22.10.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Absolvoval/a: MySQL a SQL jazyk I. - inštalácia, správa, úvod do databáz a SQL programovanie
Velmi prakticke a prinosne skolenie, lektor pokryl nevyhnutne zaklady pre pracu s SQL Skuseny lektor, je vidiet, ze sa danej teme venuje, sharoval prakticke priklady. -
Lukáš Z.
21.10.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Robert R.
19.10.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Renáta Č.
18.10.2018

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Kurz bol zaujímavý a dosť rýchly. Napriek tomu, koľko veľa informácií nám lektor povedal, sme si všetko stihli v kľude vyskúšať. Profesionálny lektor a výborný základ do programovania.
Jozef Ch.
16.10.2018

hodnotenie lektora:
90%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Vladimír B.
05.10.2018

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
Veľmi dobre vedený kurz obsahovo aj lektorsky. Výborné znalosti a vedenie kurzu.
Miroslava M.
05.10.2018

hodnotenie lektora:
90%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Lukáš Z.
04.10.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Vincent T.
25.09.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Lukáš Z.
08.09.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Michal B.
06.09.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu
Absolvoval/a: MySQL a SQL II. - pokročilé SQL, relačné databázy a Workbench
Lektor všetko potrebné vysvetlil jasne a zrozumiteľne.
Marková-Krishnan N.
06.09.2018

hodnotenie lektora:
100%
Ing. Ľudovít Mydla
lektor kurzu Ing. Ľudovít Mydla
lektor kurzu
Absolvoval/a: Tvorba, programovanie webstránok I. - základy HTML a CSS, úvod do JavaScript a PHP
na primeranej urovni, skvely pristup lektora, vsetko premyslene, nazorne vysvetlene a uplatnene prakticky,a za dobru cenu.
Erik N.
03.09.2018

hodnotenie lektora:
100%
Peter Bačinský
lektor kurzu Peter Bačinský
lektor kurzu


U nás si nekupujete iba kurz,
ponúkame Vám komplexné vzdelávanie

Ak nám na niečom naozaj maximálne záleží, tak je to Vaša spokojnosť a tej sa sanžíme všetko prispôsobiť. Nechceme Vám ponúknuť iba kurz, na ktorý prídete a odídete, ale už 9 rokov ponúkame komplexné a garantované vzdelávanie.
V cene tohto kurzu máte nasledovné výhody:
garancia spokojnosti, ak nebudete spokojný, vrátime Vám peniaze
tento kurz môžete zadarmo opakovať po absolvovaní
v cene kurzu máte materiály a písacie potreby
špičkové, moderné učebne a kvalifikovaní lektori z praxe
bohaté občerstvenie, kvalitná káva, čaje, voda a rôzne nápoje


Máte otázky, alebo sa chcete prihlásiť?

Získajte ďalšie informácie ohľadom počítačového kurzu Balík webdesignér a programátor web stránok špecialista - frontend developer a backend programátor a vyvojár a zavolajte nám, alebo nám napíšte nám správu cez kontaktný formulár.

Sme tu pre Vás od 8:00 do 20:00
poradenstvo, objednávky a informácie: 02/4920 3080
e-mailový kontakt: info@itlearning.sk


Zaujal Vás tento počítačový kurz? Chcete sa prihlásiť na kurz a potrebujete pomôcť? Chcete sa poradiť pred nástupom na kurz s lektorom? Radi Vám zodpovieme Vaše otázky ohľadom kurzu Balík webdesignér a programátor web stránok špecialista - frontend developer a backend programátor a vyvojár, prihlásime Vás na kurz, alebo Vám poradíme vybrať si vhodné metodické riešenie pre Vás alebo Vašu firmu.