SlideShare ist ein Scribd-Unternehmen logo
1 von 42
TNPW2 2013/2014 
Mgr. Lukáš Vacek 
lukas.vacek@uhk.cz 
Aktuální trendy ve vývoji webových aplikací 
a něco navíc
„Zajímám se o budoucnost, protože v ní hodlám 
strávit zbytek svého života.“ – Ch. F. Kettering 
2
Agenda 
• Současný stav, RIA 
• Komunikace webových aplikací 
• Uživatelské rozhraní 
• AJAX 
• Flash, Flex, Silverlight a další 
• Pracovní nástroje 
• Co je Web 2.0? Gartner: hlavní trendy? 
• Odkazy na internetu 
3
Současný stav
Internet 5 
• Poskytovatel informací >> platforma pro poskytování služeb uživatelům 
• Exponenciálně roste počet uživatelů 
• Exponenciálně roste nabídka informací a služeb 
• Exponenciálně roste datový traffic (objem přenášených dat) 
• Exponenciálně roste množství uložených dat 
• Podle IBM každý den vytváříme 2,5 trilionu bytů dat, 
90 % bylo vytvořeno za poslední 2 roky (IDC Enterprise mobility konf. 2014) 
• Roste počet druhů zařízení, která lze pro přístup k Internetu využívat 
• PC, mobily, tablety, smart TV, herní konzole, el. čtečky, mult. přehrávače… 
• 24/7 – odkudkoliv, kdykoliv – tzv. Internet v kapse (mobilita zařízení) 
• S tím souvisí podpora nových technologií a webových standardů…
Dnešní ICT trendy 6 
• Existují různé pohledy a předpovědi  
• Podle fy Gartner 
• Mobilní aplikace a rozhraní pro mobilní zařízení (hlasové ovládání, gesta…) 
• Sociální sítě (vč. businessu, soc. analytik a soc. kontextu) 
• Big data (analýza, vizualizace) 
• Cloud computing 
• Další zajímavé trendy (některé se překrývají) 
• E-commerce 
• Internet of things (různá zařízení, Intel: cca 20 mld. v roce 2020!) 
• Počítačová bezpečnost 
• Snižování energetické náročnosti (datová centra i klientská zařízení) 
• In-memory computing 
• 3D (tisk, vizualizace)
Dnešní webové technologie 7 
• Neustálé zdokonalování stávajících technologií pro web, které se ukázaly 
jako použitelné (životaschopné): 
• rozšiřování funkcionality, kterou poskytují vývojářům, 
• zjednodušení (a zrychlení) jednotlivých procesů vývoje (analýza, návrh, 
implementace, testování, deployment), 
• implementace moderních trendů (MVC, ORM, SOA, bezpečnost, přístupnost 
pro různá zařízení a platformy apod.), 
• zvyšování výkonu vyvíjených aplikací. 
• Osvědčené technologie: JavaScript, Java, ASP.NET, Flash, Python, PHP... 
• „Novější“ technologie: Ruby (on Rails), Adobe AIR, Flex, Silverlight apod. 
• Na straně klienta je současným leaderem HTML5 + CSS3 + JavaScript 
• Pořád je co zlepšovat!
Aktuální problémy webových aplikací 8 
• Vývoj webových aplikací = (až moc) velký výběr technologických platforem 
• Problémem většiny dnešních webových aplikací jsou hlavně… 
• Omezené možnosti jejich uživatelského rozhraní (User Interface) 
• Validace formulářových dat na straně klienta (v reálném čase) 
• Beze-stavová komunikace při použití protokolu HTTP(S) 
• Práce v offline režimu 
• Obecně podpora (implementace) standardů v prohlížečích 
• Většina webových aplikací je stále založena na značkovacím jazyku HTML (XHTML) 
– ten původně nebyl navržen pro vývoj aplikací >> má celou řadu omezení (množství 
přenášených dat, ergonomie ovládání apod.) 
• Některá omezení lze obejít (např. JavaScript/AJAX, Flash, Adobe AIR, ViewState 
a PostBack v ASP.NET apod.), ale není to ono (problematická účinnost, někdy složitost 
řešení, jen některé platformy) 
• Takže, co s tím?
Řešení? 9 
• Postupně vytvořit nové nebo rozšířit stávající technologie tak, aby poskytovaly 
vývojářům a uživatelům: 
• komplexní grafické rozhraní (MDI koncept >> 1 hlavní okno), 
• ovládání a funkce odpovídající klasickému desktopovému řešení (drag&drop, 
klávesové zkratky, kontextová nápověda, auto complete prvky apod.), 
• možnost kontroly formulářových dat u klienta v reálném čase 
• možnost práce v offline režimu na straně klienta 
• odstínění klienta (uživatele) od modelu žádost/odpověď 
• přenos jen nezbytně nutných dat (např. bez duplicit v UI) 
• a to vše pro různé druhy platforem a zařízení (např. mobilní)
RIA (Rich Internet Application) 10 
• Označení pro novou generaci aplikací, které by uvedené požadavky měly plně 
(nebo částečně) splňovat 
• RIA řeší především záležitosti na straně klienta! 
• Významnou roli bude hrát HTML5 (aspoň v nejbližší době) 
• Existuje silná spojitost s Internetem – web/(X)HTML, plug-iny prohlížečů, 
desktop, mobilní zařízení 
• Snadnost spuštění aplikace se blíží snadnosti navštívení webové stránky 
• Výhledově by RIA technologie mohly výrazně podpořit myšlenku na převedení 
většiny dnešních aplikací do online podoby (celá řada výhod >> aktuálnost, 
dostupnost, zpoplatnění jen používaných funkcí apod.) 
• http://interval.cz/clanky/rich-internet-applications-v-roce-2008/ 
• http://zdrojak.root.cz/clanky/pristupnost-ria-dynamicke-zmeny-obsahu/ 
• Není to dokonalé, ale je to krok správným směrem
Komunikace webových aplikací
Webová komunikace – beze-stavové HTTP 12 
• Nejčastěji založena na protokolu HTTP(S) 
• HTTP je beze-stavový protokol (request >> response) 
• Základní vlastnost = snadná implementace 
• Mezi jednotlivými requesty se neudržuje kontext 
• U většiny aplikací to nemusí vadit 
• Beze-stavové HTTP můžete obejít přes 
• Cookie (nejstarší, 4KB dat, odesílá se s každým(!) http požadavkem, lze zakázat) 
• Session (posílá se ID relace, data uložena na serveru – in proc, state server, sql) 
• Využitím local storage (viz dále) 
• Viewstate a Control State (v ASP.NET) – hashovaná data v políčku formuláře 
• http://www.youtube.com/watch?v=IdJD2FSRQWU video z přednášky
Další možnosti komunikace 13 
• Moderní webové aplikace využívají pro komunikace mezi klientem a webovým 
serverem i další standardy/protokoly, než jen obyčejné HTTP(S) 
• REST – orientován datově (ROA), běžné HTTP příkazy (GET, POST, PUT a DELETE) pro 
CRUD operace 
• Webové služby – protokol SOAP pro vzdálené volání procedur, formát XML 
• SOA – univerzální, i mimo web 
• Projekt SPDY – vylepšení protokolu HTTP, rychlejší načtení stránky 
• Různé formáty dat přicházejících na klienta… HTML, XML, JSON apod., které lze 
(programově) dále zpracovat 
• Iniciátorem komunikace nemusí být vždy klient (obvyklý scénář) – možnost 
vytvoření permanentního spojení (web socket, realtime app – SignalR apod.) 
• Nezapomeňte na bezpečnost komunikace – SSL, autentizaci klientů apod.
Uživatelské rozhraní
Uživatelské rozhraní (UI, frontend…) 15 
• Výrazným trendem dneška je JEDNODUCHOST 
• Je kladen důraz na 
• Přehlednost 
• Intuitivnost 
• Použitelnost 
• Důležitou roli hraje přizpůsobení UI pro různá zařízení 
• Adaptive Web Design (server) 
• Responsive Web Design (klient) 
• Nejbližší budoucnost… HTML5 + CSS3 + JavaScript
Webové formuláře 16 
• Už od počátku Internetu jsou formuláře hlavním prostředkem pro zadávání 
uživatelských vstupů do webové stránky 
• Základní množina formulářových prvků a jejich funkcí je v podstatě stále stejná 
jako na začátku, kdy se nepočítalo s Internetem jako s platformou pro aplikace 
• Původní formulářové prvky nepokrývají všechny potřeby dnešních webových 
aplikací, nejen v oblasti datových vstupů, ale i jejich případné validace (kontroly) 
• Tento nedostatek bylo třeba odstranit 
• Jsou (byly) možné dva základní přístupy k řešení problému: 
• Úplně to celé předělat (XForms) 
• Rozšířit stávající množinu prvků a jejich funkcionalitu (Web Forms >> HTML5) 
• http://interval.cz/clanky/pohled-na-webove-formulare-druhe-generace/
HTML5 (Web Forms 2.0 je součástí) 17 
• Původně konsorcium WHATWG (The Web Hypertext Application Technology 
Working Group) >> vývojáři Mozilla, Opera, Safari 
• Od roku 2007 existuje pracovní skupina W3C pro HTML5 specifikaci, v lednu 
2008 byl vydán draft 
• Rozšiřuje HTML 4.01 a XHTML 1.0 >> jednoduché na naučení 
• Zpětná kompatibilita ve starších prohlížečích 
• Zatím neúplná podpora nových prvků v prohlížečích 
• Pozor! HTML5 řeší více než jenom webové formuláře 
• http://en.wikipedia.org/wiki/Html5 
• http://www.lupa.cz/clanky/whatwg-budoucnost-webu/ 
• http://www.w3.org/TR/2008/WD-html5-diff-20080122/ 
• http://www.root.cz/serialy/html5-a-jeho-zajimave-vlastnosti/
Lokální úložiště dat – Local storage, session storage 18 
• V souvislosti se standardem HTML5 se často mluví o offline režimu aplikací 
• Lokální úložiště dat (name/value) na straně klienta, přístupné z JavaScriptu 
• Podpora v moderních prohlížečích (např. IE8+) 
• Local storage běžně neexpiruje, musíte si po sobě uklidit! 
• Session storage standardně vydrží do zavření okna prohlížeče 
• Kapacita cca 5MB na doménu, každý browser to ale počítá jinak! 
• Nepřenáší se na server, aplikační logika sama musí data serializovat! 
• http://www.lupa.cz/clanky/sql-si-razi-cestu-do-html5/ 
• http://zdrojak.root.cz/clanky/webdesigneruv-pruvodce-po-html5-webstorage/ 
• http://code.google.com/p/sessionstorage/
XForms 19 
• Za návrhem XForms stojí konsorcium W3C 
• Jeden z modulů připravovaného XHTML 2.0 
• Komplexně řeší formuláře na webu i na desktopu 
• Je poněkud složitější na naučení (i když W3C tvrdí opak ) 
• Chybí zpětná kompatibilita 
• Slepá větev! 
• http://en.wikipedia.org/wiki/Xforms 
• http://www.grafika.cz/art/webdesign/encxforms.html 
• http://html456.blogspot.com/2009/07/predseda-xhtml2-wg-rika-xhtml2-neni.html
AJAX
AJAX (Asynchronous JavaScript and XML) 21 
• Aktuálně nejrozšířenější RIA technologie 
• AJAX je programový přístup, který mezi prohlížeč a webový server přidává vrstvu 
abstrakce 
• Základem je klientské skriptování (DOM, (X)HTML a JavaScript), obvykle kombinované 
s voláním webových služeb a zpracováváním XML dat (XMLHttpRequest) 
• Používá známé a osvědčené technologie 
• Jeho nasazení (pozor, neplatí to vždy a všude!) může zlepšit použitelnost webových 
aplikací s ohledem na jejich ovládání uživatelem 
• Při nevhodném použití může generovat poměrně velkou zátěž pro webový server 
• Webové AJAX aplikace je možné vytvářet na většině hlavních vývojových platforem 
(ASP.NET, Java/JSF/ADF, PHP apod.) 
• http://cs.wikipedia.org/wiki/Asynchronous_JavaScript_and_XML
AJAX (Asynchronous JavaScript and XML) 22 
Klasická webová aplikace 
Klient (webový prohlížeč) 
User Interface 
Server (webový server) 
Aplikační logika 
HTTP request 
HTML + CSS 
AJAX 
Klient (webový prohlížeč) 
User 
Interface 
AJAX 
Engine 
JavaScript 
HTML + CSS 
Server (webový server) 
Aplikační logika 
HTTP request 
XML data
Flash, Flex a spol.
Adobe Flash 24 
• V současnosti dominuje v oblasti interaktivní grafiky na Internetu 
• Multiplatformní technologie zaměřená na práci s grafikou, vektorovými 
animacemi nebo video streamingem (např. Youtube) 
• Historie – FutureWave Software (kolem roku 1996), Macromedia (do 2005) 
• Pro klienta je k dispozici Flash Player (aktuální verze 12.x), jako plug-in je 
nainstalován na většině počítačů s webovým prohlížečem (Adobe uvádí až 99 %) 
• Používá programovací jazyk ActionScript (založený na ECMAScript), pracuje 
s textem, grafikou i s databázemi 
• Jsou určité problémy s indexování obsahu ve vyhledávačích 
• Ověřená technologie, s velkou vývojářskou komunitou! 
• Řada vývojových nástrojů 
• Problémy: bezpečnost, stabilita, výkon na slabších zařízeních! 
• http://www.adobe.com/products/flash/ 
• http://www.flash.cz/portal/
Adobe Flex 25 
• Komponentový framework pro interaktivní aplikace postavené na technologii 
Flash (Flash Player v prohlížeči) a Adobe AIR (desktop) 
• Aplikace mohou integrovat např. multimédia, XML, webové služby nebo 
tzv. Flex Data Services (WS postavené na J2EE) 
• Programovací jazyk ActionScript 3, MXML pro UI 
• Základní vývojové nástroje (SDK + kompilátor) jsou zdarma, Flex Builder 
za peníze; je možná pokročilá integrace (Ant, Maven) 
• Deployment = zkopírovat soubory SWF (+ HTML wrappery) 
• Technologie Flash/Flex umožňují odklon UI od klasické podoby webových 
stránek, není to náhrada HTML a spol. 
• Velké plány Adobe, realita je skromnější, aktuální verze Flex 4.11.xx (10/2013) 
• Open source licence frameworku! 
• http://www.adobe.com/products/flex/ 
• http://www.grafika.cz/art/webdesign/flashflex.html 
• http://interval.cz/clanky/adobe-flex-co-je-a-co-neni/
Adobe Air 26 
• Adobe AIR (Adobe Integrated Runtime, dříve Apollo) 
• První stabilní verze 1.0 (únor 2008) – aktuální verze 4.xx (12/2013) 
• Multiplatformní runtime propojující desktopové a webové aplikace 
• Umožňuje kombinovat např. HTML/JavaScript/AJAX, Flash, Flex 
• Rozšiřuje funkcionalitu a možnosti webových aplikací (např. drag&drop, 
práce s diskem, nativní okna, offline práce s daty, synchronizace apod.) 
• Má plný přístup k lokálním zdrojům! Pod účtem, pod kterým uživatel pracuje 
• Aplikace lze spouštět nezávisle na prohlížeči, na různých zařízeních 
• http://www.adobe.com/cz/products/air/ 
• http://labs.adobe.com/technologies/air/ 
• http://jilm.blog.lupa.cz/0704/adobe-je-cerny-kun-internetovych-aplikaci 
• http://www.flash.cz/portal/clanek.aspx?id=594 
• http://www.dsl.sk/article.php?article=5359
Microsoft Silverlight 27 
• První verze v září 2007, aktuální verze 5.1.xx (10/2013) 
• Jde o runtime pro spouštění interaktivních aplikací v prostředí webového 
prohlížeče nebo desktopu, u klienta je třeba instalovat odpovídající plug-in 
• Základem je WPF >> grafický subsystém .NET Frameworku 3.0 >> umožňuje 
popisovat textový, vektorový, interaktivní a multimediální obsah pomocí XAML 
• Podporuje přehrávání audia a videa ve formátech WMV, WMA a MP3 
• Programovat lze v JavaScriptu, od verze 2.0 také v C#, VB.NET apod. 
• Multiplatformní podpora u klienta pro Windows, Mac, Linux (Moonlight) 
• Na klientovi běží v tzv. sandboxu, nemá plný přístup k disku 
• Jako vývojové prostředí se používá Visual Studio 
• Někdy je označována jako tzv. „Flash killer“ technologie  
• Jako cross-platform technologii bude Microsoft spíše podporovat HTML5! 
• http://www.microsoft.com/silverlight/ 
• http://en.wikipedia.org/wiki/Moonlight_(runtime) 
• http://is.gd/hUi05 (článek na JustIT - podpora Silverlight vs. HTML5)
XUL (XML User Interface Language, čti Zůl) 28 
• XUL je technologie založená na XML 
• Umožňuje tvorbu RIA aplikací, které mohou být spouštěny 
z Internetu (ale nemusí, např. Firefox) 
• XML v kombinaci s JavaScriptem (obsluha událostí) a CSS umožňuje vytvářet 
UI aplikací 
• XUL odděluje jednotlivé prvky UI a jejich vzhled >> snadná skinovatelnost 
• Technologii XUL zastřešuje Mozilla Foundation 
• Je platformě nezávislá, používá komponenty v nativních jazycích (C/C++) 
• Na straně klienta je to trochu pomalé… 
• http://www.mozilla.org/projects/xul/ 
• http://en.wikipedia.org/wiki/XUL 
• http://www.kosek.cz/clanky/xul/index.html
Pracovní nástroje
Pracovní nástroje 30 
• Trendem jsou rostoucí požadavky na komplexnost vývojových nástrojů 
• Každý vývojář potřebuje něco jiného, záleží na jeho roli 
• Jednotlivé etapy vývoje software nejsou jednoznačně odděleny, často běží vedle sebe 
(paralelní běh analýzy a implementace při tzv. extrémním programování) 
• Jsou vyžadovány funkce a nástroje, které zefektivní jednotlivé etapy vývoje 
• Pro fázi implementace se za samozřejmé považuje např. 
• sofistikovaný editor zdrojových kódu s inteligentním doplňováním, 
• vizuální návrh UI, trend generování UI do HTML5 + JavaScript + CSS na výstupu, 
• spolupráce s CASE nástroji, synchronizace, 
• podpora verzování, týmový vývoj, úkoly/task(s), 
• podpora pro ladění aplikace, trasování, refaktorizace kódu, 
• podpora nejrůznějších šablon, práce s databází, ORM, design patterns, 
• podpora automatického testování (unit, funkční, zátěžové…), TDD, 
• tvorba instalačních balíčků, konfiguračních skriptů, deployment aplikace a další
Web 2.0? 
Gartner: 4 hlavní trendy
Web 2.0? 32 
• Web 2.0 lze chápat „Jako posun od centralizovaného zpracování služeb 
k decentralizaci.“ – Tim O’Reilly (zdroj) 
• „Web 2.0 jsou takové webové projekty, které používají technologie a principy namířené 
co nejvíce k uživatelům služeb, a to často tak blízko, že nechávají samotné uživatele, aby 
se sami podíleli na obsahu či tvorbě projektu.“ – Symbio 
• Jiný úhel pohledu na to, jak rozlišit jednotlivé vývojové fáze webu… „Na Web 1.0 stačilo 
připojení kolem 50 Kbit/s, na Web 2.0 linka o rychlosti 1 Mbit/s a na Web 3.0 to bude 
přibližně 10 Mbit/s.“ – Reed Hastings (zdroj Symbio) 
• http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html 
• http://www.symbio.cz/clanky/web-2-0-3-0-4-0.html 
• http://en.wikipedia.org/wiki/Web_2.0
Co znamená Web 2.0 pro návrh (design) aplikace? 33 
• Web jako platforma – klasický design ustupuje do pozadí, a do popředí 
se dostávají programové nadstavby (API), webové služby, XML, RSS apod. 
= změny v programování a v přístupu k datům 
• Mnohem intenzivnější spolupráce mezi servery při výměně dat 
• Tzv. Mashup aplikace  
• Změny v navigaci, organizaci informací a v přístupu k nim >> uživatelé rozhodují sami 
(agregátory obsahu) 
• Mixování obsahu >> obsah je důležitější než jeho poskytovatel! 
• Komunity přidávají a sdílejí vlastní data >> štítky, recenze apod. 
• Často hovoříme v této souvislosti o pojmech sociální sítě, Cloud computing apod. 
• http://www.symbio.cz/clanky/komunity-v-podani-strycka-googla.html 
• http://www.lupa.cz/clanky/zmeni-google-sidewiki-internet/ 
• http://zdrojak.root.cz/clanky/rest-architektura-pro-webove-api/ 
• „The Age of APIs“ >> rozvoj businessu + prostředek integrace
Gartner: 4 hlavní trendy – Sociální sítě 34 
• Webové aplikace označované jako Web 2.0 se prosazují stále více 
• Nesmírně důležitá je komunita uživatelů, která se na takovouto aplikaci „nabalí“ 
• Potom hovoříme o tzv. sociální síti 
• Sociální sítě jsou čím dál důležitější i pro firemní komunikaci (dovnitř i ven) 
Facebook, Instagram, Pinterest, Google+, LinkedIn – komunitní weby 
Wikipedia – internetová encyklopedie 
Del.icio.us – ukládání a sdílení záložek (bookmarks) 
Flickr – sdílení fotografií na webu 
Twitter – krátké osobní zprávy do 140 znaků
Gartner: 4 hlavní trendy – Cloud computing (více přednáška) 35 
• „Termín označuje souhrnně technologie a postupy používané v datových centrech 
a firmách pro zajištění snadné škálovatelnosti aplikací dodávaných přes Internet.“ 
– Jan Kodera (http://cloud.abakowiki.cz/) 
• Cloud hosting nabízí serverový cluster s vysokým výpočetním výkonem, datovým 
úložištěm a konektivitou, který je možné si pronajímat dle potřeby 
• IaaS – Infrastruktura jako služba 
• PaaS – Platforma jako služba 
• SaaS – Software jako služba 
• Výhodou je dynamický sizing 
a platba jen za skutečně 
spotřebované prostředky 
SaaS 
PaaS 
IaaS 
http://zdrojak.root.cz/clanky/cloud-hosting-aneb-hosting-v-oblacich/ 
http://www.lupa.cz/clanky/cloudy-maji-budoucnost-a-take-problemy/ 
http://is.gd/hUmcI – možnosti dynamického škálování prostředků v MS AZURE
Gartner: 4 hlavní trendy – Mobilní aplikace (více na přednášce) 36 
• Přístup ke službám 24/7, odkudkoliv – tzv. Internet v kapse  
• Prodá se více mobilních zařízení, než stolních počítačů >> post-PC svět/éra 
• Významnou roli na straně serveru hraje cloud computing 
• Objem dat přenášených přes mobilní zařízení exponenciálně roste! 
• Mění se role telco operátorů: Hlasové služby ustupují, doplněk ICT služeb 
• Mobilní aplikace 
• Nativní aplikace 
• Mobilní webové aplikace (někteří prosazují trend Mobile first) 
• Native wraper
Gartner: 4 hlavní trendy – Big data, datová analytika 37 
• Big data (podle Gartner) = data, jejich velikost je mimo schopnosti zachycovat, spravovat 
a zpracovávat je běžně používanými softwarovými prostředky v rozumném čase 
• Big data je hype! >> Všichni o tom mluví, ale zatím málokdo to umí dobře využít  
• Při zpracování dat hraje roli SW + HW (distrib. úložiště a výpočty, HPC) 
• Problémy mohou být s objemem, strukturou nebo rychlostí zpracování 
• Často využívají tzv. NoSQL databáze >> umožňují pomocí key+hodnota relativně rychle 
(a levně) pracovat s uloženými daty (základní dotazy), pokročilejší a náročnější operace 
zajišťují pomaleji relační databáze 
• Použití big data: Sociální sítě, e-commerce, marketing, různé senzory, vědecké 
experimenty… 
• Schopnost pracovat s datovou analytikou je často rozhodujícím faktorem úspěchu 
produktu nebo služby
Top technology trends 2014 (IEEE) 38 
• Mobilní cloud – mobilní zařízení využívají výpočetní výkon v cloudu, nové služby 
• Z Internetu věcí >> Web věcí – využití mobilních zařízení a senzorů 
• Od velkých objemů dat k extrémním – jednodušší analytické nástroje 
• 3D revoluce – rychlejší a levnější 3D tisk 
• Podpora nových způsobů učení – elearning 
• Mobilní sítě nové generace – rostoucí potřeby uživatelů 
• Vyvažování identity a soukromí – bezpečnost 
• Inteligentní a propojená zdravotní péče – healthcare 
• E-government 
• Využití Cloud computingu ve vědě – nové objevy 
• http://www.computer.org/portal/web/membership/Top-10-Tech-Trends-in-2014 
• Třináct IT trendů v roce 2013 podle IEEE (Lupa.cz)
Internetové odkazy, literatura
Odkazy na internetu I. 40 
• http://cs.wikipedia.org/wiki/Asynchronous_JavaScript_and_XML (AJAX) 
• http://www.asp.net/ajax/ (Microsoft ASP.NET AJAX Extension) 
• http://en.wikipedia.org/wiki/Html5 (HTML5) 
• http://www.adobe.com/products/flash/ (Adobe Flash) 
• http://www.adobe.com/products/flex/ (Adobe Flex) 
• http://www.openlaszlo.org/ (OpenLaszlo) 
• http://www.mozilla.org/projects/xul/ (XUL) 
• http://www.microsoft.com/silverlight/ (Silverlight) 
• http://www.sun.com/software/javafx/index.jsp (JavaFX) 
• http://labs.adobe.com/technologies/air/ (Adobe Air) 
• http://en.wikipedia.org/wiki/Web_2.0 (Web 2.0) 
• http://zdrojak.root.cz/clanky/cloud-computing-jiny-pohled-na-aplikace/ 
• http://www.augi.cz/programovani/cassandra-ocima-net-programatora/ (NoSQL) 
• http://www.zive.cz/bleskovky/v-americe-vladne-internetu-netflix-v-evrope-bittorrent/sc-4-a- 
166249/default.aspx (Netflix a BitTorrent králové datového trafficu) 
• http://www.root.cz/clanky/big-data-a-jejich-zpracovani/
Odkazy na internetu II. 41 
• http://zdrojak.root.cz/clanky/jak-budeme-psat-webove-aplikace-za-tri-roky/ 
• http://zdrojak.root.cz/clanky/vyvojar-si-jen-s-programovanim-nevystaci/ 
• http://suewebik.net/webove/web20-def.html 
• http://www.lupa.cz/clanky/web-2-0-bublina-nebo-novy-smer-webu/ 
• http://www.slideshare.net/MedvidekPU/sociln-st-mn-internet-k-nepoznn 
• http://zdrojak.root.cz/clanky/jaky-software-pohani-facebook/ 
• http://www.lupa.cz/clanky/komunitni-server-a-komunitu-mate-kde/ 
• http://www.forbes.com/sites/gartnergroup/2014/10/21/gartners-top-10-strategic-technology-trends- 
for-2015/ 
• http://tech.ihned.cz/c1-63001160-internet-of-things-internet-veci-hrozby
Závěr, dotazy

Weitere ähnliche Inhalte

Was ist angesagt? (16)

TNPW2-2013-05
TNPW2-2013-05TNPW2-2013-05
TNPW2-2013-05
 
TNPW2-2016-01
TNPW2-2016-01TNPW2-2016-01
TNPW2-2016-01
 
TNPW2-2014-06
TNPW2-2014-06TNPW2-2014-06
TNPW2-2014-06
 
TNPW2-2016-06
TNPW2-2016-06TNPW2-2016-06
TNPW2-2016-06
 
TNPW2-2012-05
TNPW2-2012-05TNPW2-2012-05
TNPW2-2012-05
 
TNPW2-2012-08
TNPW2-2012-08TNPW2-2012-08
TNPW2-2012-08
 
TNPW2-2013-01
TNPW2-2013-01TNPW2-2013-01
TNPW2-2013-01
 
TNPW2-2016-07
TNPW2-2016-07TNPW2-2016-07
TNPW2-2016-07
 
TNPW2-2013-02
TNPW2-2013-02TNPW2-2013-02
TNPW2-2013-02
 
TNPW2-2013-07
TNPW2-2013-07TNPW2-2013-07
TNPW2-2013-07
 
TNPW2-2013-06
TNPW2-2013-06TNPW2-2013-06
TNPW2-2013-06
 
TNPW2-2013-04
TNPW2-2013-04TNPW2-2013-04
TNPW2-2013-04
 
TNPW2-2012-02
TNPW2-2012-02TNPW2-2012-02
TNPW2-2012-02
 
TNPW2-2011-04
TNPW2-2011-04TNPW2-2011-04
TNPW2-2011-04
 
Rich Internet Applications 2009 (Czech)
Rich Internet Applications 2009 (Czech)Rich Internet Applications 2009 (Czech)
Rich Internet Applications 2009 (Czech)
 
TNPW2-2012-07
TNPW2-2012-07TNPW2-2012-07
TNPW2-2012-07
 

Ähnlich wie TNPW2-2014-05

Čtvrtkon #71 - Marian Benčat - Angular a NativeScript
Čtvrtkon #71 - Marian Benčat - Angular a NativeScriptČtvrtkon #71 - Marian Benčat - Angular a NativeScript
Čtvrtkon #71 - Marian Benčat - Angular a NativeScriptCtvrtkoncz
 
Semináře M-Files: Konec hledání řešení pro správu firemních dat
Semináře M-Files: Konec hledání řešení pro správu firemních datSemináře M-Files: Konec hledání řešení pro správu firemních dat
Semináře M-Files: Konec hledání řešení pro správu firemních datJaroslav Prodelal
 
Moderni trendy ve_vyvoji_aplikaci
Moderni trendy ve_vyvoji_aplikaciModerni trendy ve_vyvoji_aplikaci
Moderni trendy ve_vyvoji_aplikaciRENESTEIN
 
Vývojářské Nástroje a Techniky
Vývojářské Nástroje a TechnikyVývojářské Nástroje a Techniky
Vývojářské Nástroje a TechnikyMartin Maly
 
Co sledovat a jak měřit u mobilního webu
Co sledovat a jak měřit u mobilního webuCo sledovat a jak měřit u mobilního webu
Co sledovat a jak měřit u mobilního webuAkce Dobrého webu
 
Co přináší Oracle Database 12c Release 2
Co přináší Oracle Database 12c Release 2Co přináší Oracle Database 12c Release 2
Co přináší Oracle Database 12c Release 2MarketingArrowECS_CZ
 
Confluence_v1.4_extended
Confluence_v1.4_extendedConfluence_v1.4_extended
Confluence_v1.4_extendedPetr Holodňák
 
Odborná snídaně v Profinitu 30. 5. 2017 - Firemní portály: rychle a moderně
Odborná snídaně v Profinitu 30. 5. 2017 - Firemní portály: rychle a moderněOdborná snídaně v Profinitu 30. 5. 2017 - Firemní portály: rychle a moderně
Odborná snídaně v Profinitu 30. 5. 2017 - Firemní portály: rychle a moderněProfinit
 
Moderní Server Side UI Rendering v PHP
Moderní Server Side UI Rendering v PHPModerní Server Side UI Rendering v PHP
Moderní Server Side UI Rendering v PHPMichalMajer2
 
Borek Bernard: TypeScript - příčetný jazyk pro web
Borek Bernard: TypeScript - příčetný jazyk pro webBorek Bernard: TypeScript - příčetný jazyk pro web
Borek Bernard: TypeScript - příčetný jazyk pro webDevelcz
 

Ähnlich wie TNPW2-2014-05 (20)

TNPW2-2011-08
TNPW2-2011-08TNPW2-2011-08
TNPW2-2011-08
 
Smact a průmysl 4.0
Smact a průmysl 4.0Smact a průmysl 4.0
Smact a průmysl 4.0
 
Čtvrtkon #71 - Marian Benčat - Angular a NativeScript
Čtvrtkon #71 - Marian Benčat - Angular a NativeScriptČtvrtkon #71 - Marian Benčat - Angular a NativeScript
Čtvrtkon #71 - Marian Benčat - Angular a NativeScript
 
Semináře M-Files: Konec hledání řešení pro správu firemních dat
Semináře M-Files: Konec hledání řešení pro správu firemních datSemináře M-Files: Konec hledání řešení pro správu firemních dat
Semináře M-Files: Konec hledání řešení pro správu firemních dat
 
Webové technologie
Webové technologieWebové technologie
Webové technologie
 
TNPW2-2011-06
TNPW2-2011-06TNPW2-2011-06
TNPW2-2011-06
 
CSAS_v06
CSAS_v06CSAS_v06
CSAS_v06
 
Moderni trendy ve_vyvoji_aplikaci
Moderni trendy ve_vyvoji_aplikaciModerni trendy ve_vyvoji_aplikaci
Moderni trendy ve_vyvoji_aplikaci
 
Vývojářské Nástroje a Techniky
Vývojářské Nástroje a TechnikyVývojářské Nástroje a Techniky
Vývojářské Nástroje a Techniky
 
TNPW2-2012-03
TNPW2-2012-03TNPW2-2012-03
TNPW2-2012-03
 
Co sledovat a jak měřit u mobilního webu
Co sledovat a jak měřit u mobilního webuCo sledovat a jak měřit u mobilního webu
Co sledovat a jak měřit u mobilního webu
 
TNPW2-2012-01
TNPW2-2012-01TNPW2-2012-01
TNPW2-2012-01
 
Co přináší Oracle Database 12c Release 2
Co přináší Oracle Database 12c Release 2Co přináší Oracle Database 12c Release 2
Co přináší Oracle Database 12c Release 2
 
TNPW2-2013-03
TNPW2-2013-03TNPW2-2013-03
TNPW2-2013-03
 
Confluence_v1.4_extended
Confluence_v1.4_extendedConfluence_v1.4_extended
Confluence_v1.4_extended
 
Odborná snídaně v Profinitu 30. 5. 2017 - Firemní portály: rychle a moderně
Odborná snídaně v Profinitu 30. 5. 2017 - Firemní portály: rychle a moderněOdborná snídaně v Profinitu 30. 5. 2017 - Firemní portály: rychle a moderně
Odborná snídaně v Profinitu 30. 5. 2017 - Firemní portály: rychle a moderně
 
Moderní Server Side UI Rendering v PHP
Moderní Server Side UI Rendering v PHPModerní Server Side UI Rendering v PHP
Moderní Server Side UI Rendering v PHP
 
TNPW2-2011-01
TNPW2-2011-01TNPW2-2011-01
TNPW2-2011-01
 
Borek Bernard: TypeScript - příčetný jazyk pro web
Borek Bernard: TypeScript - příčetný jazyk pro webBorek Bernard: TypeScript - příčetný jazyk pro web
Borek Bernard: TypeScript - příčetný jazyk pro web
 
TNPW2-2014-01
TNPW2-2014-01TNPW2-2014-01
TNPW2-2014-01
 

Mehr von Lukáš Vacek

Mehr von Lukáš Vacek (6)

TNPW2-2013-10
TNPW2-2013-10TNPW2-2013-10
TNPW2-2013-10
 
TNPW2-2013-09
TNPW2-2013-09TNPW2-2013-09
TNPW2-2013-09
 
TNPW2-2013-08
TNPW2-2013-08TNPW2-2013-08
TNPW2-2013-08
 
TNPW2-2012-10
TNPW2-2012-10TNPW2-2012-10
TNPW2-2012-10
 
TNPW2-2012-09
TNPW2-2012-09TNPW2-2012-09
TNPW2-2012-09
 
TNPW2-2012-04
TNPW2-2012-04TNPW2-2012-04
TNPW2-2012-04
 

TNPW2-2014-05

  • 1. TNPW2 2013/2014 Mgr. Lukáš Vacek lukas.vacek@uhk.cz Aktuální trendy ve vývoji webových aplikací a něco navíc
  • 2. „Zajímám se o budoucnost, protože v ní hodlám strávit zbytek svého života.“ – Ch. F. Kettering 2
  • 3. Agenda • Současný stav, RIA • Komunikace webových aplikací • Uživatelské rozhraní • AJAX • Flash, Flex, Silverlight a další • Pracovní nástroje • Co je Web 2.0? Gartner: hlavní trendy? • Odkazy na internetu 3
  • 5. Internet 5 • Poskytovatel informací >> platforma pro poskytování služeb uživatelům • Exponenciálně roste počet uživatelů • Exponenciálně roste nabídka informací a služeb • Exponenciálně roste datový traffic (objem přenášených dat) • Exponenciálně roste množství uložených dat • Podle IBM každý den vytváříme 2,5 trilionu bytů dat, 90 % bylo vytvořeno za poslední 2 roky (IDC Enterprise mobility konf. 2014) • Roste počet druhů zařízení, která lze pro přístup k Internetu využívat • PC, mobily, tablety, smart TV, herní konzole, el. čtečky, mult. přehrávače… • 24/7 – odkudkoliv, kdykoliv – tzv. Internet v kapse (mobilita zařízení) • S tím souvisí podpora nových technologií a webových standardů…
  • 6. Dnešní ICT trendy 6 • Existují různé pohledy a předpovědi  • Podle fy Gartner • Mobilní aplikace a rozhraní pro mobilní zařízení (hlasové ovládání, gesta…) • Sociální sítě (vč. businessu, soc. analytik a soc. kontextu) • Big data (analýza, vizualizace) • Cloud computing • Další zajímavé trendy (některé se překrývají) • E-commerce • Internet of things (různá zařízení, Intel: cca 20 mld. v roce 2020!) • Počítačová bezpečnost • Snižování energetické náročnosti (datová centra i klientská zařízení) • In-memory computing • 3D (tisk, vizualizace)
  • 7. Dnešní webové technologie 7 • Neustálé zdokonalování stávajících technologií pro web, které se ukázaly jako použitelné (životaschopné): • rozšiřování funkcionality, kterou poskytují vývojářům, • zjednodušení (a zrychlení) jednotlivých procesů vývoje (analýza, návrh, implementace, testování, deployment), • implementace moderních trendů (MVC, ORM, SOA, bezpečnost, přístupnost pro různá zařízení a platformy apod.), • zvyšování výkonu vyvíjených aplikací. • Osvědčené technologie: JavaScript, Java, ASP.NET, Flash, Python, PHP... • „Novější“ technologie: Ruby (on Rails), Adobe AIR, Flex, Silverlight apod. • Na straně klienta je současným leaderem HTML5 + CSS3 + JavaScript • Pořád je co zlepšovat!
  • 8. Aktuální problémy webových aplikací 8 • Vývoj webových aplikací = (až moc) velký výběr technologických platforem • Problémem většiny dnešních webových aplikací jsou hlavně… • Omezené možnosti jejich uživatelského rozhraní (User Interface) • Validace formulářových dat na straně klienta (v reálném čase) • Beze-stavová komunikace při použití protokolu HTTP(S) • Práce v offline režimu • Obecně podpora (implementace) standardů v prohlížečích • Většina webových aplikací je stále založena na značkovacím jazyku HTML (XHTML) – ten původně nebyl navržen pro vývoj aplikací >> má celou řadu omezení (množství přenášených dat, ergonomie ovládání apod.) • Některá omezení lze obejít (např. JavaScript/AJAX, Flash, Adobe AIR, ViewState a PostBack v ASP.NET apod.), ale není to ono (problematická účinnost, někdy složitost řešení, jen některé platformy) • Takže, co s tím?
  • 9. Řešení? 9 • Postupně vytvořit nové nebo rozšířit stávající technologie tak, aby poskytovaly vývojářům a uživatelům: • komplexní grafické rozhraní (MDI koncept >> 1 hlavní okno), • ovládání a funkce odpovídající klasickému desktopovému řešení (drag&drop, klávesové zkratky, kontextová nápověda, auto complete prvky apod.), • možnost kontroly formulářových dat u klienta v reálném čase • možnost práce v offline režimu na straně klienta • odstínění klienta (uživatele) od modelu žádost/odpověď • přenos jen nezbytně nutných dat (např. bez duplicit v UI) • a to vše pro různé druhy platforem a zařízení (např. mobilní)
  • 10. RIA (Rich Internet Application) 10 • Označení pro novou generaci aplikací, které by uvedené požadavky měly plně (nebo částečně) splňovat • RIA řeší především záležitosti na straně klienta! • Významnou roli bude hrát HTML5 (aspoň v nejbližší době) • Existuje silná spojitost s Internetem – web/(X)HTML, plug-iny prohlížečů, desktop, mobilní zařízení • Snadnost spuštění aplikace se blíží snadnosti navštívení webové stránky • Výhledově by RIA technologie mohly výrazně podpořit myšlenku na převedení většiny dnešních aplikací do online podoby (celá řada výhod >> aktuálnost, dostupnost, zpoplatnění jen používaných funkcí apod.) • http://interval.cz/clanky/rich-internet-applications-v-roce-2008/ • http://zdrojak.root.cz/clanky/pristupnost-ria-dynamicke-zmeny-obsahu/ • Není to dokonalé, ale je to krok správným směrem
  • 12. Webová komunikace – beze-stavové HTTP 12 • Nejčastěji založena na protokolu HTTP(S) • HTTP je beze-stavový protokol (request >> response) • Základní vlastnost = snadná implementace • Mezi jednotlivými requesty se neudržuje kontext • U většiny aplikací to nemusí vadit • Beze-stavové HTTP můžete obejít přes • Cookie (nejstarší, 4KB dat, odesílá se s každým(!) http požadavkem, lze zakázat) • Session (posílá se ID relace, data uložena na serveru – in proc, state server, sql) • Využitím local storage (viz dále) • Viewstate a Control State (v ASP.NET) – hashovaná data v políčku formuláře • http://www.youtube.com/watch?v=IdJD2FSRQWU video z přednášky
  • 13. Další možnosti komunikace 13 • Moderní webové aplikace využívají pro komunikace mezi klientem a webovým serverem i další standardy/protokoly, než jen obyčejné HTTP(S) • REST – orientován datově (ROA), běžné HTTP příkazy (GET, POST, PUT a DELETE) pro CRUD operace • Webové služby – protokol SOAP pro vzdálené volání procedur, formát XML • SOA – univerzální, i mimo web • Projekt SPDY – vylepšení protokolu HTTP, rychlejší načtení stránky • Různé formáty dat přicházejících na klienta… HTML, XML, JSON apod., které lze (programově) dále zpracovat • Iniciátorem komunikace nemusí být vždy klient (obvyklý scénář) – možnost vytvoření permanentního spojení (web socket, realtime app – SignalR apod.) • Nezapomeňte na bezpečnost komunikace – SSL, autentizaci klientů apod.
  • 15. Uživatelské rozhraní (UI, frontend…) 15 • Výrazným trendem dneška je JEDNODUCHOST • Je kladen důraz na • Přehlednost • Intuitivnost • Použitelnost • Důležitou roli hraje přizpůsobení UI pro různá zařízení • Adaptive Web Design (server) • Responsive Web Design (klient) • Nejbližší budoucnost… HTML5 + CSS3 + JavaScript
  • 16. Webové formuláře 16 • Už od počátku Internetu jsou formuláře hlavním prostředkem pro zadávání uživatelských vstupů do webové stránky • Základní množina formulářových prvků a jejich funkcí je v podstatě stále stejná jako na začátku, kdy se nepočítalo s Internetem jako s platformou pro aplikace • Původní formulářové prvky nepokrývají všechny potřeby dnešních webových aplikací, nejen v oblasti datových vstupů, ale i jejich případné validace (kontroly) • Tento nedostatek bylo třeba odstranit • Jsou (byly) možné dva základní přístupy k řešení problému: • Úplně to celé předělat (XForms) • Rozšířit stávající množinu prvků a jejich funkcionalitu (Web Forms >> HTML5) • http://interval.cz/clanky/pohled-na-webove-formulare-druhe-generace/
  • 17. HTML5 (Web Forms 2.0 je součástí) 17 • Původně konsorcium WHATWG (The Web Hypertext Application Technology Working Group) >> vývojáři Mozilla, Opera, Safari • Od roku 2007 existuje pracovní skupina W3C pro HTML5 specifikaci, v lednu 2008 byl vydán draft • Rozšiřuje HTML 4.01 a XHTML 1.0 >> jednoduché na naučení • Zpětná kompatibilita ve starších prohlížečích • Zatím neúplná podpora nových prvků v prohlížečích • Pozor! HTML5 řeší více než jenom webové formuláře • http://en.wikipedia.org/wiki/Html5 • http://www.lupa.cz/clanky/whatwg-budoucnost-webu/ • http://www.w3.org/TR/2008/WD-html5-diff-20080122/ • http://www.root.cz/serialy/html5-a-jeho-zajimave-vlastnosti/
  • 18. Lokální úložiště dat – Local storage, session storage 18 • V souvislosti se standardem HTML5 se často mluví o offline režimu aplikací • Lokální úložiště dat (name/value) na straně klienta, přístupné z JavaScriptu • Podpora v moderních prohlížečích (např. IE8+) • Local storage běžně neexpiruje, musíte si po sobě uklidit! • Session storage standardně vydrží do zavření okna prohlížeče • Kapacita cca 5MB na doménu, každý browser to ale počítá jinak! • Nepřenáší se na server, aplikační logika sama musí data serializovat! • http://www.lupa.cz/clanky/sql-si-razi-cestu-do-html5/ • http://zdrojak.root.cz/clanky/webdesigneruv-pruvodce-po-html5-webstorage/ • http://code.google.com/p/sessionstorage/
  • 19. XForms 19 • Za návrhem XForms stojí konsorcium W3C • Jeden z modulů připravovaného XHTML 2.0 • Komplexně řeší formuláře na webu i na desktopu • Je poněkud složitější na naučení (i když W3C tvrdí opak ) • Chybí zpětná kompatibilita • Slepá větev! • http://en.wikipedia.org/wiki/Xforms • http://www.grafika.cz/art/webdesign/encxforms.html • http://html456.blogspot.com/2009/07/predseda-xhtml2-wg-rika-xhtml2-neni.html
  • 20. AJAX
  • 21. AJAX (Asynchronous JavaScript and XML) 21 • Aktuálně nejrozšířenější RIA technologie • AJAX je programový přístup, který mezi prohlížeč a webový server přidává vrstvu abstrakce • Základem je klientské skriptování (DOM, (X)HTML a JavaScript), obvykle kombinované s voláním webových služeb a zpracováváním XML dat (XMLHttpRequest) • Používá známé a osvědčené technologie • Jeho nasazení (pozor, neplatí to vždy a všude!) může zlepšit použitelnost webových aplikací s ohledem na jejich ovládání uživatelem • Při nevhodném použití může generovat poměrně velkou zátěž pro webový server • Webové AJAX aplikace je možné vytvářet na většině hlavních vývojových platforem (ASP.NET, Java/JSF/ADF, PHP apod.) • http://cs.wikipedia.org/wiki/Asynchronous_JavaScript_and_XML
  • 22. AJAX (Asynchronous JavaScript and XML) 22 Klasická webová aplikace Klient (webový prohlížeč) User Interface Server (webový server) Aplikační logika HTTP request HTML + CSS AJAX Klient (webový prohlížeč) User Interface AJAX Engine JavaScript HTML + CSS Server (webový server) Aplikační logika HTTP request XML data
  • 23. Flash, Flex a spol.
  • 24. Adobe Flash 24 • V současnosti dominuje v oblasti interaktivní grafiky na Internetu • Multiplatformní technologie zaměřená na práci s grafikou, vektorovými animacemi nebo video streamingem (např. Youtube) • Historie – FutureWave Software (kolem roku 1996), Macromedia (do 2005) • Pro klienta je k dispozici Flash Player (aktuální verze 12.x), jako plug-in je nainstalován na většině počítačů s webovým prohlížečem (Adobe uvádí až 99 %) • Používá programovací jazyk ActionScript (založený na ECMAScript), pracuje s textem, grafikou i s databázemi • Jsou určité problémy s indexování obsahu ve vyhledávačích • Ověřená technologie, s velkou vývojářskou komunitou! • Řada vývojových nástrojů • Problémy: bezpečnost, stabilita, výkon na slabších zařízeních! • http://www.adobe.com/products/flash/ • http://www.flash.cz/portal/
  • 25. Adobe Flex 25 • Komponentový framework pro interaktivní aplikace postavené na technologii Flash (Flash Player v prohlížeči) a Adobe AIR (desktop) • Aplikace mohou integrovat např. multimédia, XML, webové služby nebo tzv. Flex Data Services (WS postavené na J2EE) • Programovací jazyk ActionScript 3, MXML pro UI • Základní vývojové nástroje (SDK + kompilátor) jsou zdarma, Flex Builder za peníze; je možná pokročilá integrace (Ant, Maven) • Deployment = zkopírovat soubory SWF (+ HTML wrappery) • Technologie Flash/Flex umožňují odklon UI od klasické podoby webových stránek, není to náhrada HTML a spol. • Velké plány Adobe, realita je skromnější, aktuální verze Flex 4.11.xx (10/2013) • Open source licence frameworku! • http://www.adobe.com/products/flex/ • http://www.grafika.cz/art/webdesign/flashflex.html • http://interval.cz/clanky/adobe-flex-co-je-a-co-neni/
  • 26. Adobe Air 26 • Adobe AIR (Adobe Integrated Runtime, dříve Apollo) • První stabilní verze 1.0 (únor 2008) – aktuální verze 4.xx (12/2013) • Multiplatformní runtime propojující desktopové a webové aplikace • Umožňuje kombinovat např. HTML/JavaScript/AJAX, Flash, Flex • Rozšiřuje funkcionalitu a možnosti webových aplikací (např. drag&drop, práce s diskem, nativní okna, offline práce s daty, synchronizace apod.) • Má plný přístup k lokálním zdrojům! Pod účtem, pod kterým uživatel pracuje • Aplikace lze spouštět nezávisle na prohlížeči, na různých zařízeních • http://www.adobe.com/cz/products/air/ • http://labs.adobe.com/technologies/air/ • http://jilm.blog.lupa.cz/0704/adobe-je-cerny-kun-internetovych-aplikaci • http://www.flash.cz/portal/clanek.aspx?id=594 • http://www.dsl.sk/article.php?article=5359
  • 27. Microsoft Silverlight 27 • První verze v září 2007, aktuální verze 5.1.xx (10/2013) • Jde o runtime pro spouštění interaktivních aplikací v prostředí webového prohlížeče nebo desktopu, u klienta je třeba instalovat odpovídající plug-in • Základem je WPF >> grafický subsystém .NET Frameworku 3.0 >> umožňuje popisovat textový, vektorový, interaktivní a multimediální obsah pomocí XAML • Podporuje přehrávání audia a videa ve formátech WMV, WMA a MP3 • Programovat lze v JavaScriptu, od verze 2.0 také v C#, VB.NET apod. • Multiplatformní podpora u klienta pro Windows, Mac, Linux (Moonlight) • Na klientovi běží v tzv. sandboxu, nemá plný přístup k disku • Jako vývojové prostředí se používá Visual Studio • Někdy je označována jako tzv. „Flash killer“ technologie  • Jako cross-platform technologii bude Microsoft spíše podporovat HTML5! • http://www.microsoft.com/silverlight/ • http://en.wikipedia.org/wiki/Moonlight_(runtime) • http://is.gd/hUi05 (článek na JustIT - podpora Silverlight vs. HTML5)
  • 28. XUL (XML User Interface Language, čti Zůl) 28 • XUL je technologie založená na XML • Umožňuje tvorbu RIA aplikací, které mohou být spouštěny z Internetu (ale nemusí, např. Firefox) • XML v kombinaci s JavaScriptem (obsluha událostí) a CSS umožňuje vytvářet UI aplikací • XUL odděluje jednotlivé prvky UI a jejich vzhled >> snadná skinovatelnost • Technologii XUL zastřešuje Mozilla Foundation • Je platformě nezávislá, používá komponenty v nativních jazycích (C/C++) • Na straně klienta je to trochu pomalé… • http://www.mozilla.org/projects/xul/ • http://en.wikipedia.org/wiki/XUL • http://www.kosek.cz/clanky/xul/index.html
  • 30. Pracovní nástroje 30 • Trendem jsou rostoucí požadavky na komplexnost vývojových nástrojů • Každý vývojář potřebuje něco jiného, záleží na jeho roli • Jednotlivé etapy vývoje software nejsou jednoznačně odděleny, často běží vedle sebe (paralelní běh analýzy a implementace při tzv. extrémním programování) • Jsou vyžadovány funkce a nástroje, které zefektivní jednotlivé etapy vývoje • Pro fázi implementace se za samozřejmé považuje např. • sofistikovaný editor zdrojových kódu s inteligentním doplňováním, • vizuální návrh UI, trend generování UI do HTML5 + JavaScript + CSS na výstupu, • spolupráce s CASE nástroji, synchronizace, • podpora verzování, týmový vývoj, úkoly/task(s), • podpora pro ladění aplikace, trasování, refaktorizace kódu, • podpora nejrůznějších šablon, práce s databází, ORM, design patterns, • podpora automatického testování (unit, funkční, zátěžové…), TDD, • tvorba instalačních balíčků, konfiguračních skriptů, deployment aplikace a další
  • 31. Web 2.0? Gartner: 4 hlavní trendy
  • 32. Web 2.0? 32 • Web 2.0 lze chápat „Jako posun od centralizovaného zpracování služeb k decentralizaci.“ – Tim O’Reilly (zdroj) • „Web 2.0 jsou takové webové projekty, které používají technologie a principy namířené co nejvíce k uživatelům služeb, a to často tak blízko, že nechávají samotné uživatele, aby se sami podíleli na obsahu či tvorbě projektu.“ – Symbio • Jiný úhel pohledu na to, jak rozlišit jednotlivé vývojové fáze webu… „Na Web 1.0 stačilo připojení kolem 50 Kbit/s, na Web 2.0 linka o rychlosti 1 Mbit/s a na Web 3.0 to bude přibližně 10 Mbit/s.“ – Reed Hastings (zdroj Symbio) • http://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html • http://www.symbio.cz/clanky/web-2-0-3-0-4-0.html • http://en.wikipedia.org/wiki/Web_2.0
  • 33. Co znamená Web 2.0 pro návrh (design) aplikace? 33 • Web jako platforma – klasický design ustupuje do pozadí, a do popředí se dostávají programové nadstavby (API), webové služby, XML, RSS apod. = změny v programování a v přístupu k datům • Mnohem intenzivnější spolupráce mezi servery při výměně dat • Tzv. Mashup aplikace  • Změny v navigaci, organizaci informací a v přístupu k nim >> uživatelé rozhodují sami (agregátory obsahu) • Mixování obsahu >> obsah je důležitější než jeho poskytovatel! • Komunity přidávají a sdílejí vlastní data >> štítky, recenze apod. • Často hovoříme v této souvislosti o pojmech sociální sítě, Cloud computing apod. • http://www.symbio.cz/clanky/komunity-v-podani-strycka-googla.html • http://www.lupa.cz/clanky/zmeni-google-sidewiki-internet/ • http://zdrojak.root.cz/clanky/rest-architektura-pro-webove-api/ • „The Age of APIs“ >> rozvoj businessu + prostředek integrace
  • 34. Gartner: 4 hlavní trendy – Sociální sítě 34 • Webové aplikace označované jako Web 2.0 se prosazují stále více • Nesmírně důležitá je komunita uživatelů, která se na takovouto aplikaci „nabalí“ • Potom hovoříme o tzv. sociální síti • Sociální sítě jsou čím dál důležitější i pro firemní komunikaci (dovnitř i ven) Facebook, Instagram, Pinterest, Google+, LinkedIn – komunitní weby Wikipedia – internetová encyklopedie Del.icio.us – ukládání a sdílení záložek (bookmarks) Flickr – sdílení fotografií na webu Twitter – krátké osobní zprávy do 140 znaků
  • 35. Gartner: 4 hlavní trendy – Cloud computing (více přednáška) 35 • „Termín označuje souhrnně technologie a postupy používané v datových centrech a firmách pro zajištění snadné škálovatelnosti aplikací dodávaných přes Internet.“ – Jan Kodera (http://cloud.abakowiki.cz/) • Cloud hosting nabízí serverový cluster s vysokým výpočetním výkonem, datovým úložištěm a konektivitou, který je možné si pronajímat dle potřeby • IaaS – Infrastruktura jako služba • PaaS – Platforma jako služba • SaaS – Software jako služba • Výhodou je dynamický sizing a platba jen za skutečně spotřebované prostředky SaaS PaaS IaaS http://zdrojak.root.cz/clanky/cloud-hosting-aneb-hosting-v-oblacich/ http://www.lupa.cz/clanky/cloudy-maji-budoucnost-a-take-problemy/ http://is.gd/hUmcI – možnosti dynamického škálování prostředků v MS AZURE
  • 36. Gartner: 4 hlavní trendy – Mobilní aplikace (více na přednášce) 36 • Přístup ke službám 24/7, odkudkoliv – tzv. Internet v kapse  • Prodá se více mobilních zařízení, než stolních počítačů >> post-PC svět/éra • Významnou roli na straně serveru hraje cloud computing • Objem dat přenášených přes mobilní zařízení exponenciálně roste! • Mění se role telco operátorů: Hlasové služby ustupují, doplněk ICT služeb • Mobilní aplikace • Nativní aplikace • Mobilní webové aplikace (někteří prosazují trend Mobile first) • Native wraper
  • 37. Gartner: 4 hlavní trendy – Big data, datová analytika 37 • Big data (podle Gartner) = data, jejich velikost je mimo schopnosti zachycovat, spravovat a zpracovávat je běžně používanými softwarovými prostředky v rozumném čase • Big data je hype! >> Všichni o tom mluví, ale zatím málokdo to umí dobře využít  • Při zpracování dat hraje roli SW + HW (distrib. úložiště a výpočty, HPC) • Problémy mohou být s objemem, strukturou nebo rychlostí zpracování • Často využívají tzv. NoSQL databáze >> umožňují pomocí key+hodnota relativně rychle (a levně) pracovat s uloženými daty (základní dotazy), pokročilejší a náročnější operace zajišťují pomaleji relační databáze • Použití big data: Sociální sítě, e-commerce, marketing, různé senzory, vědecké experimenty… • Schopnost pracovat s datovou analytikou je často rozhodujícím faktorem úspěchu produktu nebo služby
  • 38. Top technology trends 2014 (IEEE) 38 • Mobilní cloud – mobilní zařízení využívají výpočetní výkon v cloudu, nové služby • Z Internetu věcí >> Web věcí – využití mobilních zařízení a senzorů • Od velkých objemů dat k extrémním – jednodušší analytické nástroje • 3D revoluce – rychlejší a levnější 3D tisk • Podpora nových způsobů učení – elearning • Mobilní sítě nové generace – rostoucí potřeby uživatelů • Vyvažování identity a soukromí – bezpečnost • Inteligentní a propojená zdravotní péče – healthcare • E-government • Využití Cloud computingu ve vědě – nové objevy • http://www.computer.org/portal/web/membership/Top-10-Tech-Trends-in-2014 • Třináct IT trendů v roce 2013 podle IEEE (Lupa.cz)
  • 40. Odkazy na internetu I. 40 • http://cs.wikipedia.org/wiki/Asynchronous_JavaScript_and_XML (AJAX) • http://www.asp.net/ajax/ (Microsoft ASP.NET AJAX Extension) • http://en.wikipedia.org/wiki/Html5 (HTML5) • http://www.adobe.com/products/flash/ (Adobe Flash) • http://www.adobe.com/products/flex/ (Adobe Flex) • http://www.openlaszlo.org/ (OpenLaszlo) • http://www.mozilla.org/projects/xul/ (XUL) • http://www.microsoft.com/silverlight/ (Silverlight) • http://www.sun.com/software/javafx/index.jsp (JavaFX) • http://labs.adobe.com/technologies/air/ (Adobe Air) • http://en.wikipedia.org/wiki/Web_2.0 (Web 2.0) • http://zdrojak.root.cz/clanky/cloud-computing-jiny-pohled-na-aplikace/ • http://www.augi.cz/programovani/cassandra-ocima-net-programatora/ (NoSQL) • http://www.zive.cz/bleskovky/v-americe-vladne-internetu-netflix-v-evrope-bittorrent/sc-4-a- 166249/default.aspx (Netflix a BitTorrent králové datového trafficu) • http://www.root.cz/clanky/big-data-a-jejich-zpracovani/
  • 41. Odkazy na internetu II. 41 • http://zdrojak.root.cz/clanky/jak-budeme-psat-webove-aplikace-za-tri-roky/ • http://zdrojak.root.cz/clanky/vyvojar-si-jen-s-programovanim-nevystaci/ • http://suewebik.net/webove/web20-def.html • http://www.lupa.cz/clanky/web-2-0-bublina-nebo-novy-smer-webu/ • http://www.slideshare.net/MedvidekPU/sociln-st-mn-internet-k-nepoznn • http://zdrojak.root.cz/clanky/jaky-software-pohani-facebook/ • http://www.lupa.cz/clanky/komunitni-server-a-komunitu-mate-kde/ • http://www.forbes.com/sites/gartnergroup/2014/10/21/gartners-top-10-strategic-technology-trends- for-2015/ • http://tech.ihned.cz/c1-63001160-internet-of-things-internet-veci-hrozby