Meteor 1.0 vyšiel 28.10.2014.

6.11.2014 prebehol Worldwide Meteor 1.0 meetup v rôznych mestách po celom svete. Mimochodom aj v Prahe.

Čo je Meteor?

Meteor je sada nástrojov, pomocou ktorých dosiahneme rýchlejší a pohodlnejší vývoj webových, prípadne mobilných aplikácií. Stará sa o front-end, back-end, databázu, balíčky a deploy. Filozofia meteoru je: „JavaScript everywhere„.

Prečo Meteor?

Izomorfné aplikácie sa dostávajú stále viac do pozornosti. A nie je to len tak pre nič, za nič. Výhoda izomorfných aplikácií je, že môžete zdieľať kód na klientovi aj na serveri. Teda môžete napríklad validovať dáta s tým istým kódom na klientovi aj na serveri. Už žiadna duplicita kódu.

Na naučenie sa Meteoru potrebujete mať základy JavaScriptu, HTML a CSS. Žiadne PHP, Ruby, Python, alebo iný serverový jazyk nepotrebujete ovládať.

Už žiadne prepínanie kontextu medzi server-side a client-side jazykom. V Meteore píšete celú aplikáciu v JavaScripte.

Čo Meteor ponúka?

• JavaScript na klientovi aj na serveri
• Zdieľanie kódu medzi klientom a serverom
• Jednoduchá inštalácia
• Jednoduché vytvorenie projektu
• Real-time defaultne
• Minimongo
• Live reload
• Množstvo balíkov (packages)
• Vstavaná autentizácia/registrácia užívateľov
• Automatické pridanie JS a CSS do HTML
• Automatická minifikácia CSS/JS
• Jednoduchý refaktoring
• Latency compensation
• Vývoj webovej a mobilnej aplikácie zároveň
• Jednoduchý deploy
• SEO v SPA
• Komunita

JavaScript na klientovi aj na serveri

Základným stavebným kameňom Meteoru je Node.js. Klient a server komunikujú medzi sebou prostredníctvom jednoduchého protokolu DDP (Distributed Data Protocol). Na front-ende používa vlastný šablónovací jazyk Spacebars, ktorý má veľa podobného s Handlebars. Pre real-time zmeny v šablónach používa vlastný šablónovací engine Blaze.

Zdieľanie kódu medzi klientom a serverom

Aka Izomorfné aplikácie. Určite sa vám veľakrát stalo, že ste potrebovali validovať formulár na strane klienta a následne na strane servera. Výsledkom bol duplicitný kód. V Meteore si môžete napísať funkciu pre validáciu formulára a môžete ju použiť na klientovi aj na serveri. Už žiadna duplicita kódu!

Jednoduchá inštalácia

Meteor momentálne (v1.0) oficiálne nepodporuje Windows, ale niečo sa chystá.

Pre Linux a MAC stačí pre inštaláciu použiť jediný príkaz:

curl https://install.meteor.com/ | sh

Jednoduché vytvorenie projektu

Pre vytvorenie projektu slúži príkaz:

meteor create nazov-projektu

Po vytvorení projektu treba ísť do jeho zložky a spustiť Meteor server príkazom meteor:

cd nazov-projektu & meteor

Príkaz „meteor“ spustí server a „nainštaluje“ lokálnu MongoDB databázu. Nemusíte riešiť inštalovanie databázy ani pripojenie k databázi. Môžete začať hneď vyvíjať.

Real-time defaultne

Predstavte si jednoduchý chat. Napíšete správu, správa sa uloží do databázy a automaticky sa zobrazí všetkým pripojeným klientom. Programátor okrem zobrazenia a uloženia dát nemusí robiť nič, aby dosiahol real-time aktualizáciu.

Minimongo

Minimongo je klientská implementácia MongoDB. Tj. Pracovať s kolekciami môžeme na serveri aj na klientovi. Zo serveru môžeme poslať do Minimonga rozumné množstvo dát a sním ďalej pracovať. Vyhľadávanie v Minimongu je rýchle, pretože odpadá request-response čas.

Live reload

Zabudnite na F5 a refresh prehliadača. Meteor to spraví za vás automaticky, keď uložíte súbor vo vašom projekte. Je to veľmi príjemné a návykové.

Množstvo balíkov (packages)

Meteor vytvoril svoj vlastný balíkovací systém pre izomorfné balíky – tj. 1 balík môže obsahovať jak serverový kód, tak klientský kód. Ba dokonca aj HTML šablóny (templates). Viac ako 2500 Meteor balíkov nájdete na AtmosphereJS. Ak nejaký balíček nenájdete na Atmosphere, môžete použiť NPM, alebo Bower. Alebo si vytvoriť vlastný Meteor balíček, je to jednoduché.

