Oktató
|
A NetAcademia vezető fejlesztési oktatója |
HTML5 programozás
avagy a HTML5 nyelv rejtelmei, nem középiskolás fokon
A HTML5 egy világszabvány. Aki HTML5-ben ír programot, egyszerre ír Windows 8-ra, Androidra, iPhone-ra, és mindenre, amiben HTML5-kompatibilis böngésző van. Ezen a tanfolyamon megtudhatjuk, hogy vajon a HTML5 valóban egy új programozási rendszer, és nem csak egy nagy "semmi", amit <tagek> közé írnak. Nem véletlenül választották Redmondban a Windows 8 legelterjedtebb programozási felületének a HTML5-öt.
Lesz itt szálkezelés, drag'n'drop, navigációs adatok kezelése, grafika, és minden, amit eddig csak a "komoly" rendszerek tudtak. Ez pedig jó alapot teremt arra, hogy komolyabb, világraszóló alkalmazásokat fejlesszünk.
********************************************
Bónusz happening a képzés mellé :)
A képzést elvégzők közül a legjobban teljesítő résztvevőket a tanfolyam után a Microsoft és az IT Factory csapata közösen meghívja egy exklúzív eseményre, ahol amellett, hogy meg lehet majd ismerni a Windows 8 legújabb verzióját és ki lehet próbálni több HTML5-öt támogató új eszközt is, lehetőség lesz egy kis szórakozásra is (paintball, gokart)!
********************************************
Kinek ajánljuk?
Ezt a tanfolyamot azoknak ajánljuk, akik szeretnék megismerkedni a HTML5 új képességeivel, vagy programozói szabadságra vágynak, mert az szeretnék, ha az alkalmazásuk mindenféle kütyün futna.
Szükséges előismeretek
A HTML-szintaxis ismerete szükséges. Akinek ez nincs meg, a tanfolyam előtt nézze meg néhány weboldal forráskódját, hogy tisztában legyen vele, mik azok a HTML tagek. Emellett nem árt, ha a jelentkező tudja, mi az a ciklus, elágazás, változó, vagy írt már programot bármilyen nyelven bármikor a múltban.
Képzésen tanultak használhatósága a való viágban
A tanfolyam végeztével a hallgatók képesek lesznek interaktív webes alkalmazások elkészítésére, telefonon futó progik barkácsolására, világmegváltó ötletek kivitelezésére.
Technikai tudnivalók online-osok részére
A HTML5-tanfolyamhoz tetszőleges HTML-szerkesztőprogram használható. Az oktató Visual Studiót fog használni, így az előadások követéséhez ez a melegen ajánlott eszköz. A Visual Studió természetesen csak Windows operációs rendszeren fut, és kell neki vagy 4 GB memória.
A HTML-szintaxis ismerete szükséges.
A tanfolyam végeztével a hallgatók képesek lesznek interaktív webes alkalmazások elkészítésére, telefonon futó programok írására.
Magánszemélyek részére: bruttó 69 000 Ft
Cégek, intézmények részére: 69 000 Ft + áfa
Ha ketten jelentkeztek, mindketten kaptok 10% ikerkedvezményt.
Részletes tematika és videók
Bemelegítésként végigszaladunk egy HTML-dokumentum felépítésén. Megnézzük, mik azok a HTML-elemek, és valójában mit jelentenek. Bár nem fogunk minden egyes elemet megrágni - mivel szinte mindenki látott már HTML-t - azért a közös indulási pont kijelöléséhez fontos ez a lépés. És hogy el ne felejtsük: az 5-ös HTML saját elemei ill. a régi elemek átértelmezése sok embernek újdonság lesz.
Egy valamire való webalkalmazás kommunikál a felhasználóval. Másként szólva adatokat szerez tőle. Ennek eszköze a form és a form belsejében használható adatbeviteli vezérlők. Megnézzük hogy működik, milyen probémák merülhetnek fel és azokat hogyan oldhatjuk meg. Így aztán fogunk vízjelezni, adatot ellenőrizni (magyarul: validálás) és megküzdünk pár böngésző inkompatibilitási problémával.
Ceruzával egyszerű rajzolni. Photoshoppal is. Na de JavaScripttel? Ennek is megvan a maga bája. Sőt a haszna is. A dinamikusan, helyzethez illően megrajzolt kép tudja tükrözni az aktuális állapotot vagy akár egy egész játékprogramnak is helyet adhat. Megszínezzük, összemaszatoljuk a vásznat. Képeket manupilálunk, vagy épp a felhasználói felületet egészítjük ki színes apróságokkal. Később a videóknál még visszatérünk a vászonra festett mozgóképpre is.
A vászonra rajzolt dolgok fix méretű pixeles ábrák. Egy másik API-val megnézzük, hogy a JavaScript mellőzésével HTML-szerűen is alkothatunk képeket. Ezek ún. vektoros képek, melyek minőségromlás nélkül tudnak igazodni a kicsi és a hatalmas monitorokhoz egyaránt. Emelett a letöltendő adatmennyiségük nagyságrendekkel kevesebben, mint a pixeles képeké. A rajtuk, bennük megjelenített szövegek kiválaszthatók, sőt keresőmotorok által értelmezhetők.
Hát hajoljunk meg a tömegek igényei előtt, legyen videó a HTML-ben is. Egyszerűen írjuk be a HTML-be, hogy video. Hát ennyire azért nem rózsaszín a helyzet. Megnézzük, milyen formátumokat lehet illetve érdemes használni. Megtanuljuk vezérelni a lejátszást az audio és video elemekhez tartozó API segítségével.
A drag drop-ot nem kell magyarázni senkinek. A megvalósítása azonban határozott támogatás nélkül sokkal bonyolultabb, mint azt elsőre bárki is gondolná. Szerencsére már a HTML API-ja is támogatást nyújt. Megnézzük, hogyan tudjuk ezt kihasználni.
XmlHttpRequest Level 2 és postMessage API
Megismerkedünk az AJAX alapját is képező XmlHttpRequest objektummal, annak is a felokosított változatával. Így lehtőségünk lesz hazaszólni a szerverünknek ha kifogytunk az adatokból, vagy épp a felgyülemlett terhet szeretnénk nála lepakolni. Gyakran lehet szükség olyan adatcserére, ami nem az otthoni szerverünkkel történik, esetleg más megnyitott weblapokkal szeretnénk összedolgozni. Eddig ez a szoros biztonság miatt szinte lehetetlen volt (legalábbis a HTML keretein belül maradva). Most azonban a postMessage API segíteni fog.
A weblapok protokollja a HTTP. Ez sajnos történelmi alapon egy kapcsolatmentes, szenilis csatorna. Kérted, kaptad, felejtsünk stílusban. A közelmúltban gyakran keserítette meg életünket. De most itt a TCP alapú, szerű új kommunikációs csatorna, a Web Sockets. Kétirányú állandó csatorna kiépítésével emlékezni képes, emiatt (nagyon) kevés adattal is értelmesen kommunikáló, gyorsan reagáló megoldáshoz juthatunk. Bár ez a technológia rengeteg lehetőséget hordoz magában, a leggyakoribb probléma, amit mi is körbe fogunk járni, a chat.
Ma már az emberek a zsebükben hurcolják magukkal a webböngészőt. Ideális lehetőség, hogy helyzetérzékeny funkciókkal vadítsuk meg a webalkalmazásunkat. Jó, de hol vagyunk?
GPS? Akár, de nem feltétlenül. Ahogy az emberek is rengeteg egymástól független adat alapján meg tudják határozni saját helyüket (utcatábla, csillagok állása vagy hol is ittam az utolsó pohárral) úgy a hálózaton lógó számítógépek is több forrásból táplálkozhatnak. Ott van mindjárt az IP-cím. Amivel akár városszintig is elmehetünk. Wifi hotspotok, GSM-adótornyok vagy akár GPS-vevő. Ezekre mindre tud támaszkodni a Geolocation API, meynek segítségével helyzetérzékeny szolgáltatáskat adhatunk, vehetünk igénybe vagy épp csak kirajzolhatjuk, hogy a böngészőnk szerint holl vagyunk a térképen.
A webalkalmazás személyre, szituációra szabott működéséhez gyakran van szükségünk adatokra az előző lapon vagy lapokon tett ténykedésekről. Esetleg tegnapról. A Cookie segített ebben eddig is. Ennél azonban sokkal robosztusabb, hatékonyabb megoldás a Storage API. Annyira, hogy akár SQL-szerű működést is meg lehet vele valósítani a böngészőben. Ennek az API-nak nézzük meg az alapjait és próbáljuk ki, mi mindent bízhatunk a felhasználó böngészőjére megőrzés céljából.
Ha már tudunk a böngészőben átmenetileg adatokat tárolni, a HTML-t dinamikusan változtatgatni, akkor miért is zavarna minket, hogy nem adatott meg az örök életű folyamatos Internetelérés? Megnézzük azt a pár apró dolgot, amivel koordinálni tudjuk azokat az eseteket, amikor valaki kihúzza az alkalmazásunk alól a talajt (meg az utp madzagot a falból). Ha a Windows 8-ra írunk HTML5-progit, bátran számíthatunk arra, hogy a futtató masina nem lát ki a webre, mert például külföldön van a tablet, kirándul, és nincs ingyenes WiFi a közelben.
A cím magáért beszél. Most a processzormagok szaporodásának időszaka van. Hogy ezt alaposan ki tudjuk használni, értenünk kell a párhuzamosan, azaz egyidőben egyszerre végrehajtható funkciók írásához. Ezzel nemcsak a kellemetlen lefagyásérzést tudjuk elkerülni bizonyos időigényes feladatoknál hanem konkrétan fel is tudjuk gyorsítani azok működését. A szálkezelés komoly témakör, de itt hozzásimulva a JavaScript egyszerűségéhez, megfelelően visszafogott API-val hatalmas eredményeket produkálhatunk.
Az a hír járja, hogy a mobileszközök átveszik a hatalmat a hagyományos számítógépektől. Nos, mióta léteznek mobileszközök, mindig is külön történet volt azok webalapú támogatása. A kezdetek óta sokat egyszerűsödött a helyzet, hiszen például egy tabletet a mi szempontunkból nem is kell feltétlen külön kategóriaként kezelni. Bár vannak sajátosságai, mint a különféle beépített érzékelők, vagy az egér hiánya. A telefonoknál akadnak további sajátosságok, például a telefonálási képesség! Bár erről egyre gyakrabban megfeledkezünk. No meg az apró képernyő. Ezeknek a sajátosságoknak a kezeléséről szól ez a nap.
A kapukon döngető Windows 8 egyik fő fejlesztői platformja is a HTML5. Betekintést nyerhetünk, milyen az, amikor nem weblapot fejlesztünk HTML-lel és JavaScripttel, hanem egy webtől elrugaszkodott, igazi Windowsos alkalmazást alkotunk meg.