Mám rád statické stránky. Abych byl přesnější, rád bych je budoval. Je jasné, že tam sedíte před obrazovkou; je to vy a váš textový editor, psaní ve starých HTML a CSS.

Nechápejte mě špatně, dynamické stránky jsou také zábavné. Bůh ví, že jsem fanouškem aplikace WordPress a snadné používání, které uživatelům poskytuje. Statické stránky mě přivádí zpět. Vzpomínám si, že jsem přešel z softwaru WYSIWYG na textový editor. Vzpomínám si na zjednodušení vývojového procesu s mým prvním PHP funkcím: patří. Byly to dobré dny, ale na rozdíl od mnoha dalších, nejsou to pryč.

Rozdíl je v tom, že teď to dokážeme lépe. Předprocesory jako Méně a Sass výrazně zlepšila zkušenost s psaním CSS. Máme libovolný počet skriptovacích jazyků, které se můžeme promítat do našeho HTML, pokud si to vybereme. A pak ... pak lidé udělali nějaké opravdu zajímavé věci.

Už jsem se o tom zmínil Kladivo app pro Mac. Je to aplikace, která zavádí vlastní funkce a rozšíření do starého dobrého HTML, což vám umožní přidat soubor jako částečný do jiného a další dobré věci. Sestaví výsledky do pravidelného statického webu, který může být umístěn kdekoliv. Ve skutečnosti to má ještě několik funkcí, ale tento článek není o Hammeru. Proč? Je k dispozici pouze pro platformu Mac.

Zadejte Harfa…

Představujeme harfu

Není to aplikace, je to mnohem víc. Zahrnuje preprocesory pro CSS. Zahrnuje templikující jazyky pro dokumenty HTML. Jedná se o mini server, který lze použít k vývoji, nebo se změnil na skutečný výrobní server. Pomocí JavaScript na straně serveru jej můžete převést na úplnou aplikaci, protože se spouští na webu Node.js. Nebo pokud nejste programátor, můžete stavět statické stránky a pak je kompilovat pro hostování jinde.

Protože je založen na Node.js, je to mezi platformami. Je to také licence MIT, takže je zdarma. Můžete dokonce provádět změny a přerozdělovat nebo prodávat, pokud chcete.

Lidé, kteří ohlíželi, si všimli, že Harf není jediným nástrojem svého druhu. Spousta lidí vytváří nástroje založené na uzlech pro rychlé spuštění webových projektů. Mým hlavním problémem s těmito je, že obecně předpokládají, že chcete použít jejich oblíbený rámec CSS, animační knihovnu nebo HTML kotevní desku. Harf nepředstavuje žádné předpoklady o kódu, který chcete psát. Prostě vám dává nástroje, abyste je mohli rychleji napsat.

Myslete na to, že musí být nainstalován a spuštěn pomocí příkazového řádku. Na to není žádné grafické rozhraní. Ale jakmile to uděláte - a to vůbec není těžké - výhody převyšují křivku učení.

Nástroje

Předprocesory CSS

Jsem si jistý, že většina našich čtenářů je obeznámená se způsoby, jak se webový průmysl snažil vylepšit vanilkovou CSS. Pokud je spuštěn mini-server pro váš projekt, soubory LESS, SASS a Stylus jsou automaticky kompilovány do CSS.

Kompilace je vždy uspokojivě rychlá. Ve všech mých testech se změny provedené na mých webových stránkách shromáždily v době, kdy mi trvalo uložení souboru a následně obnovil můj prohlížeč.

Templikující jazyky

Také jsou zahrnuty Nefrit a EJS. Jde o jazykové šablony jazyka JavaScript, které vám pomohou při psaní / vygenerování pokročilejších dokumentů HTML s větší flexibilitou. V zásadě můžete vytvářet šablony HTML a ukládat skutečný obsah stránky odděleně od těchto šablon. Je to něco jako použití CMS, ale neexistuje žádná databáze (pokud nechcete) a musíte napsat celý obsah do souborů prostého textu.

Skutečnou výhodou je, samozřejmě, údržba kódu a všechny skvělé věci, které skuteční programátoři mohou dělat se skutečným java serverem a klientem. Jedná se také o jazyky, které vám umožňují vytvářet pokročilejší systémy, jako jsou blogy, všechny relativně snadno (znovu, pokud máte programátor na výplatní listině).

Jaký je rozdíl mezi těmito dvěma? Jedná se většinou o způsob, jakým chcete napsat kód.

EJS udržuje věci jednoduché. Pokud už znáte HTML, je to jen otázka přidání značek specifických pro systém EJS, například: <% include global / header%>. Co jsem tam udělal? V podstatě jsem chytil HTML pro svou hlavičku stránky z jiného souboru a importoval jej pro použití v mé hlavní šabloně. Můžete samozřejmě dělat mnohem složitější věci. Tady je to, co říká dokumentace Harfa o EJS.

Jade má velmi odlišný přístup k psaní HTML úplně. Vypadá to takto, jak je uvedeno na domovské stránce projektu:

bodyh1 Jade - node template engine#container.colif youAreUsingJadep You are amazingelsep Get on it!p.Jade is pretty cool,

To vše se přeloží do HTML a Javascriptu. Všimněte si zahrnutí příkazu if / else přímo uprostřed všeho a závislost na správném odsazení.

Coffeescript

Coffeescript je určen pro JavaScript, co je Jade pro HTML. V podstatě je to zjednodušený formát pro psaní kódu JavaScript, který se poté kompiluje do běžných věcí. Stejně jako Jade, je to silně závislé na odsazení a hodně syntaxe.

Vypadá to takto (jiný příklad nehanebně zdobený z domovské stránky projektu):

math =root:   Math.sqrtsquare: squarecube:   (x) -> x * square x

Výstup vypadá takto:

math = {root: Math.sqrt,square: square,cube: function(x) {return x * square(x);}};

Nástupiště

Webové stránky vytvořené s Harpem mohou být hostovány kdekoli, samozřejmě. Za zmínku stojí, že tvůrci Harpy vytvořili hostitelskou platformu speciálně určenou pro věci postavené s jejich softwarem. Ceník není špatný a integruje se se službou Dropbox pro snadné automatické aktualizace vašeho webu. Podívejte se sem: www.harp.io

Závěr

Harfa, se svými preprocesory, templářskými jazyky, naprostou rychlostí a dobrodiní mezi platformami, je pevným přírůstkem všech nástrojů návrháře. Říkám, že stojí za to učení.