[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"portfolio-options":3,"QAel-vKdFcgrFmysidLsBcFPXxAqkbZ7T1hKlk_kp-k":43,"_apollo:default":164},{"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":61,"projectFields":69,"__typename":163},"cG9zdDo0ODc=",487,"Portfolio + CMS","portfolio-cms","2026-09-12T12:04:30","\u003Cp>Dit is de site waar je nu op zit, plus de WordPress-installatie voor het inhoudelijke gedeelte. Twee repositories, één geheel: een Nuxt-frontend en een headless CMS op Bedrock. Diezelfde CMS voedt ook absolit.nl.\u003C\u002Fp>\n\u003Cp>De allereerste commit heette “Messing around with title screen and colors”. Dat dekt de lading van hoe het begon aardig.\u003C\u002Fp>\n\u003Ch2>Waarom\u003C\u002Fh2>\n\u003Cp>Een portfolio heeft een probleem dat andere sites niet hebben: het is zelf het bewijsstuk. Bij een klantproject kun je vertellen wat je gebouwd hebt. Hier staat degene die je beoordeelt in het ding waar je over praat. Slordige uitlijning is dan geen detail maar een tegenargument.\u003C\u002Fp>\n\u003Cp>Praktisch speelde er iets anders. Ik heb twee sites die deels dezelfde inhoud tonen: projecten, werkervaring, skills. Twee keer onderhouden gaat één keer goed en daarna niet meer. En ik wilde een CV dat uit dezelfde gegevens rolt als de site, want een los Word-bestand loopt binnen een maand achter op de werkelijkheid.\u003C\u002Fp>\n\u003Ch2>Hoe het werkt\u003C\u002Fh2>\n\u003Cp>WordPress op Bedrock als koploze inhoudsbron, WPGraphQL erbovenop en Nuxt 4 aan de voorkant. De WordPress-kant is voor niemand zichtbaar en wordt ook niet geïndexeerd.\u003C\u002Fp>\n\u003Cp>Het mooiste zit in het datamodel. De velden staan niet in de database maar in PHP, via ACF Composer. Een nieuw veld is dus een codewijziging die in git staat, te reviewen en terug te draaien, in plaats van iets wat iemand ooit in een beheerscherm heeft aangeklikt. Bij het overzetten naar een andere omgeving hoef je geen veldgroepen te exporteren.\u003C\u002Fp>\n\u003Cp>Op elk item zit een veld \u003Cem>Zichtbaarheid\u003C\u002Fem>: alleen portfolio, alleen Absolit of allebei. Eén keer schrijven, twee sites bedienen.\u003C\u002Fp>\n\u003Ch2>Kernpunten waar ik trots op ben\u003C\u002Fh2>\n\u003Cul>\n\u003Cli>\u003Cstrong>CV-generatie naar PDF met Dompdf, met de WordPress-installatie als bron.\u003C\u002Fstrong> Je vinkt aan welke projecten en werkervaringen op het CV moeten staan en de PDF rolt eruit. Wijzig je een project, dan klopt het CV de volgende keer dat iemand het downloadt.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Eigen hoogte-inschatting voor de paginabreuken.\u003C\u002Fstrong> Dompdf geeft geen controle over waar een pagina eindigt, dus wordt per blok berekend hoeveel regels het wordt bij die kolombreedte en daaruit volgt de indeling.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Het datamodel staat in code, niet in de database.\u003C\u002Fstrong> ACF-velden via ACF Composer, dus een nieuw veld is een codewijziging die in git staat en terug te draaien is.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>Same-origin proxy voor de PDF-download\u003C\u002Fstrong> via een Nuxt server-route, omdat browsers een download van een onbeveiligde herkomst blokkeren en je anders je CMS-domein in een publieke link zet.\u003C\u002Fli>\n\u003Cli>\u003Cstrong>WPGraphQL plus headless Nuxt als vaste basis.\u003C\u002Fstrong> Dit project, de CMS en Absolit draaien op dezelfde combinatie; de kracht zit in die opzet en in het strak houden van het ontwerp erbovenop.\u003C\u002Fli>\n\u003C\u002Ful>\n\u003Ch2>Wat er nog niet in zit\u003C\u002Fh2>\n\u003Cp>Genoeg. Zoals bij de meeste van deze projecten geldt dat dit er een is die nooit echt af zal zijn. Er blijven teveel leuke uitdagingen bestaan.\u003C\u002Fp>\n\u003Ch2>Wat het opleverde\u003C\u002Fh2>\n\u003Cp>GraphQL werkt snel en goed, maar heeft duidelijke beperkingen. Je schrijft je queries in de frontend, wat betekent dat je datalaag verspreid raakt over twee codebases en dat een wijziging aan een veld twee kanten raakt. Dat is een afweging die je maakt, geen gratis winst.\u003C\u002Fp>\n\u003Cp>De PDF-generatie was een leuk miniproject op zichzelf. Het snel krijgen van een headless Nuxt-site was ook leuk om te doen, al ben je daar nooit mee klaar.\u003C\u002Fp>\n\u003Cp>Zie ook het artikel over Absolit, de tweede site die uit dezelfde CMS eet.\u003C\u002Fp>\n",{"title":52,"metaDesc":53,"canonical":53,"opengraphTitle":52,"opengraphDescription":54,"metaRobotsNoindex":55,"metaRobotsNofollow":56,"opengraphImage":57,"__typename":60},"Portfolio + CMS - WP - Admin","","Dit is de site waar je nu op zit, plus de WordPress-installatie voor het inhoudelijke gedeelte. Twee repositories, één geheel: een Nuxt-frontend en een headless CMS op Bedrock. Diezelfde CMS voedt ook absolit.nl. De allereerste commit heette “Messing around with title screen and colors”. Dat dekt de lading van hoe het begon aardig. Waarom Een … Continued","noindex","follow",{"sourceUrl":58,"altText":47,"__typename":59},"https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F09\u002Fbanner-3.webp","MediaItem","PostTypeSEO",{"node":62,"__typename":68},{"altText":47,"mediaItemUrl":58,"mediaType":63,"mediaDetails":64,"__typename":59},"image",{"width":65,"height":66,"__typename":67},1600,900,"MediaDetails","NodeWithFeaturedImageToMediaItemConnectionEdge",{"description":70,"projectType":71,"client":5,"duration":73,"headerImage":74,"gallery":82,"skills":119,"liveWebsite":161,"__typename":162},"De site waar je nu op zit en de headless WordPress eronder die ook absolit.nl voedt.",[72],"prive","Doorlopend",{"node":75,"__typename":81},{"altText":76,"mediaItemUrl":77,"mediaType":63,"mediaDetails":78,"__typename":59},"Schema van de opzet: een headless WordPress met twee frontends erop.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F09\u002Fschema-opzet-1.webp",{"width":79,"height":80,"__typename":67},2400,1280,"AcfMediaItemConnectionEdge",{"nodes":83,"__typename":118},[84,92,99,106,112],{"id":85,"databaseId":86,"altText":87,"mediaItemUrl":88,"mediaType":63,"mediaDetails":89,"__typename":59},"cG9zdDo0ODg=",488,"De Absolit-instellingen in het CMS, waar de teksten van absolit.nl staan.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F09\u002Fabsolit-instellingen-desktop-scaled.webp",{"width":90,"height":91,"__typename":67},1606,2560,{"id":93,"databaseId":94,"altText":95,"mediaItemUrl":96,"mediaType":63,"mediaDetails":97,"__typename":59},"cG9zdDo0ODk=",489,"Het cv zoals het portfolio het genereert, op een breed scherm.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F09\u002Fcv-desktop-scaled.webp",{"width":98,"height":91,"__typename":67},1086,{"id":100,"databaseId":101,"altText":102,"mediaItemUrl":103,"mediaType":63,"mediaDetails":104,"__typename":59},"cG9zdDo0OTA=",490,"De CV-instellingen in het CMS, waar je kiest welke projecten op het cv komen.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F09\u002Fcv-instellingen-desktop-scaled.webp",{"width":91,"height":105,"__typename":67},1682,{"id":107,"databaseId":108,"altText":109,"mediaItemUrl":110,"mediaType":63,"mediaDetails":111,"__typename":59},"cG9zdDo0OTE=",491,"Het projectenoverzicht in de beheeromgeving van het portfolio-CMS.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F09\u002Fprojecten-desktop-scaled.webp",{"width":91,"height":65,"__typename":67},{"id":113,"databaseId":114,"altText":115,"mediaItemUrl":116,"mediaType":63,"mediaDetails":117,"__typename":59},"cG9zdDo0OTM=",493,"De Seeder-pagina in het CMS, die uitgeschreven content in de database zet.","https:\u002F\u002Fadmin.marthijnbeilschmidt.nl\u002Fapp\u002Fuploads\u002F2026\u002F09\u002Fseeder-desktop-scaled.webp",{"width":91,"height":65,"__typename":67},"AcfMediaItemConnection",{"nodes":120,"__typename":160},[121,130,136,142,149,154],{"id":122,"databaseId":123,"title":124,"skillFields":125,"__typename":129},"cG9zdDoyOTM=",293,"Nuxt",{"icon":126,"description":127,"__typename":128},"simple-icons:nuxt","Ontworpen voor grootschalige of minimalistische applicaties* met naadloze integratiemogelijkheden.","SkillFields","Skill",{"id":131,"databaseId":132,"title":133,"skillFields":134,"__typename":129},"cG9zdDozOTI=",392,"Vue 3",{"icon":135,"description":5,"__typename":128},"logos:vue",{"id":137,"databaseId":138,"title":139,"skillFields":140,"__typename":129},"cG9zdDozODk=",389,"WordPress",{"icon":141,"description":5,"__typename":128},"logos:wordpress-icon",{"id":143,"databaseId":144,"title":145,"skillFields":146,"__typename":129},"cG9zdDoyODc=",287,"Bedrock",{"icon":147,"description":148,"__typename":128},"simple-icons:rootsbedrock","Schaalbare WordPress installatie(s) bedoeld voor kleinschalige maatwerk applicaties*.",{"id":150,"databaseId":151,"title":152,"skillFields":153,"__typename":129},"cG9zdDo0MDM=",403,"GraphQL",{"icon":5,"description":5,"__typename":128},{"id":155,"databaseId":156,"title":157,"skillFields":158,"__typename":129},"cG9zdDozMDk=",309,"PHP",{"icon":159,"description":5,"__typename":128},"simple-icons:php","AcfContentNodeConnection","https:\u002F\u002Fmarthijnbeilschmidt.nl","ProjectFields","Project",{}]