přejít na obsah přejít na navigaci

Linux E X P R E S, Harp server – rajská hudba pro kodéry

Harp server – rajská hudba pro kodéry

harp_logo.png

Vytváření webů se stalo vědou stejně jako běhání nebo jídlo. Aby byl web účinný, pěkný a funkční, nemusí být na pozadí přecpaný funkcemi. Ohromná část stránek vůbec nepotřebuje databázi, administrační rozhraní nebo uživatelské účty. Statické weby a jednoduchá řešení zase získávají na popularitě. Když se pak objeví něco jako Harp, nezbývá než jásat.


Nějak patří ke koloritu, že se i ty nejjednodušší stránky zřizují se vším všudy, protože se to tak prostě dělá. Technicky vzato je to často zbytečný komfort v místě, kde ho nikdo nevyužije. A tak se i technicky vyloženě primitivní stránky pro zemědělce nebo keramika staví na WordPressu nebo Joomle, blogy dokonce na Rails.

Technologie související s webem se stále dramaticky vyvíjí. Už nemáme jen HTML, CSS a JavaScript, už nám nestačí jen Apache. Doba přeje responzivnímu webu, reaktivním aplikacím doručujícím data všemi směry, single-page aplikacím (už ani ne stránkám).

Pomalu jakoby se vytrácela elegance a jednoduchost původních nástrojů webu sdělujících informace. A přece lze tu a tam narazit na velmi promyšlené nástroje, které berou jednoduchost a radost z tvorby jako základ. Situace může připomínat sílící poptávku po ručně kovaných nožích v době, kdy je zdánlivě nikdo nepotřebuje.

Pokud potřebujete vytvořit blog nebo jednoduchou stránku, případně i web střední velikosti bez zbytečných fičur na pozadí, určitě dejte šanci Harpu.

Harp je server postavený na Node.js a slouží naprosto a jedině k hostování statických stránek. Má ale řadu tak pěkných schopností, že na něm rozjedete i stránky zdánlivě dynamické (třeba právě blog). Přitom je vše stále velmi jednoduché, konfigurace je hračka. Oproti jiným řešením (např. Sinatra, Rails) má tu výhodu, že ho můžete rovnou vystavit provozu, load balancery typu Nginx nebo Apache nejsou nutné.

