Honderden developers komen op 12 september live bij elkaar tijdens de Tweakers Developers Summit 2023. Het programma beslaat zes tracks: AI, Frontend, Backend, Security, Smarthome en DevOps. Tijdens die laatste track gaan Chris en Maarten van de politie dieper in op ‘Tokens, Components en Wrappers’. Zij werken aan het interne Design System. Met welke uitdagingen hebben ze te maken gehad en hoe hebben ze die getackeld?
Met bijna twee decennia ervaring als webdeveloper, heeft Maarten Dekker in 2020 de overstap gemaakt van designbureaus naar Capgemini en zich volledig toegelegd op front-end. Hij werkt inmiddels anderhalf jaar voor de politie aan Blauwdruk, het interne design system. Op de Dev Summit spreekt hij samen met Chris van Schayk, die een achtergrond in UX en front-end heeft. De laatste jaren is hij vooral actief met design systems. Met een voorliefde voor CSS en alles gerelateerd aan styling probeert Chris de wereld van de politie gebruiksvriendelijker te maken met elke dag een nieuw generiek component.
Blauwdruk met Angular
In 2021 was de Tweakers Developers Summit volledig online. Daar gaf de politie al een inkijkje in Blauwdruk. Het idee voor het interne design system ontstond met als doel alle technische wijzigingen op één centrale locatie bij te houden, gecombineerd met ontwikkelingen op het gebied van UX. Dit leidde tot een meer gestroomlijnd ontwikkelproces, waarbij generieke componenten beschikbaar zijn voor alle ontwikkelteams. Dankzij Blauwdruk hoeft men de kwaliteit slechts één keer te waarborgen en één keer te distribueren, waarna alle teams het systeem kunnen benutten.
In eerste instantie werd Blauwdruk gebouwd met Angular Material, maar het team stuitte op incompatibiliteitsproblemen tussen verschillende Angular-versies die in gebruik waren bij andere projecten binnen de politie. Om deze problemen op te lossen, stapte het team over op StencilJS om webcomponenten te ontwikkelen.
Meer inclusief
Inmiddels zijn we twee jaar verder en wordt het systeem door veel teams dagelijks gebruikt. “Dat moet ook wel”, lacht Chris. “Bij de politie is een heel groot scala aan IT-projecten, volgens mij meer dan 260. Blauwdruk is op dit moment een componentenbibliotheek, waar een hele lijst van componenten in staat, die door al die projecten kunnen worden gebruikt. De reden waarom we dat doen is om de agent op straat te voorzien van een consistente gebruikservaring en betrouwbare software. Maar ook omdat we dezelfde huisstijl gebruiken en willen voorkomen dat die componenten op verschillende plekken opnieuw worden gebouwd. Daarmee willen we voorkomen dat het wiel overal opnieuw wordt uitgevonden. De componenten die we bouwen zijn webcomponenten. Oftewel, uitermate geschikt voor web-based technologieën, maar niet voor alle IT-projecten binnen de politie. Ons doel is om iedereen mee te nemen en een bijdrage te leveren aan alle projecten en hun eindgebruikers. Met die gedachte hebben we een extra laag toegevoegd aan ons designsysteem. Dat zijn de design tokens, het fundament onder de webcomponenten.”
“Vervolgens behandelen we op de Summit de webcomponenten en bespreken we de uitdagingen en keuzes die we daarbij hebben gemaakt”, vervolgt Chris. “We bekijken bijvoorbeeld hoe componenten moeten worden opgedeeld. Hoe we omgaan met lifecycle methods in combinatie met afnemende frameworks en hoe we dit alles onderhoudbaar houden. We willen ervoor zorgen dat de componenten herbruikbaar blijven voor diverse technologieën.”
Een tweede extra laag die het team achter Blauwdruk heeft toegevoegd, zijn de zogenaamde ‘wrappers’. Deze laag is bedoeld om front-endontwikkelaars, met andere frameworks, te helpen. “Als je bijvoorbeeld met Angular of React werkt ben je gewend aan een specifieke schrijfwijze die kan afwijken van de webcomponent-manier. De wrappers helpen hierbij. We willen de implementatie van ons designsysteem namelijk zo toegankelijk mogelijk maken voor ontwikkelaars”, vertelt Chris.
Hoe de wrappers in de praktijk werken? Tijdens hun talk gaan Chris en Maarten dieper in op dit onderwerp en lichten ze ook toe hoe ze de techniek toepassen op Angular, React en Vue.
Designsysteem binnen de politie
Werken voor de politie doet Chris met volle overtuiging: “Wat onze rol extra mooi maakt is het feit dat we met een klein team grote impact kunnen maken op de organisatie. Bij de politie werken 65.000 mensen, met als hoofddoel zorgen voor een veilig Nederland. Met onze aanpak kunnen we de doorlooptijd van ontwikkeling verkorten en ervoor zorgen dat de agent op straat herkenbare, bruikbare en betrouwbare software heeft om mee te werken, samen met onze collega’s die gebruik maken van Blauwdruk.”
Meer informatie over wat de politie doet op het gebied van IT en open vacatures vind je hier.
De allerlaatste kaarten voor de Tweakers Dev Summit 2023
Geïnspireerd geraakt, maar nog geen kaartjes voor de Summit in huis? Het vindt plaats op 12 september in DeFabrique in Utrecht. De laatste reguliere tickets (299 euro) en tickets voor studenten voor slechts 75 euro zijn nog te koop. Als je werkgever de tickets betaalt, ontvang je een factuur voor de administratie. Goed om te weten: we delen geen persoonlijke gegevens met partners.
Wil je meer informatie over de Developers Summit 2023? Klik dan op onderstaande button.
Dit artikel is geen redactioneel artikel, maar gesponsord en tot stand gekomen dankzij de politie en Tweakers Partners. Tweakers Partners is de afdeling binnen Tweakers die verantwoordelijk is voor commerciële samenwerkingen, winacties en Tweakers events zoals meet-ups, Developers Summit, Testfest en meer. Bekijk hier het overzicht van alle acties en events. Mocht je ideeën met ons willen delen over deze vorm van adverteren, dan horen wij dat graag. Hierover kun je met ons in gesprek via [Discussie] Reclame algemeen].
/i/2005930376.png?f=fpa)
:strip_exif()/i/2004361952.jpeg?f=fpa)
:strip_icc():strip_exif()/u/1941118/crop645b97f8dae97_cropped.jpg?f=community){kind=small}