Blog

Ontwikkelomgeving

Wat heb je nodig om HTML en CSS te schrijven? In principe enkel een goede teksteditor, dat is alles. Maar natuurlijk komt er meer bij kijken.

De meeste ontwikkelaars werken met een framework, dit is niet noodzakelijk maar het maakt het allemaal wat gemakkelijker. Er zijn tientallen keuzes zoals Skeleton, Bootstrap en Foundation. Ik gebruik de laatste, Foundation van ZURB tezamen met Sass (Syntactically Awesome Stylesheets), een stylesheettaal.

Hieronder volgt een beschrijving van mijn ontwikkelomgeving.

Git

Git is een vrij gedistribueerd versiebeheersysteem. Git is oorspronkelijk gemaakt door Linus Torvalds voor de ontwikkeling van de Linuxkernel. Maar het kan gebruikt worden voor alle softwareontwikkeling. Een alternatief is Subversion.

sudo apt-get install git

Git is een CLI-programma (Command Line Interface), maar je kan gitg of een andere grafische omgeving gebruiken om het iets gebruiksvriendelijker te maken.

sudo apt-get install gitg

Node.js

Node.js is een softwareplatform waarop men applicaties kan ontwikkelen en draaien. Die applicaties worden geschreven in JavaScript, maar in tegenstelling tot veel andere Javascript-toepassingen, worden die niet uitgevoerd in een webbrowser, maar in de JavaScript-Engine van Node.js zelf, die op de server draait.

sudo apt-get install nodejs

Op Debian moet je nog een symbolische link toevoegen omdat er een naamconflict is met het node-pakket.

sudo ln -s /usr/bin/nodejs /usr/bin/node

We hebben ook nog npm nodig, een pakketbeheerder voor Node.js.

sudo apt-get install npm

Ruby

Ruby is een programmeertaal, die doorgaans wordt geïnterpreteerd. De taal is ontworpen om snel en makkelijk objectgeoriënteerd te programmeren. Ruby heeft ook verschillende mogelijkheden om tekstbestanden te verwerken en kan ook systeemtaken aan. We gebruiken het enkel voor dit laatste.

sudo apt-get install ruby
sudo apt-get install ruby-compass

Hoe begin je met Sass?
Het beste installeer je Foundation en Sass via de CLI.

sudo npm install -g bower grunt-cli
sudo gem install foundation

Als je rbenv gebruikt, een versiebeheerder voor Ruby, dan moet je na installatie je shims rehashen.

rbenv rehash

Hoe creëer je een Compass project?
Als Compass nog niet geïnstalleerd is, doe het nu.

gem install compass

Gebruik de Foundation CLI om een nieuw project aan te maken.

foundation new MIJN_PROJECT

Voilà, je project is aangemaakt. Van nu wordt het gemakkelijker.

cd MIJN_PROJECT

Bundler wordt gebruikt om zeker te zijn dat alle bibiotheken worden gebruikt. Als het nog niet geïnstalleerd is doe het nu.

gem install bundler

Voer dan Bundler één maal per project uit.

bundle exec compass watch

Hoe een Foundation project updaten?
Updaten is supergemakkelijk met Bower. Ga naar je projectmap via ‘cd’ en voer een ‘bower update’ uit.

bower update

Bluefish

Bluefish is een vrije editor voor webontwikkelaars. Alternatieven zijn Brackets, Atom, Sublime Text (niet gratis) enz.

sudo apt-get install bluefish

Koala

Koala is een grafische omgeving om LESS, Sass, Compass en CoffeeScript te compileren. Koala kan je downloaden op hun website.

Bronnen: Foundation ZURB en Wikipedia.


Andere artikelen

Het matroesjkaprobleem

Wanneer je nieuwe klanten zoekt zal je ongetwijfeld wat Zeldman het ‘Russian nesting doll problem’ of het matroesjkaprobleem tegengekomen. Iedere klant wil iets origineel en iedere klant wil dat je tenminste hetzelfde gedaan hebt voor vijf andere klanten.

Blue Beanie Day 2014

Verleden zondag was het Blue Beanie Day, de jaarlijkse hoogdag voor webstandaarden, voor het eerst bedacht door Douglas Vos die als inspiratie de cover van Zeldman’s boek ‘Designing with Web Standards’ nam.