TypeScript gebruik ik voornamelijk wanneer een JavaScript-applicatie groter wordt en ik meer structuur wil afdwingen. Het blijft uiteindelijk JavaScript, maar met een type-systeem erbovenop dat veel fouten eerder zichtbaar maakt en code explicieter maakt.
Mijn achtergrond ligt sterk in Java en Kotlin. Daardoor voelt het werken met expliciete types voor mij natuurlijk. In mijn CV staat TypeScript dan ook naast JavaScript als technologie waarmee ik meerdere jaren ervaring heb opgebouwd.
Wat is TypeScript?
TypeScript is een uitbreiding op JavaScript die static typing toevoegt.
Je kunt daarmee bijvoorbeeld expliciet aangeven welke data een functie verwacht, wat een API teruggeeft of welke eigenschappen een object moet bevatten.
De TypeScript-code wordt uiteindelijk gecompileerd naar JavaScript en draait daarna gewoon in de browser of binnen een JavaScript-runtime zoals Node.js.
Voor mij zit de echte waarde daarom niet in wat TypeScript uiteindelijk uitvoert, maar in wat het tijdens development voorkomt.
Waarom ik TypeScript gebruik
TypeScript geeft mij vooral meer zekerheid tijdens het ontwikkelen.
Een verandering aan een interface of API-response kan direct zichtbaar maken welke onderdelen van de applicatie daardoor geraakt worden.
Dat maakt refactoring een stuk prettiger.
Vooral wanneer een frontend communiceert met meerdere backend endpoints vind ik dat belangrijk. De frontend en backend hebben uiteindelijk een contract met elkaar.
Hoe explicieter dat contract is, hoe kleiner de kans dat fouten pas tijdens runtime zichtbaar worden.
Hoe ik TypeScript gebruik
Mijn TypeScript-gebruik zit voornamelijk rondom Vue en Nuxt applicaties.
Daarbij gebruik ik TypeScript bijvoorbeeld voor:
component properties
composables
API-modellen
request- en response-objecten
state
domeinmodellen binnen de frontend
gedeelde interfaces tussen verschillende onderdelen
In combinatie met Vue's Composition API vind ik dit prettig werken omdat logica en bijbehorende types dicht bij elkaar kunnen blijven.
Ik probeer daarbij wel bewust eenvoudig te blijven.
Niet ieder object heeft drie interfaces en vijf generics nodig.
Als een simpel type voldoende is, gebruik ik een simpel type.
TypeScript in combinatie met backend development
Mijn backend achtergrond beïnvloedt behoorlijk hoe ik naar TypeScript kijk.
Bij Java en Kotlin ben ik gewend dat modellen en contracten expliciet zijn. Wanneer ik vervolgens een frontend bouw die tegen zo'n backend communiceert, wil ik die duidelijkheid aan de frontend-kant zoveel mogelijk behouden.
Een backend kan technisch volledig correct zijn, maar als de frontend verschillende aannames maakt over dezelfde data heb je alsnog een probleem.
Daarom vind ik bijvoorbeeld goed gedefinieerde API-contracten belangrijk.
TypeScript is vervolgens een goede manier om die contracten ook daadwerkelijk door te trekken naar de frontend.
Waar ik TypeScript heb gebruikt
Mijn frontend ervaring komt voor een belangrijk deel uit mijn periode bij Marvia, waar ik ruim vier jaar als Fullstack Developer werkte aan een SaaS-platform. Daar heb ik veel ervaring opgebouwd met moderne webontwikkeling naast mijn backend werkzaamheden.
Ook binnen mijn eigen SaaS-projecten werk ik met Vue en Nuxt voor de frontend. Mijn CV beschrijft bijvoorbeeld hoe ik Vue heb ingezet voor Debit55, bovenop een backend architectuur bestaande uit meerdere microservices.
Tegenwoordig gebruik ik TypeScript vooral wanneer ik dit soort frontends verder structureer en wil voorkomen dat de vrijheid van JavaScript uiteindelijk ten koste gaat van onderhoudbaarheid.
JavaScript versus TypeScript
Voor mij is de keuze redelijk eenvoudig.
Voor een klein script of een eenvoudige toepassing kan JavaScript volledig voldoende zijn.
Zodra ik een applicatie bouw waarvan ik verwacht dat deze verder gaat groeien, kies ik liever TypeScript.
JavaScript geeft je maximale vrijheid.
TypeScript voegt daar bewust een aantal grenzen aan toe.
En juist die grenzen zorgen er vaak voor dat een applicatie op langere termijn eenvoudiger te onderhouden blijft.
TypeScript is geen vervanging voor goede architectuur
Een applicatie wordt niet automatisch goed gestructureerd omdat er TypeScript wordt gebruikt.
Je kunt ook perfect getypeerde spaghetti schrijven.
Voor mij blijft daarom belangrijker hoe verantwoordelijkheden worden verdeeld, hoe data door de applicatie beweegt en hoe componenten met elkaar samenwerken.
TypeScript ondersteunt die structuur.
Het creëert hem niet voor je.
Dat onderscheid vind ik belangrijk.
Wanneer ik TypeScript zou kiezen
Ik zou TypeScript voornamelijk kiezen wanneer:
een frontend verder gaat groeien
meerdere developers aan dezelfde applicatie werken
veel communicatie met backend API's plaatsvindt
modellen op meerdere plekken worden gebruikt
refactoring veilig moet kunnen plaatsvinden
Vue of Nuxt voor een professionele applicatie wordt ingezet
Voor een klein script vind ik puur JavaScript soms nog steeds eenvoudiger.
Voor een serieuze webapplicatie zou ik tegenwoordig meestal direct met TypeScript beginnen.
Veelgestelde vragen die ik krijg over TypeScript
TypeScript of JavaScript?
Voor kleine toepassingen JavaScript, voor grotere applicaties vrijwel altijd TypeScript. Zodra onderhoudbaarheid belangrijk wordt, vind ik de extra typeveiligheid de moeite waard.
Gebruik je TypeScript ook aan de backend?
Ik heb ervaring binnen het Node.js-ecosysteem, maar mijn voorkeur voor grotere backend systemen blijft Java of Kotlin. TypeScript gebruik ik voornamelijk aan de frontend.
Waarom TypeScript als je backend developer bent?
Juist vanwege die achtergrond. Vanuit Java en Kotlin ben ik gewend om expliciet na te denken over modellen en contracten. TypeScript brengt een deel van die duidelijkheid naar het JavaScript-ecosysteem.
Gebruik je veel complexe TypeScript-types?
Alleen wanneer ze daadwerkelijk iets oplossen. Een type moet code duidelijker maken. Zodra de type-definitie complexer wordt dan het probleem zelf, zoek ik liever naar een eenvoudigere oplossing.
Gebruik je TypeScript met Vue en Nuxt?
Ja. Vooral in combinatie met Nuxt, Vue en de Composition API vind ik TypeScript prettig. Het zorgt ervoor dat componenten, composables en API-modellen duidelijk op elkaar aansluiten.