Välkommen till whr.se, recensioner av webbhotell. I denna avdelning publicerar vi guider och artiklar runt webbteknik, programmering och marknadsföring på Internet bland annat.

Skriv mindre kod, utför mer

I den här artikeln går jag igenom några språk som gör att man inte behöver skriva så mycket kod. Mindre kod ger bättre struktur och överblick, vilket i sin tur innebär färre fel och snabbare arbetsgång.

CSS

CSS står för Cascading Stylesheet och är till för att designa upp HTML-element. Det är ett sätt att separera design och layout från innehållet. I grunden är CSS ett bra lättläst språk, men vissa viktiga bitar saknas.

Några exempel på vad som saknas i CSS:

  • Variabler – Du kan inte sätta variabeln ”Red” till ”#ba0000”.
  • Nästlade taggar – Jag återkommer till det i avsnittet om LESS
  • Matematiska beräkningar – Du kan inte skriva blue + yellow och hoppas på att få en grön färg som resultat.

LESS

Jag personligen använder LESS i mitt dagliga arbete. Att jag inte kan klara mig utan LESS beror på flera saker. Främsta anledningen är att det ger en mycket bättre överblick då man kan nästla taggarna.

Några fördelar med LESS:

  • Nästlade taggar, se skärmdumpen nedan.
  • Här finns stöd för variabler och det påminner lite om PHP i kombination med CSS.
  • Man kan använda matematiska formler. Det är bra när man behöver ändra på exemepvis en bredd och inte vill ändra på alla andra bredder som är beroende av den.
  • Vill man ha en specifik färg men något ljusare behöver man inget bildbehandlingsprogram. LESS fixar det genom att man anger en procentsats.
  • Det är lätt att lägga till LESS, bara inkludera en Javascriptfil. Vill man köra på serversidan går det också bra. Till WordPress finns exempelvis pluginet WP Less.

less

SASS

Det här språket är föregångaren till LESS. Skaparna bakom LESS har blivit kraftigt inspirerade av SASS och beslutade sig för att skapa ett eget språk som skulle komma att bli LESS. Vad som SASS saknar till skillnad från LESS är bakåtkompabilitet mot vanlig CSS. Skaparna bakom LESS anser att den här typen av ”ramverk” bara ska vara en förlängning av CSS, inte en omskrivning av det.

Jag förespråkar LESS framför SASS eftersom det är 100% bakåtkompatibelt mot CSS, samt är nytt och modernt.

sass

HTML

Går det då att skriva HTML på något annat sätt än hur det görs normalt sätt? Ja, det finns minst ett språk som kan tillämpas och det kallas för HAML.

HAML

Som jag beskrev tidigare så gör LESS att CSS blir mer likt HTML, då vi i CSS med LESS kan skriva nästlade taggar. Med HAML blir HTML, åt andra hållet, mer likt CSS. Här använder man punkt för klass och hashtagg för ID, precis som man gör i CSS. Jag har inte grävt så djupt i språket och kommer därför inte att ta ställning till hur pass bra det är.

haml

Javascript

jQuery

Det här är antagligen världens mest använda Javascript-ramverk. Förutom en mängd funktioner finns här också sätt att skriva mindre kod. Med mindre kod får man bättre överblick och arbetar snabbare. Man letar med jQuery upp klasser på samma sätt som man gör i CSS. Attribut hämtas genom punkt för klass, hashtagg för ID och så vidare. Det är därför riktigt smidigt att navigera sig i DOM-trädet.

jquery

CoffeeScript

Om man inte nöjer sig med jQuery utan vill få ner koden i storlek ännu mer finns CoffeeScript. Med detta språk skriver man en mycket kort syntax för vad man ska utföra. Det är kompatibelt med exempelvis jQuery och andra ramverk. Man kan se det som lager ovanpå alltihop som kompileras till jQuery där jQuery sedan kompileras till Javascript.

coffeescript
Har du några fler tips på språk som innebär att du behöver skriva mindre kod? Lämna gärna en kommentar och berätta!
Publicerad 2013-05-01. Kategori Programmering.


Skriv en kommentar eller en fråga

This blog is kept spam free by WP-SpamFree.