Vytváření webové aplikace pomocí čistého javascriptu? V žádném případě! V dnešní době rychlého vývoje webových aplikací potřebujeme lepší způsoby, jak rychle vyvíjet interaktivní webové aplikace. Zde je prostor pro javascriptové frameworky, které jsou páteří jednostránkových webových aplikací (tzv. SPA).

Javascript spolu s jQuery se používá již roky pro vytvoření komplexnějších webových rozhraní, ale s mnohem větším úsilím a složitostí v kódu a jeho následnou údržbou.

Použití javascriptových frameworků nám dává prostor zaměřit se na vývoj interaktivních prvků uživatelského rozhraní bez větších obav o strukturu kódu a jeho údržbu.

Většina JS frameworků pracuje na principu MVC (architektonický vzor), který zajišťuje více škálovatelný, opakovaně použitelný a udržitelný kód. Není však nutné vždy pracovat přesně podle tohoto vzoru. Existují i varianty jako MV*, MVVM, MVP, které se hodí dle potřeby projektu. JS frameworků je celá řada. Podívejme se na 10 nejlepších. Jsou populární mezi komunitou vývojářů, jsou nabité nejmodernějšími funkcemi a umožňují vyvíjet komplexní jednostránkové webové aplikace.

Angular.js

logo AngularAngular.js je framework podporovaný Google. Poprvé byl vydán v roce 2009 jako dostupný open source framework pod MIT licencí. Od jeho vydání se, Angular ekosystém, obrovsky rozrostl. V současné době se může pochlubit největší komunitou vývojářů a je nejpoužívanějším frameworkem pro vývoj webových aplikací.

Angular.js vkládá do HTML kódu všechny nezbytné a potřebné funkce k vytvoření dynamického náhledu (interaktivní uživatelské prostředí).  Tento Framework tedy rozšiřuje HTML o řadu elementů a atributů, díky kterým lze vytvořit dynamický HTML dokument.
Když je provedeno zkompilování a vykreslení HTML na uživatelském rozhraní, tak se v DOM struktuře  připojí všechny vlastnosti poskytované direktivami.

Dvoucestné bindování (dvoucestná synchronizace dat) je jádro Angular.js. Když uživatel pracuje s rozhraním jako input (např. textové pole), view (webová stránka) a model (javascriptové objekty), tak jsou synchronizovány.

V případě, že se model aktualizuje, je view znovu vykresleno a naopak. To v podstatě nahrazuje „bolest“ psaní ručního kódu pro manipulaci s DOM strukturou.

Nedávno vydaný Framework ReactJS je tvrdou konkurencí Angular.js, ale Angular se díky zájmu mezi vývojáři drží. Hlavním důvodem trvalého zájmuo Angular je zlepšení a pokrok přicházející s každým novým vydáním.
Kdy Angular použít? Když budujete komplexní web (aplikaci) a potřebujete modulární framework, který zvládne všechno.

Více si můžete přečíst na oficiálních stránkách angularjs.org
 

React.js

logo ReactReact.js je javascriptový framework, který je používaný Facebookem i Instagramem. To nám dává rychlou představu o tom, jak je React.js silný pokud jde o vytváření aplikací ve velkém rozsahu.

Poprvé byl vydán jako open source v roce 2013 pod BSD licencí. Jeho komunita roste rychle, a tak se stal nejrychleji rostoucím frameworkem k dnešnímu dni. Lze k němu najít spoustu zdrojů, výukových programů a knihoven/komponent.
React.js je nejlepší na vykreslení složitých uživatelských rozhraní s vysokým výkonem. Využívá virtuální DOM, který může být poskytnut buď na straně klienta, nebo na straně serveru.

React.js zvládá:

  • vykreslení DOM na straně serveru - virtuální DOM,
  • porovnání virtuálního DOMu v prohlížeči / skutečného DOM a zjištění rozdílů,
  • aktualizuje pouze vybrané / změněné uzly DOMu místo vykreslení celé DOM struktury.

