2025 · Freelance - Toelevering Online
Window & Door Configurator
Freelance Senior Frontend Engineer
Context & uitdaging
Twee eerdere pogingen met meerdere developers leverden geen onderhoudbare, productieklare configurator op. Het bedrijf had een robuuste, gebruiksvriendelijke oplossing nodig die complexe afhankelijkheidslogica aankon, ongeldige combinaties voorkwam en makkelijk uit te breiden was.
Oplossing
Ik bouwde een React/TypeScript-applicatie met URL als Single Source of Truth (deep-linkbare, deelbare configuraties), een type-safe GraphQL-laag (codegen, strikte typings) en een modulaire componentarchitectuur gedocumenteerd in Storybook. Strikte validaties en slimme UI-flows begeleiden gebruikers stap voor stap, blokkeren onmogelijke combinaties en lichten keuzes toe met directe feedback.
Belangrijkste functionaliteit
- Gedetailleerde configuratie: afmetingen, vakverdelingen, draairichtingen, profielen, afwerkingen, glasopties, accessoires.
- Directe feedback & validatie: alleen geldige combinaties; duidelijke error-, lege en laadstates.
- Deelbare URL's: configuraties openen, bewerken en hergebruiken via één link.
- Toegankelijkheid & UX: toetsenbordnavigatie, ARIA-attributen, consistent focusbeheer.
- Performance: gerichte memoization en code-splitting waar dat loont.
Architectuur & kwaliteit
- Frontend: React + TypeScript (strict), Zustand voor state, React Router, Storybook voor documentatie.
- Data: GraphQL met schema-gedreven types en veilige datamapping, robuuste foutafhandeling.
- Kwaliteit & DX: Jest + React Testing Library, Playwright-basis, ESLint/Prettier, pre-commit hooks.
- CI/CD: GitHub Actions-gates voor lint/test/build; voorspelbare, herhaalbare releases.
Impact
- Succesvolle turnaround: als solo developer opgeleverd naar live productie — sneller, met minder mensen en op hogere kwaliteit dan eerdere pogingen.
- Schaalbaar fundament: de architectuurpatronen worden nu platformbreed toegepast in het e-commerceplatform.
