DrupalCon Barcelona 2015 - Front-end team

4 min.

Lees hieronder de belevenis van DrupalCon 2015 Barcelona door de ogen van een Front-end developer.

Hoe was DrupalCon 2015 nu voor een front-end developer?

Bij iedere presentatie of gesprek met een conculega leert u sowieso nieuwe zaken bij. De locatie van DrupalCon Europa was dit jaar in het zonnige Barcelona. Als u het mij vraagt, waren de voorbije dagen zeker en vast de moeite waard. 

Wat ik voornamelijk onthouden heb op DrupalCon 2015:

Component driven design & development

Een website moet u bezien als allemaal losse componenten die één groot geheel vormen waarbinnen zich nog een hele groep kleinere componenten bevinden. Een mooi voorbeeld en een diepere uitleg kan u vinden op Pattern lab. Hier kan u zien hoe pagina's uit templates bestaan, templates uit organismes, organismes uit moleculen en moleculen uit atomen. Deze manier van werken zorgt ervoor dat u een modulair systeem ontwikkelt. U hoeft dus slechts éénmaal de CSS voor een select box of een foutmelding bericht te creëren aangezien deze er overal hetzelfde uitzien. Hierbij kunt u ook nog gebruik maken van methodes zoals BEM (Block Element Modifier). Dit zorgt ervoor dat u herbruikbare elementen maakt en dat u duidelijke class names gebruikt. Vergeet wel niet dat Drupal standaard geen deftige mark-up voorziet. Men spreekt dan ook over ‘divitis' en ‘classitis' binnen Drupal, hiermee bedoelt men dat er zeer veel div's binnen div's aanwezig zijn, dat er enorm veel classes opstaan en dat er zeer veel div's en classes niet eens gebruikt worden. Gelukkig werd dit opgelost binnen Drupal 8.

Stijlgids

Een stijlgids wordt ook meer en meer gebruikt binnen de front-end wereld. Maar wat is een stijlgids nu? Opnieuw is dit een overzichtelijke verdeling van de gebruikte componenten op de website. U definieert bijvoorbeeld de CSS van de input velden, van de submit knoppen, van de navigatie, enz. Hierin plaatst u in commentaar de gewenste mark-up erbij. Als voordeel geeft dit dat iedere persoon die aan het project werkt snel zijn weg kan terugvinden. Ook voor de developer die de mark-up moet aanpassen is dit dus zeer handig. Voorbeeld KSS (Knyle Style Sheets)

Automation binnen front-end

Automation is zeer belangrijk op front-end vlak. Vandaag schrijven we niet alles zelf meer of voeren we bepaalde taken niet meer handmatig uit. Nu gebruiken we precompressors zoals bv. SASS waardoor u variabelen kan aanmaken of herbruikbare componenten kan definiëren waardoor u veel tijd kan uitsparen. Natuurlijk dient u dan ook gebruik te maken van een task runner zoals Gulp of Grunt om de SASS te compileren, de afbeeldingen te compressen, enz. Nog meer interesse in automation? Bekijk dan zeker ook even Bower, hiermee kunt u snel en overzichtelijk folderstructuren beheren.

Grid framework

Nog een handige tool tijdens de theming van een website is een grid framework. Naast Susy is er nu ook een new kid on the block, namelijk Singularity. Dit is een responsive grid framework die toch wel een reeks extra mogelijkheden biedt tegenover zijn concurrent, de moeite waard dus om eens te bekijken.

Drupal 8 template

Drupal 8 theming verandert compleet dankzij Twig, een nieuwe template engine die eraan zit te komen. Voor vele onderons zal dit in het begin zeker even wennen zijn, eenmaal u er echter met weg bent biedt de tool niets anders dan voordelen:

  • Propere HTML
  • Sneller compileren 
  • Veiliger 

Samenwerken

Als laatste wil ik het nog even hebben over samenwerken in teams. Of het nu met collega's, freelancers of met meerdere bedrijven is, we blijven één team. Dit wil zeggen dat we alles goed moeten afstemmen zodat we allemaal op dezelfde golflengte zitten. Verder moeten we aan quality control doen om te kijken of alles wel in orde is. Dit mag u niet bekijken als kritiek hebben op elkaar maar eerder als een hulpmiddel waar ieder van ons uit kan bijleren. Iedereen weet namelijk wel iets dat de andere persoon nog niet wist.

Oja, niet te vergeten volgend jaar is de Europese DrupalCon in Dublin. Hope to see you there.