Další velkou výhodou tohoto frameworku je znovu využitelnost – to přináší ve formě komponent. Komponenty mohou byt vytvořeny a použity v rámci aplikací nebo zpřístupněny pro veřejné použití.
Chcete-li získat další inspiraci, pak zamiřte rovnou na Instagram. Jeho uživatelské rozhraní je kompletně poháněno pomocí frameworku React.js

Chcete-li se dozvědět více o Reactu, tak navštivte facebook.github.io/react.

Ember.js

logo EmberEmber.js je další silný MVC Framework. Byl vydán v roce 2011 jako open source Framework pod MIT licencí. Jeho autorem je Yehuda Katz. Soutěží s frameworky Angular a React v rámci tvorby interaktivních uživatelských rozhraní a má také velmi aktivní komunitu vývojářů.
Ember.js také pracuje na principu dvoucestného bindování (dvoucestné synchronizace dat) stejně jako Angular. Tedy při změně view dojde ke změně model (a naopak).

Tomuto frameworku se podařilo být žádaným díky modulu Fastboot.js, který umožňuje na straně serveru vykreslování DOM struktury. Toto vykreslování používá i React.js
Ember.js se zaměřuje na to nejlepší z Angularu (dvoucestná synchronizace dat) a React.js (vykreslování DOMu na straně serveru). Způsob jakým komunita využívá tento framework bezpochyby ukazuje, že se bude i nadále rozrůstat.

Více si o Ember.js můžete přečíst na emberjs.com

Aurealia.js

logo AureliaAurealia.js vytvořil Rob Eisenberg a tým, který přišel převážně ze světa Angularu a Durandatelu. Aurelia.js ke open source a oficiálně jej řídí společnost Durandatel Inc. Ta vytváří knihovny, nástroje a frameworky na pro vývoj webových aplikací.

Aurelia.js byl vydán v lednu 2015 pro produkční použití. Toto vydání je pojmenováno jako NextGen a rozšiřuje možnosti společnosti Durandalel. Pro stávající vývojáře, kteří pracují s Angular 1 nebo Angular 2, přichází Aurelia.js s jasnou migrační cestou.
Aurealia.js je nový framework, který ale také stojí za pozornost. Je řízen vysoce profesionální komunitou.

Aurealia.js je vysoce modulární a skládá se z mnoha malých nezávislých knihoven. V projektu můžete používat celý framework nebo jen některou z jeho knihoven. Je i možnost rozšíření o vlastní knihovnu.
Aurealia.js je soběstačný framework bez vnějších závislostí.

Více si o Aurealia.js můžete přečíst na aurelia.io

Meteor.js

logo MeteorLáska vyvíjet kompletní webové aplikace v čistém Javascriptu? Meteor.js je vhodný pro vybudování webové aplikace od začátku do konce kompletně v javascriptu, a to rychlostí blesku. Meteor.js je silný hráč vybaven všemi funkcemi, které potřebujeme pro vykreslování frontendu, rozvoj backendu či správu databází.

Meteor.js je benjamínek společnosti Meteor Development Group. Tento framework byl vydán poprvé v roce 2012 jako open source framework pod MIT licencí.
Od doby jeho vydání roste Meteor.js ekosystém obrovsky rychlým tempem stejně jako jeho komunita. O tomto frameworku lze najít spousty zdrojů, výukových programů a také lze vytvářet vlastní komponenty.

Skvělá věc na Meteor.js je, že používá pouze javascript a netřeba investovat čas do učení něčeho nového. Je modulární, balíčky a knihovny mohou být použity na vyžádání.

Na straně serveru lze balíčky spustit pomocí Node.js a jediné co potřebujete je přístup k databázi.
Z hlediska výkonu jsou veškeré změny v databázi zobrazovány zpět v uživatelském rozhraní v reálném čase bez velké doby odezvy serveru a jeho režie.

Více si o Meteor.js můžete přečíst na meteor.com

 

Backbone.js

logo BackboneHledáte lehký, ale plně vybavený javascriptový framework? Backbone.js je právě pro Vás! Byl poprvé vydán v roce 2010 Jememym Ashkenas jako open source javascriptový framework pod MIT licencí.
Popularitu a sílu tohoto frameworku lze soudit z toho, že weby jako Pinterest, Foursquare, Walmart, Disqus nebo třeba Delicious používají právě Backbone.js. A to je jen malý výčet uživatelů.

