Onderwerp: Front-end apprentice: welke competenties te leren?
Sinds gisteren hebben we bij 80beans drie maanden lang een "apprentice" in het kader van de eerste stappen in een experimenteel apprenticeship program. Dit is geen stage: er is geen beoordeeling na afloop en er is geen eindresultaat waarop een apprentice afgerekend gaat worden. Het gaat puur om het leren van nieuwe en verbeteren van bestaande competenties.
We gebruiken voor de ontwikkeling van deze competenties geen werkzaamheden die op het kritieke pad van het ontwikkelingsproces liggen. Het moeten voldoen aan deadlines legt zeker in het begin te veel druk op de apprentice. We werken daarom op basis van bestaande, eerder gerealiseerde projecten. We hebben er rond de 100 op de plank liggen, variërend van simpele one-page designs tot complexe apps waarvan het nadenken over de front-end architectuur alleen al dagen gekost heeft. Op basis van de competentie waaraan gewerkt gaat worden kiezen we in overleg een passende case.
Als je je afvraagt waar ons voordeel zit, dan is het antwoord heel simpel: op de korte termijn is dat er niet. We betalen geen salaris, maar wel een onkostenvergoeding. Daarnaast zorgen we voor een nieuwe Macbook Air die de apprentice in bruikleen krijgt. Omdat er niets wordt geproduceerd wat in productie gaat en er regelmatige begeleiding nodig is kost het alleen geld. Het programma daarop afrekenen zou echter kortzichtig zijn. Er is een schrijnend tekort aan gekwalificeerde front-end developers en de enige manier waarop we daar als industrie iets aan kunnen doen is door in praktijkgerichte opleidingen te voorzien. Onze apprentice is na afloop van deze drie maanden niet verplicht om een contract bij 80beans te tekenen; als ze ergens anders naartoe wil dan is dat geen probleem. Ook in dat geval hebben we ervoor gezorgd dat de wereld een stukje beter is geworden.
Na deze lange introductie volgt de vraag: Wat moet een apprentice allemaal leren?
Zelf heb ik onderstaande lijst opgesteld, die zowel over puur front-end (HTML, CSS & JavaScript) gaat alsmede over competenties die daarnaast nodig zijn om binnen een team en een bedrijf te kunnen functioneren. Ik ben erg benieuwd naar wat jullie hiervan vinden en wat je eventueel mist. In een periode van drie maanden kunnen we niet overal even diep op ingaan, maar ik wil onderstaande allemaal voldoende raken. NB: Sommige van deze zaken zijn specifiek voor ons bedrijf en onze toolset.
Dit is erg veel en wellicht niet haalbaar in drie maanden tijd, afhankelijk van snelheid van begrip, focus, etc. Evaluatie echter pas achteraf.
Front-end skills
- Structuur en semantiek van een document bepalen op basis van een grafisch ontwerp
- Toepassen van deze structuur in HTML5 (m.b.v. Haml)
- Begrip van specificity, document flow, floats en positioning
- Toepassen van het ontwerp op deze structuur in CSS3 (m.b.v. Sass & Compass)
- Bepalen welke elementen in een ontwerp modulair herbruikt kunnen worden
- Begrip van retina (high DPI screens), responsive design en "mobile first"
- Toepassen van CSS voor retina
- Toepassen van responsive design
- Begrip van (perceived) front-end performance
- Toepassen van een deel van de Y!Slow regels t.b.v. front-end performance
- Debuggen m.b.v. web inspector
- Toepassen van cross-browser compatible code (moderne browsers)
- Enige ervaring met testen op mobiele apparaten (uit ons device lab)
- Beperkte kennis van browserspecifieke problemen (alle IE's)
- Beperkte kennis van JavaScript zonder libraries
- Toepassen van jQuery in alledaagse taken met begrip van performance
Andere skills
- Begrip van "het internet": DNS, HTTP, server, asynchrone requests, back-end, front-end
- Effectief gebruik kunnen maken van versiebeheer (Git)
- Gebruik kunnen maken van Terminal (command-line interface) voor dagelijkse taken
- Kunnen werken in een groter project met een templating taal (in ons geval Rails m.b.v. Haml en Rails helpers)
- In kunnen schatten hoeveel tijd werkzaamheden gaan kosten
- Communicatie naar externe partijen over de (on)mogelijkheden in een grafisch ontwerp en het kunnen verwoorden van alternatieven
- Samen kunnen werken met front-enders en andere disciplines (UX, UI, grafisch, back-end, klant)