Ruben Bijker
Neem contact op

TypeScript in webprojecten: praktijken die lonen

Door Ruben Bijker · Gepubliceerd · 5 min lezen

TypeScript loont als je het strikt gebruikt en statische types combineert met runtimevalidatie aan de randen van je app. Los gebruikt, met overal any, geeft het ruis zonder veiligheid.

Begin strikt

Zet strict in tsconfig.json aan vanaf het begin. Strikt maken achteraf is veel meer werk. Handige extra's zijn noUncheckedIndexedAccess en exactOptionalPropertyTypes, die veelvoorkomende runtimefouten vangen.

Valideer aan de randen

Types beschrijven hoe je denkt dat data eruitziet. Alles wat je app binnenkomt, zoals formulierinput, API-responses, omgevingsvariabelen en databaserijen, valideer je tijdens runtime. Libraries zoals Zod of Valibot laten je één keer een schema definiëren en het TypeScript-type daaruit afleiden, zodat beide niet uit elkaar lopen.

Modelleer je domein met types

  • Gebruik discriminated unions voor toestanden zoals loading | success | error, zodat onmogelijke toestanden niet bestaan.
  • Geef de voorkeur aan string literal unions boven losse strings voor statussen en rollen.
  • Gebruik branded types voor ID's, zodat je een gebruikers-ID niet met een bestel-ID verwisselt.
  • Laat de compiler exhaustive switch-statements controleren met een never-fallback.

Deel types over de stack

In een full-stack TypeScript-project deel je schema's en types tussen server en client via een gedeeld package of een frameworkfunctie zoals server actions of tRPC. Een wijziging in de datavorm laat dan de build falen in plaats van productie.

Vermijd veelgemaakte valkuilen

  • any en blinde casts. Gebruik unknown en vernauw het.
  • Te slimme generics. Als een type een alinea uitleg nodig heeft, vereenvoudig het.
  • Dubbele types. Leid types af uit schema's, databasemodellen of API-specs in plaats van ze over te typen.
  • Fouten negeren met @ts-ignore. Gebruik liever @ts-expect-error met een toelichting, zodat het faalt zodra het probleem is opgelost.

Tooling die het compleet maakt

Draai de typecheck in CI. Voeg ESLint met type-aware regels en een formatter toe. Houd unit tests voor logica en een paar end-to-end tests voor kritieke flows; types vervangen tests niet, ze verminderen het aantal dat je nodig hebt.

Zie ook: API-ontwerp en AI-ondersteund ontwikkelen.

Veelgestelde vragen

Is TypeScript de moeite waard voor kleine projecten?
Meestal wel. De opzetkosten zijn laag en types vangen typfouten, verkeerde argumenten en ontbrekende gevallen tijdens het schrijven.
Vervangen types runtimevalidatie?
Nee. Types verdwijnen tijdens runtime. Valideer data van gebruikers, API's en opslag met een schemalibrary en leid de types af uit het schema.

Bijbehorende dienst: Webapplicatie laten bouwen: maatwerk door een senior developer

Een project in gedachten?

Vertel kort wat je nodig hebt. Je krijgt antwoord van mij, niet van een verkoopteam.

Neem contact op

Verder lezen