Dobrou věcí u tohoto frameworku je jednoduchost učení a malý objem frameworku. S tvorbou aplikací pomocí Backbone.js můžete začít kdykoliv.
Framework je velmi flexibilní. Výsledku můžete dosáhnout napsáním vlastního kódu nebo použitím tohoto frameworku.
Během několika posledních měsíců nastal poměrně pomalý růst v používání Backbone.js frameworku ve srovnání s frameworkem Angular, Ember a nově používaného Reactu.

Více si o Backbone.js můžete přečíst na backbonejs.org

Polymer.js

logo PolymerPolymer.js je naprosto odlišný od ostatních. Byl vydán společností Google v roce 2013. Využívá webové komponenty pro rozšíření HTML kódu.

Polymer umožňuje vytvářet zapouzdřené opakovaně použitelné prvky = webové komponenty, které fungují stejně jako standardní prvky HTML a je možno je používat při vytváření webových aplikací. Například element <audio> je standartní HTML5 element, ale využitím webových komponent můžeme vytvořit nový element – např. <my-audio>.

Polymer nám dává schopnosti v budování vlastních HTML elementů za použití webových komponent.

Více si o Polymer.js můžete přečíst na polymer-project.org

Knockout.js​​​​​​

logo KnockoutKnouckout.js byl nejprve vydán Stevem Sandersonem v roce 2010 jako open source framework pod MIT licencí. Tento Framework pracuje pod MVVM (architektonický vzor) a tím pádem je odlišný od frameworku Ember.js a Angular.js.

Knockout.js měl svůj „zlatý čas“, ale nyní již roste mnohem pomaleji v porovnání se svými konkurenty (Angular.js, Ember.js nebo Backbone.js). Zaostává pozadu z důvodu, že nevydává vylepšení a nové funkce.
Komunita vývojářů pomalu přechází k jiným frameworkům (React.js a Angular.js). Jak řekl autor: "Vývoj pokračuje a bude se vyvíjet takovým směrem, jakým si přeje jeho uživatelská komunita.“

Více si o Knockout.js můžete přečíst na knockoutjs.com

Vue.js

logo VueVue.js je vytvořeno Evanem. Poprvé byl vydán v roce 2014 jako open source Framework pod MIT licencí.
Vue.js je relativně nový framework, který získává spoustu nových vývojářů a buduje komunitu. Pracuje na MVVM vzoru a má velmi jednoduché API. Tento framework je minimalistický, avšak umožňuje využívat selektivní moduly.

Vue.js je inspirováno frameworky Angular.js, React.js, Knockout.js a Rivets.js a pracuje na dvoucestné synchronizaci dat.
Zatímco Vue.js nedosahuje na Angular.js nebo Ember.js, tak koncepčně má potenciál být javascriptovým frameworkem budoucnosti.

Více si o Vue.js můžete přečíst na vuejs.org

Mercury.js

logo MercuryFramework Mercury.js je na trhu poměrně nový a byl vydán teprve nedávno. Byl napsán Jakem Verbatenem a je k dispozici jako open source pod MIT licencí. Je to rychle rostoucí a oblíbenější Framework mezi javascriptovými vývojáři.

Mercury.js je inspirován frameworkem React.js a také pracuje s virtuálním vykreslováním DOMu. Je to moderní framework, plně modulární a můžete jej využít do jaké míry potřebujete.
Při pohledu na základní pojmy – modulární přístup, výkonnost a popularita patří Mercury.js mezi 10 nejlepších frameworků dnešní doby.

Více si o Mercury.js můžete přečíst a github.com/Raynos/mercury

Závěr

Ve WDT používáme webový framework Angular JS. Popularitu frameworků a ostatních technologií naleznete na http://stackoverflow.com/research/developer-survey-2016.

Zdroj: http://noeticforce.com/best-Javascript-frameworks-for-single-page-modern-web-applications