Oproti řešením využívajícím k hostování statických stránek přímo mamuty typu Nginx nebo Phussion Passenger má sice výkonnostní schopnosti menší, vynahradí to však mnoha možnostmi skvělými pro kodéry front-endu. (A co si budeme povídat, reálná návštěvnost webu nás v tomto ohledu nemusí moc zajímat, pokud nepočítáme s tisíci konkurenčních připojení v ten samý okamžik.

Instalace

Pro instalaci potřebujete jen npmNode. Příklady z Ubuntu:

sudo apt-get install nodejs // instalujeme stabilní verzi Node.js

sudo apt-get install npm // instalujeme package manager pro Node.js

sudo npm install -g harp // instalujeme Harp server

V tuto chvíli máme všechno připraveno, nic víc není třeba.

Začínáme

Před započetím práce máte možnost použít inicializaci projektu (získáte tak skromný boilerplate na rozjezd):

harp init mujprojekt

Základní struktura defaultního projektu:

mujprojekt/
  |- _layout.jade
  |- 404.jade
  |- index.jade
  +- main.less

Samotné spuštění serveru je pak triviální:

harp server --port 9000

Máme zde také pěknou provázanost s GitHubem. Pokud použijeme:

harp init myproject --boilerplate user/repozitar

Harp je schopen stáhnout si připravený boilerplate přímo z vašeho repozitáře a použít ho jako základ projektu. To je velká výhoda, pokud používáte při tvorbě stále tytéž základní kostry stránek.

Schopnosti

Jak bylo možné tušit z ukázky rozložení defaultního projektu, hlavní devizou Harpu je především široká podpora většiny oblíbených preprocesorů (Sass, Less, Jade, Stylus, EJS atd.) vedle nichž nechybí ani podpora Markdownu. Při práci potom jednoduše v hlavičce nebo odkazu nalinkujete soubor daného preprocesoru nebo Markdownu, jen použijete koncovku .css (preprocesory), případně uvedete v odkazu jen cestu (Markdown).

Harp zařídí jak překlad, tak minifikaci. Tzn. pokud vytvoříte stránku třeba http://mujprojekt.cz/clanky, cesta povede k souboru clanky.md. Pokud uvedete cestu href="/css/custom-layout.css", Harp najde ve složce buď čisté CSS, nebo do něj rovnou převede soubor pro Less, který mu tam připravíte.

U preprocesorů se pak vůbec nemusíte starat o instalaci nebo provoz. To je právě vlastnost, která vám dovolí v lecčems simulovat dynamický web. Samotný server totiž hlídá strukturu projektu (rozložení složek) a pokud je vše správně nastaveno, můžete v určitém smyslu napodobit i databázi. Pak už jen v EJS nebo třeba Jade zobrazíte dotazem nad řadou (Array) jednotlivé příspěvky pod sebou.

Stejným postupem můžete vytvořit sitemap nebo rss feed. Nutno podotknout, že v tomhle ohledu má projekt vynikající dokumentaci (s řadou velmi povedených receptů). Server se při orientaci v projektu řídí jak rozmístěním složek, tak názvy souborů (ty s podtržítkem nebudou „servírovány“) a metadaty uvedenými v konfiguračních souborech (JSON).

Na první pohled se to všechno může zdát trochu komplikované, ve skutečnosti se jedná o několik zásad, které stačí dodržet. Pak lze kombinovat a tvořit podle libosti. Omezením je spíš vlastní fantazie.

S preprocesory je důležité zmínit ještě slušnou řádku funkcí užitečných pro samotný vývoj. Tady najdete jak práci s metadaty, partials, current.path, možnost správy více projektů pod jednou stránkou (vyvíjíte 4 weby a přistupujete k nim přes jednu přehlednou stránku) až po velmi zajímavou schopnost celý projekt převést (zkompilovat) ze semi-dynamické podoby do podoby čiště statické, pokud se rozhodnete stránky hostovat někde bez Harpu. V dokumentaci nechybí návody na deployment projektu na Heroku, Microsof Azure, GitHub nebo nativní Harp Platform.

harp compile myapp

Tuhle možnost využijete třeba u přípravy aplikací/stránek pro Apache Cordova nebo třeba PhoneGap. Dostanete rovnou strukturu připravenou pro použití:

mobileapp/
  +- www/
    |- index.html
    +- main.css

Stejná možnost se dá používat k zálohám! Jak bylo uvedeno, projekt nabízí i vlastní hostování.

Pokud u Harpu využíváte pokročilejší schopnosti, leckdy máte pocit (co se front-endu týče), že pracujete s plnohodnotným frameworkem na pozadí. Stejně jako v Expressu nebo Sinatrovi používáte uvedené partials, current.path, máte přehled v metadatech a metainformacích o jednotlivých stránkách, můžete dokonce použít jednoduchou autentizaci (není založena na databázi).

Samozřejmě se ale nevyhnete určitým limitům. Např. pro formuláře nebo diskusní přízpěvky pod články musíte využívat komponenty třetích stran (Wufoo, Formspree, Disqus). A pokud si rozumíte s řešeními typu Firebase nebo Ember apod., můžete se samozřejmě rozmáchnout podle potřeby.

Zajímavou možností je také použití Harpu coby middleware třeba pro Express.js nebo Sails, a to hlavně kvůli podpoře preprocesorů.

Shrnutí

Pokud rádi (a rychle!) kódujete, máte vlastní stránku nebo o ní uvažujete a nevadí vám práce s trochou toho Javascriptu (která ale není vůbec nutná!), Harp si užijete. Je skvělý pro malé weby, blogy, nabídkové listy, single-page weby, jako aplikace pro rychlý prototyping nebo práci na front-endu odděleně od back-endu. Pokud máte vlastní projekt běžící na některém Node frameworku a potřebujete servírovat statické stránky s podporou preprocesorů, také nebudete litovat.

Nahoru

Příspěvky

Harp server – rajská hudba pro kodéry
___ 5. 10. 2015, 03:44:56
Odpovědět  Odkaz 
naprogramujte jednoduchy editor stranok, najlepsie priamo do prehliadaca, aby si ludia sami vytvorili webstranku, pripadne dokument ... na 90% prace staci jednoduchy editor aky sa pouziva napr. pri cms ... ludom pride pohodlnejsie casom vytvorit stranku alebo dokument priamo v prehliadaci ako znoa startovat word ci inu haluz ... ak sa k tomu prida formatovanie stranok na A4, co nema v optimalizacii ziadna stranka ci prehliadac, a tie sa citaju ovela lepsie ak su formatovane klasicky na A4 /skuste si vytlacit nejaku webstranku, nevyzeraku vabne ak si ju chcete neskor precitat ako dokument trebars v pdf/ ... video je uz dostupne, hudba tiez, pridat jednoduchy spreadsheet, jednoduchy eshop, mail a casovac na pripadnu prezentaciu a zabali sa to ako html do zipu aby to bol jeden subor ... tym sa oddeli profesionalna tvorba dokumentov do aplikacii ktore su na to urcene ... a nemusia sa stavat x-megove aplikacie ktore maju v sebe vsetko mozne az je to neprehladne ... myslim, ze s tymto konceptom proste 99% veci si budu ludia vytvarat v prehliadacoch a pochopia to intuitivne a ak to bude vyzerat normalne aj pri vytlaceni na papier, alebo v citacke ... 90% prace prejde na html ... a profesionalne veci ostanu na profesionalne nastroje
---
zaxs
Harp server – rajská hudba pro kodéry
NULL 5. 10. 2015, 11:35:31
Odpovědět  Odkaz 
No jo, takové nástroje existují roky, jen ne přímo v prohlížeči a zapnout místo prohlížeče editor všewebu a prohlížeč zas takový problém není.Problém je jinde.
Když použiji metaforu z článku s noži a kovárnou, tak je to jako kdyby jste řekl, že když budou na každém rohu kovárny, a nachystané obrobky, lidé si vykovou nože sami. Zábava by to byla, ale co čas, cena (i s ušlým ziskem v původním zaměstnání) a kvalita? A co s lidmi, kteří na toto zruční nejsou?
No, předpokládejme, že to rozšíření máme.Začnu tvořit stránku. Byla by potřeba analýza konkurence a stanovení míry vhodného řešení i s ohledem na cenu. Aha. To abych se naučil dělat analýzy a poznal alespoň shůry možná řešení. Nebo na to nemám, neumím, nemám čas nebo to nechci umět. Mám teda - . Pak začnu tvořit web. Aha. Chtělo by to hezký banner. To abych se naučil něco o grafickém designu aneb bez talentu ... Když ne, mám - .A pak to začne. Co na pozadí? Obrázek? Hm, na mobil supr věc. A co tlačítka? kolik, kam, jaké? Úvod stať a závěr? Ha ha ha. A co obsah, Stávám se editorem. Ne? Mám - . A nakonec zjistím, že chci kontaktní formulář ... a to už mohu jít k vývojáři. A dále: co hosting, správa mailů, doména, údržba, optimalizace pro prohlížeče? Nedovedu si představit obecným algoritmem ošetřovat vše, co může takový bastlič jako já ve fiktivním případě v prohlížeči napáchat a co to pak udělá v IE 9 + a nebo to překopu algoritmem na "správně", ale zachová to vzhled jak ho uživatel zadal? Neroztáhne se mi pár objektů nebo nesmrští? ..............
Z článku to tak nevyznělo, tam to bylo jenom jmenováno. Neznám všchny řešení, znám wordpress a wordpress je podle mne shit. Starý bastl. Ale má některé funkcionality, které jsou jinde nevídané. Třeba post_types a s nimi svázané taxonomie a tagy. Bez nějakého dlouhého mučení. Nebo fungující vestavěný editor uploadů obrázků a taky vychytaný editor textu. Paráda. Jinde za draho. Stáhnete šablonu, 2 kliky a publikujete i s blogem. Vývojář má takový webík za chviličku, tím pádem "za hubičku". S pluginy a skvělou dokumentací je to silný nástroj jak pro amatéry, tak profíky, udělat se tam dá fakt hodně. Po programátorské stránce ale wordpress mé oblíbené ferrari není ;-)
To co je v článku, je jen další default server na node.js, akorát neudělal default složky pro moduly gruntu a boweru či alternativ, a místo složek css a js, případně asset, jen main.css. No proč ne.
Ale pokud chce někdo jen doménu a začít blogovat, propagovat se, tak ať jde třeba na Wordpress.com, tam jsou cloud blogy a to je opravdu hned. Jen chybí ta šablona, ale tu bude od profesinála potřebovat každý, kdo to má v hlavě aspoň trochu srovnané.
Harp server – rajská hudba pro kodéry
_____ 7. 10. 2015, 00:24:23
Odpovědět  Odkaz 
vseweb a nevie analyzu? .... tych 22 ikoniek by sa pokusom omylom naucil kazdy za 22 minut

Přidat názor

Nejsou podporovány žádné značky, komentáře jsou jen čistě textové. Více o diskuzích a pravidlech najdete v nápovědě.
Diskuzi můžete sledovat pomocí RSS kanálu rss



 
 

Top články z OpenOffice.cz