Balíky pridáte do aplikácie jednoducho:

meteor add nazov-balicku

A balíček môžete začať hneď používať.

Vstavaná autentizácia/registrácia užívateľov

Jeden z najužitočnejších balíkov je accounts-ui. Tento balík zaisťuje vykresľovanie užívateľského rozhrania pre prihlasovanie a registrovanie užívateľov. Stačí pridať balík pomocou:

meteor add accounts-ui

A pre vykreslenie užívateľského rozhrania treba pridať do šablóny:

{{> loginButtons}}

Ak chcete prihlasovanie cez heslo a email, pridajte balík accounts-password. Ak chcete prihlasovanie cez rôzne externé služby, pridajte balíky accounts-facebook, accounts-github, accounts-google, accounts-twitter,….

Automatické pridanie JS a CSS do HTML

Ak vytvoríte nový súbor, či už klientský JavaScript alebo CSS, je automaticky pridaný do HTML. Nemusíte ručne pridávať script a link (css) tagy.

Automatická minifikácia CSS/JS

Na produkčnom serveri sú všetky CSS a JavaScript súbory minifikované do jedného CSS a jedného JS súboru. Opäť nemusíte nič riešiť, všetko sa deje automaticky.

Jednoduchý refaktoring

Meteor používa špeciálnu štruktúru zložiek v projekte. Ak pochopíte túto štruktúru, tak môžete ľubovoľne vytvárať zložky a presúvať súbory medzi nimi bez strachu, že niečo rozbijete.

Latency compensation

Skvelá vec. Užívateľ nemusí čakať na odozvu zo servera. Funguje to ako tlačítko like na Facebooku. Vidíte hneď, že sa niečo udialo. Ak nastane chyba na serveri, tlačítko sa dá do pôvodného stavu. Pomocou callbacku môžete informovať užívateľa o chybe.

Skvelý článok o Latency compensation nájdete na Meteorhacks.

Vývoj webovej a mobilnej aplikácie zároveň

Meteor používa pre mobilné aplikácie knižnicu Cordova. Zatiaľ podporuje iba iOS a Android.

meteor add-platform ios
meteor add-platform android

Viac informácii o vývoji mobilných aplikácií v Meteore nájdete na Meteor wiki.

Jednoduchý deploy

Ak už máte pocit, že by vaša aplikácia mohla uzrieť svetlo sveta, môžete napísať do konzoly:

meteor deploy nazov-projektu

Tento príkaz zabalí vašu aplikáciu do jedného balíka (bundle), nahrá ho na server, ktorý ponúka Meteor platforma zdarma, na serveri tento balík rozbalí a spustí ho. Aplikáciu potom nájdete na adrese:

http://nazov-projektu.meteor.com

Ak chcete spraviť deploy na vlastný server, použite Meteor up.

SEO v SPA

SPA vývojári odjakživa bojujú so SEO. V Meteore môžete mať SPA aj SEO! Vďaka spiderable balíku:

meteor add spiderable

Komunita

Za krátky čas vzniklo veľa užitočných balíkov a to hlavne vďaka komunite. Vzniklo tiež veľa článkov, veľa aplikácií, jedna kniha a vzniká ďalšia. Meteor komunita je jedna veľká rodina. Na Facebooku vznikla skupina pre Meteor nadšencov, ktorí sa chcú naučiť viac, naučiť niečo ostatných, alebo len diskutovať.

Meteor sa naučí každý

Meteor sa naučí každý, kto sa dokázal naučiť JavaScript. Ak máte radi JavaScript, Meteor si zamilujete ešte viac.

Špeciality Meteoru

V aktuálnej verzii 1.0 podporuje jedinú databázu – MongoDB. Dajú sa ale nájsť balíky od komunity pre podporu iných databáz.

Má vlastný šablónovací engine Blaze a šablónovací jazyk Spacebars, ktoré sa starajú o real-time zmeny v HTML šablónach. Nie je potrebný žiadny front-end framework.

Posielanie dát zo serveru na klienta (Minimongo) – publish/subscribe. V Meteore sa neposiela zo serveru celé HTML. Posielajú sa iba dáta vo formáte JSON pomocou protokolu DDP. Dáta publikujeme na serveri napríklad takto:

Meteor.publish('messages', function(limit) {
  return Messages.find({}, {
    limit: limit,
    sort: { timestamp: -1 }
  });
});

Keď chceme dostať dáta na klientovi, musíme si o ne požiadať pomocou subscribe:

Meteor.subscribe('messages', 10);

Dáta sa uložia v Minimongu a môžeme ich následne zobraziť v šablóne.

Záver

Dúfam, že vás Meteor aspoň trochu zaujal a vyskúšate si ho. Rieši naozaj veľa problémov a bola by škoda ho nevyužiť.