Jeg liker statiske nettsteder. For å være mer nøyaktig, liker jeg å bygge dem. Det er noe rent å sitte der foran skjermen; Det er bare deg og din tekstredigerer, skriver i vanlig gammel HTML og CSS.
Ikke misforstå, dynamiske steder er også morsomme. Gud vet at jeg er en fan av WordPress og brukervennligheten som det gir brukere. Statiske steder bringer meg tilbake, skjønt. Jeg husker å bytte fra WYSIWYG-programvare til en tekstredigerer. Jeg husker å effektivisere utviklingsprosessen med min første PHP-funksjon: inkludere. Det var gode dager, men i motsetning til så mange andre er de ikke alle borte.
Forskjellen er at nå kan vi gjøre det bedre. Forprosessorer som Mindre og sass kraftig forbedret opplevelsen av å skrive CSS. Vi har noen antall skriptspråk å blande inn i vår HTML, hvis vi velger det. Og så ... da gjorde folk noen veldig interessante ting.
Jeg har tidligere nevnt Hammer app for Mac. Det er en app som introduserer sine egne funksjoner og utvidelser til god gammel HTML, slik at du kan inkludere en fil som en del i en annen og andre gode ting. Den kompilerer resultatene til et vanlig statisk nettsted som kan være vert hvor som helst. Det har faktisk ganske mange funksjoner enn det, men denne artikkelen handler ikke om Hammer. Hvorfor? Den er bare tilgjengelig for Mac-plattformen.
Tast inn Harpe…
Det er ikke en app, det er mye mer. Det inkluderer preprosessorer for CSS. Det inkluderer templerende språk for HTML-dokumenter. Det er en mini-server som kan brukes til utvikling, eller omgjort til en faktisk produksjonsserver. Du kan bruke server-side JavaScript for å gjøre det til en full app, da den kjører på Node.js. Eller, hvis du ikke er programmerer, kan du bare bygge opp det statiske nettstedet ditt, og deretter kompilere det for å være vert andre steder.
Fordi det er basert på Node.js, er det kryssplattform. Det er også MIT lisensiert, så det er gratis. Du kan til og med gjøre endringer og omfordele eller videreselge den hvis du vil.
Nå har folk som har holdt øye med, lagt merke til at Harpe ikke er det eneste verktøyet i sitt slag. Mange mennesker skaper Node-baserte verktøy for å starte webprosjekter raskt. Mitt hovedproblem med disse er at de vanligvis antar at du vil bruke deres favoritt CSS-rammeverk, animasjonsbibliotek eller HTML-boilerplate. Harp gir ingen forutsetninger om koden du vil skrive. Det gir deg bare verktøyene for å skrive det raskere.
Husk at den må installeres og kjøre via kommandolinjen. Det er ingen GUI for dette. Men når du får det til å gå - og det er ikke vanskelig i det hele tatt - fordelene oppveier læringskurven.
Nå er jeg sikker på at de fleste av våre lesere er kjent med måtene som nettbransjen har forsøkt å forbedre på vanilje CSS. Når miniserveren for prosjektet ditt kjører, blir MINDRE, SASS og Stylus-filer automatisk samlet inn i CSS.
Samlingen er alltid tilfredsstillende raskt. I alle mine tester har endringer som er gjort på nettstedet mitt, samlet på den tiden det tar meg å lagre filen min, og oppdater deretter nettleseren min.
Også inkludert er jade og EJS. Disse er begge JavaScript-templerende språk som er laget for å hjelpe deg med å skrive / generere mer avanserte HTML-dokumenter med mer fleksibilitet. I utgangspunktet kan du bygge HTML-maler, og lagre det faktiske sidens innhold separat fra disse malene. Det er liksom å bruke et CMS, bare det er ingen database (med mindre du vil ha en), og du må skrive alt innholdet i ren tekstfiler.
Den virkelige fordelen er selvfølgelig kodevedlikehold, pluss alle de kule tingene som de faktiske programmører kan gjøre med den faktiske serveren og klientsiden JavaScript. Dette er også språkene som lar deg lage mer avanserte systemer, som blogger, alle relativt enkelt (igjen, hvis du har en programmerer på lønnslisten).
Hva er forskjellen mellom de to? Det handler for det meste om hvordan du foretrekker å skrive koden din.
EJS holder ting enkelt. Hvis du allerede kjenner HTML, er det bare et spørsmål om å legge til i EJS-spesifikke koder, slik som: <% inkluderer global / header%>. Hva gjorde jeg der? I utgangspunktet tok jeg bare HTML-koden for sidens overskrift fra en annen fil og importerte den til bruk i min hovedmal. Du kan selvfølgelig gjøre mye mer komplekse ting. Her er hva Harp dokumentasjonen har å si om EJS.
Jade tar en helt annen tilnærming til å skrive HTML helt. Det ser slik ut som vist på prosjektets hjemmeside:
bodyh1 Jade - node template engine#container.colif youAreUsingJadep You are amazingelsep Get on it!p.Jade is pretty cool,Alt blir oversatt til HTML og Javascript. Legg merke til inkluderingen av en if / else-setning midt i det hele, og avhengigheten av riktig innrykning.
Coffeescript er å JavaScript som Jade er til HTML. I utgangspunktet er det et forenklet format for å skrive JavaScript, som deretter blir samlet inn i vanlige ting. Som Jade, er det tungt innrykksavhengig, og faller mye av syntaksen.
Det ser ut som dette (et annet eksempel er skamløst kalt fra prosjektets hjemmeside):
math =root: Math.sqrtsquare: squarecube: (x) -> x * square xOg utgangen ser slik ut:
math = {root: Math.sqrt,square: square,cube: function(x) {return x * square(x);}};Nettstedene opprettet med Harp kan være vert hvor som helst, selvfølgelig. Det er verdt å nevne, at Harps skapere laget en hostingplattform spesielt utviklet for ting bygget med deres programvare. Prissettingen er ikke dårlig, og den integreres med Dropbox for enkle, automatiske oppdateringer på nettstedet ditt. Sjekk det ut her: www.harp.io
Harpe, med sine forprosessorer, templerende språk, ren fart og god plattform, er et solidt tillegg til en hvilken som helst designers verktøykasse. Jeg sier det er verdt læringskurven.