Projecten
2023·Front-end engineer

Upgrade voorkant van het Nalatenschap portaal

Doorontwikkeling van een groot portaal met een micro-frontend architectuur naast een bestaande AngularJS codebase.

Angular 16Micro FrontendTypeScriptRequireJSGruntKarma

Het nalatenschap portaal is door de jaren heen uitgegroeid tot een uitgebreide, bedrijfskritische applicatie. Tienduizenden gebruikers per jaar doorlopen er een complex proces op een emotioneel zwaar moment in hun leven. De codebase reflecteerde die geschiedenis: een grote AngularJS-applicatie, op zichzelf nog stabiel en goed onderhouden, maar in toenemende mate een rem op snelheid en aantrekkelijkheid voor nieuwe ontwikkelaars.

De klassieke keuze in zo'n situatie is een big-bang herbouw. Voor een portaal van deze omvang is dat in de praktijk geen optie: te risicovol, te lang geen nieuwe waarde, en te veel kennis die alleen in de bestaande code zit. Als team kozen we daarom bewust voor een geleidelijke aanpak, waarin oude en nieuwe wereld langere tijd naast elkaar leven.

Mijn rol was de architectuur en implementatie van een micro-frontend opzet, gebaseerd op de bestaande AngularJS-codebasis met daarnaast Angular 16. Nieuwe schermen en functies worden in moderne Angular gebouwd; bestaande schermen blijven werken zoals ze zijn, totdat ze aan vervanging toe zijn. Het portaal beslist runtime welke versie het laat zien, zodat eindgebruikers er niets van merken.

Een micro-frontend integreren met een legacy SPA is technisch ondankbaar werk: routing, authenticatie, sessies, styling en state moeten naadloos blijven samenwerken. Ik heb veel aandacht besteed aan een schone scheiding tussen de schillen, een gedeelde authenticatielaag en een consistente styling-strategie, zodat we tegelijk konden doorbouwen op het oude en het nieuwe — zonder dat de twee elkaar kapot maakten.

Ook het build- en deployproces is opnieuw ingericht. Het oude project bouwde met Grunt en RequireJS; het nieuwe deel met moderne Angular tooling. We hebben een pipeline opgezet die beide werelden bouwt, test en samenvoegt tot één coherent artefact. Dat klinkt onspannend, maar zonder die discipline zou de micro-frontend juist meer fragiliteit hebben toegevoegd in plaats van weggehaald.

Het effect was direct merkbaar: nieuwe functies konden weer met plezier en in een hoog tempo gebouwd worden, en het team kreeg een geloofwaardig pad om de oude code stap voor stap te vervangen zonder de stabiliteit van het portaal in gevaar te brengen. Voor mij is dit een aanpak die ik graag vaker inzet bij langlopende projecten waar een herschrijving simpelweg niet haalbaar is.

Meer werk

Andere projecten