UrenCalculatie

Een tool om een urenschatting op te bouwen en die als link te delen. Je maakt groepen met regels eronder, sleept ze in de volgorde die je wilt, vult je uurtarief in en onderaan staan de totale kosten. De link kun je doorsturen; wie hem opent ziet de schatting van de kosten terwijl jij eraan werkt.

Waarom

Bij Specialist in Websites moest er voortdurend geschat worden hoeveel uur de developers in een project zouden steken. Dat ging via een Excel-sjabloon. Dat sjabloon werd zo vaak gebruikt dat het logischer en efficiënter werd er een webtool van te maken.

Onze manager kon zien waar een schatting op gebaseerd was en de klant kreeg inzicht in wat zijn wensen concreet betekenden.

Hoe het werkt

Laravel 12 met Inertia 2 en Vue 3. Geen aparte API-laag: Inertia geeft de Vue-componenten hun data rechtstreeks mee vanuit de controller. Voor iets dat door een handvol mensen gebruikt wordt, scheelt dat een hoop bouwwerk dat nergens toe dient. Componenten komen uit Nuxt UI, styling is Tailwind 4, state zit in Pinia.

Een schatting is een boom: groepen met regels eronder. Elke regel heeft uren, een kleur en een type. Naast een gewone regel kun je een kop invoegen om structuur aan te brengen, of een regel als optioneel markeren: die telt niet mee in het totaal maar blijft wel staan, zodat de klant ziet wat hij niet afneemt. Slepen gaat met vuedraggable, het bedrag herberekent live.

Onderweg is het project van Laravel 10 met Mix naar Laravel 12 met Vite verhuisd en zijn de restanten van die oude opzet opgeruimd.

Kernpunten waar ik trots op ben

• lz-string in zowel PHP als JavaScript voor gedeelde state-compressie, zodat een schatting in je browsersessie kan blijven staan en de server datzelfde blok kan uitlezen wanneer het nodig is. Daardoor werkt de tool zonder account, zonder dat je je werk kwijt bent als je het tabblad sluit.
• Tegelijk aan één sessie werken, via websockets met Laravel Reverb. Op eigen infrastructuur, dus geen abonnement en geen externe partij die meeleest in wat in feite tarieven en marges zijn. Je krijgt een melding wie er is aangehaakt.
• Excel-export mét opmaak via xlsx-js-style, plus JSON en PDF, voor jezelf en voor de klant. Geen kale CSV die de ontvanger zelf mag opmaken.
• Optionele regels: zichtbaar in de opbouw, buiten het totaal.
• SSO met Microsoft en Google via Socialite, plus een limietloze gastmodus. Inloggen mag, maar hoeft niet.

Wat het opleverde

De tool heeft veel tijd gescheeld zolang we op deze manier schatten. Maar Specialist in Websites groeide en ik groeide mee: ik ben steeds meer met scrum gaan werken, waarbij je een backlog indeelt in sprints van een of twee weken. Vanaf dat moment schat je niet meer vooraf een heel project maar per sprint en toen ben ik de tool zelf niet meer gaan gebruiken.