[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"portfolio-options":3,"4O5u1Mmg-rAwA_Tre1jAl_-5L5GfVlkFXPDUBIR8TcQ":43,"_apollo:default":157},{"footerColofon":4,"siteLogo":5,"footerSocials":5,"heroRole":6,"heroName":7,"heroLede1":8,"heroLede2":9,"contactTitle":10,"contactHomeIntro":11,"contactIntro":12,"contactReplyNote":13,"registerTitle":14,"projectsTitle":15,"projectsIntro":16,"experiencesTitle":17,"experiencesIntro":18,"cvTitle":19,"cvIntro":20,"seoTitleSuffix":21,"seoDefaultDescription":22,"seoDefaultImage":5,"seoPages":23,"seoHomeTitle":5,"seoHomeDescription":5,"seoProjectsTitle":5,"seoProjectsDescription":5,"seoExperiencesTitle":5,"seoExperiencesDescription":5,"seoCvTitle":5,"seoCvDescription":5,"seoContactTitle":5,"seoContactDescription":5,"__typename":42},"\u003Cp>Deze site draait op \u003Cstrong>Nuxt\u003C\u002Fstrong>, \u003Cstrong>headless WordPress\u003C\u002Fstrong> en \u003Cstrong>Vercel\u003C\u002Fstrong>.\u003C\u002Fp>\n",null,"Full-stack developer, Nederland, remote beschikbaar","Marthijn Beilschmidt","Zes jaar ervaring in webdevelopment: bij bureaus, in loondienst en als zelfstandige.","Hier laat ik zien wat ik daarbuiten bouw: van interne dashboards tot hobbyprojecten die niemand vroeg, maar die ik toch maakte.","Laten we connecten","Vragen over m'n werk, een rol, of gewoon nieuwsgierig naar hoe iets gebouwd is? Laat het weten.","Vragen over m'n werk, een rol, of gewoon nieuwsgierig hoe iets gebouwd is? Stuur een bericht.","Meestal reageer ik binnen een werkdag.","Register","Projecten","Mijn klantwerk, interne tools en hobbyprojecten, elk met de techniek die erin zit. Filterbaar op vaardigheid.","Werkervaring","Waar ik gewerkt heb en wat ik er deed, van m'n eerste stage tot nu, als tijdlijn, met de plekken die nog doorlopen.","Curriculum Vitae","Mijn achtergrond, vaardigheden en werk op één pagina. Ook te downloaden als PDF."," - Marthijn Beilschmidt","Full-stack developer uit Nederland met zes jaar ervaring. Hier laat ik zien wat ik bouw: klantwerk, interne tools en eigen projecten.",[24,29,31,33,35,38],{"route":25,"title":26,"description":22,"noindex":27,"image":5,"__typename":28},"\u002F","Marthijn Beilschmidt - Portfolio",false,"PortfolioOptionsFieldsSeoPages",{"route":30,"title":15,"description":16,"noindex":27,"image":5,"__typename":28},"\u002Fprojects",{"route":32,"title":17,"description":18,"noindex":27,"image":5,"__typename":28},"\u002Fexperiences",{"route":34,"title":19,"description":20,"noindex":27,"image":5,"__typename":28},"\u002Fcv",{"route":36,"title":37,"description":12,"noindex":27,"image":5,"__typename":28},"\u002Fcontact","Contact",{"route":39,"title":40,"description":41,"noindex":27,"image":5,"__typename":28},"\u002Fblog","Blog","Artikelen en inzichten over webdevelopment, technologie en projecten.","PortfolioOptionsFields",{"project":44},{"id":45,"databaseId":46,"title":47,"slug":48,"date":49,"content":50,"seo":51,"featuredImage":58,"projectFields":69,"__typename":156},"cG9zdDozMjc=",327,"UrenCalculatie","urencalculatie","2026-08-10T13:44:23","\u003Cp>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.\u003C\u002Fp>\n\u003Ch2>Waarom\u003C\u002Fh2>\n\u003Cp>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.\u003C\u002Fp>\n\u003Cp>Onze manager kon zien waar een schatting op gebaseerd was en de klant kreeg inzicht in wat zijn wensen concreet betekenden.\u003C\u002Fp>\n\u003Ch2>Hoe het werkt\u003C\u002Fh2>\n\u003Cp>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.\u003C\u002Fp>\n\u003Cp>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.\u003C\u002Fp>\n\u003Cp>Onderweg is het project van Laravel 10 met Mix naar Laravel 12 met Vite verhuisd en zijn de restanten van die oude opzet opgeruimd.\u003C\u002Fp>\n\u003Ch2>Kernpunten waar ik trots op ben\u003C\u002Fh2>\n\u003Cul>\n\u003Cli>\u003Cstrong>\u003Ccode>lz-string\u003C\u002Fcode> in zowel PHP als JavaScript\u003C\u002Fstrong> 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.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Tegelijk aan één sessie werken, via websockets met Laravel Reverb.\u003C\u002Fstrong> 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.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Excel-export mét opmaak via \u003Ccode>xlsx-js-style\u003C\u002Fcode>\u003C\u002Fstrong>, plus JSON en PDF, voor jezelf en voor de klant. Geen kale CSV die de ontvanger zelf mag opmaken.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Optionele regels: zichtbaar in de opbouw, buiten het totaal.\u003C\u002Fstrong>\u003C\u002Fli>\n\u003Cli>\u003Cstrong>SSO met Microsoft en Google via Socialite, plus een limietloze gastmodus.\u003C\u002Fstrong> Inloggen mag, maar hoeft niet.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch2>Wat het opleverde\u003C\u002Fh2>\n\u003Cp>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.\u003C\u002Fp>\n",{"title":52,"metaDesc":53,"canonical":53,"opengraphTitle":52,"opengraphDescription":54,"metaRobotsNoindex":55,"metaRobotsNofollow":56,"opengraphImage":5,"__typename":57},"UrenCalculatie - WP - Admin","","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 … Continued","noindex","follow","PostTypeSEO",{"node":59,"__typename":68},{"altText":60,"mediaItemUrl":61,"mediaType":62,"mediaDetails":63,"__typename":67},"Het logo van UrenCalculatie op een vlak in de merkkleur.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F08\u002Fbanner-urencalculatie.webp","image",{"width":64,"height":65,"__typename":66},1600,900,"MediaDetails","MediaItem","NodeWithFeaturedImageToMediaItemConnectionEdge",{"description":70,"projectType":71,"client":5,"duration":73,"headerImage":74,"gallery":81,"skills":113,"liveWebsite":154,"__typename":155},"Een tool om urenschattingen op te bouwen en als link te delen, inclusief live meekijken.",[72],"prive","Doorlopend",{"node":75,"__typename":80},{"altText":76,"mediaItemUrl":77,"mediaType":62,"mediaDetails":78,"__typename":67},"Een ingevulde urenschatting in UrenCalculatie, met de uren per onderdeel.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F08\u002Fgenerator-ingevuld-desktop.webp",{"width":64,"height":79,"__typename":66},1178,"AcfMediaItemConnectionEdge",{"nodes":82,"__typename":112},[83,91,98,106],{"id":84,"databaseId":85,"altText":86,"mediaItemUrl":87,"mediaType":62,"mediaDetails":88,"__typename":67},"cG9zdDo1MTg=",518,"Een ingevulde urenschatting in UrenCalculatie op een telefoon.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F08\u002Fgenerator-ingevuld-mobile-scaled.webp",{"width":89,"height":90,"__typename":66},904,2560,{"id":92,"databaseId":93,"altText":94,"mediaItemUrl":95,"mediaType":62,"mediaDetails":96,"__typename":67},"cG9zdDo1MTk=",519,"Een lege urenschatting in UrenCalculatie op een breed scherm.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F08\u002Fgenerator-leeg-desktop.webp",{"width":64,"height":97,"__typename":66},1000,{"id":99,"databaseId":100,"altText":101,"mediaItemUrl":102,"mediaType":62,"mediaDetails":103,"__typename":67},"cG9zdDo1MjA=",520,"Een lege urenschatting in UrenCalculatie op een telefoon.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F08\u002Fgenerator-leeg-mobile.webp",{"width":104,"height":105,"__typename":66},1170,2532,{"id":107,"databaseId":108,"altText":109,"mediaItemUrl":110,"mediaType":62,"mediaDetails":111,"__typename":67},"cG9zdDo1MjE=",521,"Het welkomscherm van UrenCalculatie.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F08\u002Fwelkom-desktop.webp",{"width":64,"height":97,"__typename":66},"AcfMediaItemConnection",{"nodes":114,"__typename":153},[115,124,130,135,141,147],{"id":116,"databaseId":117,"title":118,"skillFields":119,"__typename":123},"cG9zdDoyOTE=",291,"Laravel",{"icon":120,"description":121,"__typename":122},"simple-icons:laravel","Wanneer je applicatie* aanzienlijk complexer wordt en vanaf de basis moet worden opgebouwd.","SkillFields","Skill",{"id":125,"databaseId":126,"title":127,"skillFields":128,"__typename":123},"cG9zdDozOTI=",392,"Vue 3",{"icon":129,"description":5,"__typename":122},"logos:vue",{"id":131,"databaseId":132,"title":133,"skillFields":134,"__typename":123},"cG9zdDo0MDY=",406,"Inertia",{"icon":5,"description":5,"__typename":122},{"id":136,"databaseId":137,"title":138,"skillFields":139,"__typename":123},"cG9zdDo0Mjk=",429,"TypeScript",{"icon":140,"description":5,"__typename":122},"logos:typescript-icon",{"id":142,"databaseId":143,"title":144,"skillFields":145,"__typename":123},"cG9zdDozOTE=",391,"Tailwind CSS",{"icon":146,"description":5,"__typename":122},"logos:tailwindcss-icon",{"id":148,"databaseId":149,"title":150,"skillFields":151,"__typename":123},"cG9zdDozNzc=",377,"WebSockets",{"icon":152,"description":5,"__typename":122},"logos:websocket","AcfContentNodeConnection","http:\u002F\u002Furencalculatie.nl\u002F","ProjectFields","Project",{}]