Publikoval Michal Kočí dňa 2.8.2016 o 18:44 v kategóriach Node.js a JavaScript
JavaScript je úžasný a už dávno neslúži len na akési dynamické efekty v prehliadači. Dnes sa v ňom dá naprogramovať všeličo, to som už spomínal v príspevku A víťazom sa stáva... JavaScript. Poďme sa teda pozrieť, ako v ňom na 23 riadkoch naprogramovať nástroj, ktorý zistí aktuálne počasie a zobrazí ho ako notifikáciu operačného systému.
Pre našu utilitku použijeme Node.js. Ten má veľa ľudí spojený s tvorbou serverových webových aplikácií. Vec sa však má tak, že slúži na spúšťanie JavaScriptu mimo webový prehliadač a tak v ňom môžete programovať aj serverové web aplikácie, ale kľudne aj konzolové aplikácie (pracujúce z príkazového riadku či tzv. terminálu).
Keď už spomínam Node.js, viete že vás dokážem rýchlo a ľahko naučiť programovať webové aplikácie v Javascripte na mojom školení Node.js - serverové aplikácie v Javascripte?
Ak ešte nemáte, chodťe a stiahnite si najnovšiu verziu Node.js. Tá sa bude okrem iného vyznačovať tým, že bude podporovať ES6
(správne sa teraz má označovať ES2015
), teda najnovšiu verziu JavaScriptu.
Keď máte, spustite si príkazový riadok (terminál) a overte si, že sa vám node ninštaloval korektne a viete ho spustiť. Spustite nasledujúci príkaz, mal by vám vypísať verziu Node.js:
node -v
Všetko funguje, super, poďme teda na to.
Ako aj v iných programovacích jazykoch, pokiaľ už existuje funkcionalita, ktorú potrebujete, v podobe nejakej knižnice, nebojme sa ju použiť. Pre Node.js existuje repository modulov, z ktorých si tie ktoré potrebujete viete stiahnuť do vášho projekty a volá sa NPM repository.
My pre našu aplikáciu budeme potrebovať:
Vytvorte si na disku adresár, v ktorom budete mať vašu aplikáciu a prepnite sa do neho v rámci príkazového riadku. Následne si zinicializujte npm príkazom:
npm init -y
Vytvorí sa vám súbor package.json
, ktorý slúži na popis vašej aplikácie a ukladanie informácie o nainštalovaných moduloch.
Parameter -y
zabezpečil, že sa vám vytvoril s defaultnými hodnotami. Môžete si ho nechať vytvoriť aj interaktívne, bez tohto parametra, vtedy budete musieť zodpovedať na pár otázok. Alebo si ho následne manuálne upravíte v textovom editore. Ale pre účely tohto cvičenia nejdeme do detailov a stačí nám vytvorený tak ako je.
Následne si chceme nainštalovať vyššie spomenuté moduly a chceme si informáciu o nich uložiť do package.json
, preto spustíme príkaz:
npm instal --save weather-js node-notifier
Tento moduly stiahne do adresára node_modules
a informáciu o nich uloží do package.json
, aby ste si v budúcnosti vedeli balíčky zreinštalovať, ak bude treba - keď adresár node_modules
na disku nebudete mať. Napríklad keď si ho zmažete alebo ako dôsledok toho, že tento adresár necommitujete do repository a repository si niekedy v budúcnosti vycheckoutujete.
V tom istom adresári si teraz vytvoríme náš skript, nazvať ho môžete index.js. Tak poďme teda na našu utilitku. Ako prvé si potrebujeme v našej aplikácii načítať modul weather-js
cez require:
const weather = require('weather-js');
Všimnite si použitie const z ES6, miesto tradičného var
. Premennú weather
totiž nebudeme meniť a tak môžeme použiť const
(mohli by sme použiť aj let
, ale const
je prísnejšie a nám viac vyhovuje).
V popise module weather-js
si pozrieme ako sa používa a zistíme, že obsahuje funkciu find
, ktorej prvý parameter je konfiguračný objekt (čo hľadáme, aký jazyk chceme použiť pre odpoveď, aké stupne chceme použiť) a druhý je callback, ktorý bude zavolaný.
Callback je funkcia, prijímajúca 2 parametre - err
a result
. Ak má err
hodnotu, došlo k chybe a mali by sme patrične zareagovať. Ak nemá hodnotu, výsledok (informácie o počasí) nájdeme v result. Takýto callback, kedy prvý parameter je informácia o chybe, je v Node.js veľmi bežný a volá sa Error-First Callback.
Prvá verzia nášho nástroju teda môže vyzerať takto, zatiaľ si všetko zapisujeme len do konzoly:
const weather = require('weather-js'); weather.find({ search: 'Bratislava', degreeType: 'C', lang: 'sk' }, (err, result) => { if (err) { console.log('Failed to fetch weather information', err); return; } if(!result.length) { console.log('No weather information for the requested location', result); return; } console.log('We got the weather information', result); });
Za všimnutie stojí použitie tzv. arrow functions, ďalšej novinky v ES6/ES2015
. Nemusíme sa už zdržiavať zapisovaním anonymných funkcií, ale tam kde sa očakáva callback použijeme arrow function. Okrem iných príjemných pozitív, ktoré teraz nepotrebujeme, tieto skracujú zápis a podľa môjho názoru aj sprehľadňujú kód.
Spustite si našu utilitku nasledovným príkazom:
node index.js
Ak máte pripojenie na internet a nič sa nepokazilo, mali by ste v príkazovom riadku vidieť odpoveď zo servera, s ktorou budeme ďalej pracovať.
Polovicu našej utilitky už máme hotovú a zatiaľ sme napísali 15 riadkov kódu. Šikovné, nie? Lenže, počasie zatiaľ len zapisujeme len do konzoly. Poďme si pridať notifikácie. Modul už máme nainštalovaný, stačí si ho v aplikácii načítať:
const notifier = require('node-notifier');
Zase sa pozrieme do dokumentácie, tentoraz tohto modulu, a dočítame sa, že na obyčajné zobrazenie notifikácie stačí zavolať funkciu notify
a predať jej konfiguračný objekt. Do neho v zásade stačí poslať title
a message
, dá sa však konfigurovať aj viac (podtitulok, ikonka, odkaz ktorý sa otvorí po kliknutí na notifikáciu, ...).
Podobne ako pri zisťovaní informácie o počasí, aj notifier.notify
prijíma ako druhý parameter callback funkciu, tiež Error-First Callback. Nás výsledok moc nezaujíma, stačí nám v zásade zareagovať na prípadnú chybu (zapíšeme do konzoly).
Jediné čo sa od nás očakáva je, že z informácie o počasí potrebujeme vyzískať zaujímavé informácie (formát odpovede si môžeme pozrieť v konzole, keďže do nej si ho logujeme) pre zobrazenie v notifikácii a nastaviť patrične title
a message
. Celý skrip našej aplikácie tak môže vyzerať nasledovne:
const notifier = require('node-notifier'); const weather = require('weather-js'); weather.find({ search: 'Bratislava', degreeType: 'C', lang: 'sk' }, (err, result) => { if (err) { console.log('Failed to fetch weather information', err); return; } if(!result.length) { console.log('No weather information for the requested location', result); return; } notifier.notify({ title: result[0].current.observationpoint, message: `${result[0].current.observationtime}: ${result[0].current.temperature}°${result[0].location.degreetype}, ${result[0].current.skytext}`, }, (error, response) => { if (error) { console.error('Got a notification center error:', error, response); } }); });
Možno ste si všimli tie zvláštne reťazce, uzatvorené v tzv. tickoch miesto úvodzoviek. Ďalšia novinka z ES6 - template strings. Pomáha vám, keď chcete reťazec vyskladať z rôznych premenných. V takomto type reťazca môžete mixovať text s výrazmi v JavaScripte, tie uzatvoríte do ${}
.
Spustite si aplikáciu, mala by sa vám zobraziť notifikácia. Gratulujem, úšpešne ste zvládli vašu prvú JavaScriptovú konzolovú aplikáciu. Príjemný pocit, nie?
Takáto aplikácia funguje, aj niečo zobrazuje, ale možno si ju budete chcieť zlepšiť. Aj ja som si. Moju verziu nájdete na githube, mám ju v crone a spúšťa sa mi každú hodinu.
Pokiaľ si ju chcete vylepšiť sami, tu je pár nápadov (všetky som si implementoval, takže sa stačí pozrieť na github, ak sa zaseknete):
Možností je veľa, utilita je to zaujímavá a tak sa s ňou môžete do sýtosti vyblbnúť. Zabavte sa!
Ak nechceš premeškať príspevky ako je tento, sleduj ma na Twitteri, alebo ak máš RSS čítačku, môžeš sledovať môj RSS kanál.