[{"data":1,"prerenderedAt":316},["ShallowReactive",2],{"DefaultLayouten":3,"language-blog-tag-slug-design-systems-i18n-slugs":134,"language-blog-tag-slug-design-systems-":140,"language-blog-tag-slug-en-design-systems":144},{"app":4,"menu":31,"footer":66},{"githubUrl":5,"youtubeUrl":6,"linkedinUrl":7,"phoneNumber":8,"emailAddress":9,"legal":10,"addresses":20},"https:\u002F\u002Fgithub.com\u002Fvoorhoede\u002F","https:\u002F\u002Fwww.youtube.com\u002Fchannel\u002FUCzHuhQVYFRixtQN2-swcuGg","https:\u002F\u002Fwww.linkedin.com\u002Fcompany\u002Fde-voorhoede","+31 20 2610 954","post@voorhoede.nl",[11,14,17],{"title":12,"value":13},"KvK","56017235",{"title":15,"value":16},"BTW","NL851944620B01",{"title":18,"value":19},"IBAN","NL14TRIO0320142078",[21,26],{"address":22,"city":23,"googleMapsLink":24,"postalCode":25},"Koivistokade 70","Amsterdam","https:\u002F\u002Fwww.google.com\u002Fmaps\u002Fplace\u002FDe+Voorhoede+%7C+Front-end+Development\u002F@52.396847,4.8700823,17z\u002Fdata=!3m1!4b1!4m5!3m4!1s0x47c5e21d502d2d59:0xbf570944a96ebf45!8m2!3d52.347647!4d4.8502154","1013 BB",{"address":27,"city":28,"googleMapsLink":29,"postalCode":30},"Koornmarkt 22","Delft","https:\u002F\u002Fwww.google.nl\u002Fmaps\u002Fplace\u002FKoornmarkt+22,+2611+EG+Delft\u002F@52.0093477,4.3573054,17z\u002F","2611 EG",{"title":32,"callToActions":33,"links":39},"Site Menu",[34],{"id":35,"title":36,"link":37},"163140902","Contact",{"__typename":38},"ContactRecord",[40,46,51,56,61],{"id":41,"title":42,"link":43},"163140904","Impact",{"__typename":44,"slug":45},"PageRecord","impact",{"id":47,"title":48,"link":49},"163140905","Services",{"__typename":50},"ServiceOverviewRecord",{"id":52,"title":53,"link":54},"163140906","Cases",{"__typename":55},"CaseOverviewRecord",{"id":57,"title":58,"link":59},"163140908","About us",{"__typename":44,"slug":60},"about-us",{"id":62,"title":63,"link":64},"d6WdFJq2SOuc3dWtpibbXQ","Work at",{"__typename":44,"slug":65},"work-at",{"links":67,"copyrightTitle":93,"copyrightLabel":94,"copyrightLink":95,"privacyTitle":96,"privacyLabel":97,"privacyLink":98,"certificatesGrid":99},[68,71,74,77,82,85,88],{"id":69,"title":42,"link":70},"144185264",{"__typename":44,"slug":45},{"id":72,"title":48,"link":73},"144185265",{"__typename":50},{"id":75,"title":53,"link":76},"144185266",{"__typename":55},{"id":78,"title":79,"link":80},"144185267","Blog",{"__typename":81},"BlogPostOverviewRecord",{"id":83,"title":58,"link":84},"144185268",{"__typename":44,"slug":60},{"id":86,"title":36,"link":87},"144185269",{"__typename":38},{"id":89,"title":90,"link":91},"144185270","FAQ",{"__typename":44,"slug":92},"faq","Creative Commons licence and disclaimer","CC BY 4.0","https:\u002F\u002Fcreativecommons.org\u002Flicenses\u002Fby\u002F4.0\u002F","De Voorhoede privacy statement (pdf)","Privacy statement","https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1780323242-vh-isms-006-privacy-statement-de-voorhoede.pdf",[100,112,123],{"id":101,"image":102,"link":107},"Xq4bBfg_TZ6Fkjax9mkbLQ",{"url":103,"alt":104,"width":105,"height":106},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1687353463-b-corp-logo-black-rgb.png","B Corp logo",404,680,{"__typename":108,"id":109,"title":110,"url":111},"ExternalLinkRecord","fGW1ak8XQYaYDLkBSyncog","B Corp","https:\u002F\u002Fwww.bcorporation.net\u002Fen-us\u002Ffind-a-b-corp\u002Fcompany\u002Fde-voorhoede\u002F",{"id":113,"image":114,"link":119},"c5mCXRTiSraRIB25fw1p7Q",{"url":115,"alt":116,"width":117,"height":118},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1687353461-dda-boxlogo-black.png","Dutch Digital Agencies logo",627,480,{"__typename":108,"id":120,"title":121,"url":122},"P6Jh7B0cTv2cKyNEeKVWVQ","Dutch Digital Agencies","https:\u002F\u002Fdutchdigitalagencies.com\u002Fleden\u002Fde-voorhoede\u002F",{"id":124,"image":125,"link":129},"MT5SCyNxSTSr_v5eeATMZw",{"url":126,"alt":127,"width":128,"height":128},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1775730283-dnv.png","DNV logo",518,{"id":130,"title":131,"link":132},"BRtNB5HnT5i-7HkA8IYzBw","DNV",{"__typename":44,"slug":133},"impact\u002Fdigitale-producten-privacy-by-design",[135,138],{"locale":136,"value":137},"en","design-systems",{"locale":139,"value":137},"nl",{"tag":141},{"id":142,"title":143,"slug":137},"JBiZUe8mQVujxlNVR5gx8Q","Design Systems",{"page":145,"items":181,"itemsMeta":283,"tags":285,"tag":303},{"title":79,"social":146,"subtitle":150,"description":151,"headerIllustration":149,"pinnedPosts":152,"pivots":169},{"title":147,"description":148,"image":149},"Blog | De Voorhoede","Find out how we approach our projects and what techniques we use.",null,"We love the web","In our blog posts you’ll read how we approach our projects and what techniques we use.",[153],{"slug":154,"social":155,"title":160,"date":161,"authors":162},"how-to-select-framework-design-system-components",{"title":156,"description":157,"image":158},"How to select a Framework for Design System Components","Which technology or framework do you select for your design system? We looked at a setup with Stencil and PReact. Read about our conclusion. ",{"url":159},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1670852538-linkedin-post-2.jpg","How to select a framework for design system components","2022-12-12T01:00:00.000+01:00",[163],{"name":164,"image":165},"Jasper",{"url":166,"alt":149,"width":167,"height":168},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1683535518-jasper.jpg",1892,2523,[170],{"title":171,"body":172,"links":173,"mailchimpValue":180,"mailchimpName":180,"mailchimpId":180,"formType":180,"contactPerson":149},"Also in love with the web?","\u003Cp>For us, that’s about technology and user experience. Fast, available for all, enjoyable to use. And fun to build. This is how our team bands together, adhering to the same values, to make sure we achieve a solid result for clients both large and small. Does that fit you?\u003C\u002Fp>\n",[174],{"__typename":175,"id":176,"title":177,"link":178},"InternalLinkRecord","163140992","Join our team",{"__typename":44,"slug":179},"jobs","",[182,197,208,223,235,248,254,271],{"slug":183,"social":184,"title":185,"date":189,"authors":190},"accessibility-in-design-systems",{"title":185,"description":186,"image":187},"Accessibility in Design Systems","Design systems help with accessibility, but they’re not the full solution.",{"url":188},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1749642128-accessibility_blog_with_graphic.jpg","2025-06-17T14:15:56.000+02:00",[191],{"name":192,"image":193},"Sjoerd",{"url":194,"alt":149,"width":195,"height":196},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1683534892-sjoerd.jpg",1637,2182,{"slug":198,"social":199,"title":200,"date":204,"authors":205},"design-system-from-scratch-from-the-shelf",{"title":200,"description":201,"image":202},"Design System: from scratch or from the shelf?","Depending on your needs and budget, you may prefer a fully tailor-made design system from scratch, or rather a white label from the shelf.",{"url":203},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1731076679-social-design-system-scratch-shelf.png","2024-11-19T13:16:02.759+01:00",[206],{"name":164,"image":207},{"url":166,"alt":149,"width":167,"height":168},{"slug":209,"social":210,"title":212,"date":215,"authors":216},"write-components-once-run-everywhere-with-mitosis-a-beautiful-dream-or-reality",{"title":211,"description":212,"image":213},"Using Mitosis to build a Design System","“Write components once, run everywhere” with Mitosis; a beautiful dream or reality?",{"url":214},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1726596831-mitosis-social-cover-en.jpg","2024-09-16T13:04:31.307+02:00",[217],{"name":218,"image":219},"Wessel",{"url":220,"alt":218,"width":221,"height":222},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1721035942-wessel.jpg",2135,2868,{"slug":224,"social":225,"title":230,"date":231,"authors":232},"affordance-design-system-components",{"title":226,"description":227,"image":228},"Affordance in Design System Components | De Voorhoede","By using affordance principles, design systems become easier to use and more flexible, making it simpler for developers to build web applications. Discover how.",{"url":229},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1716534481-linkedin-blog-6.jpg","Affordance in Design System Components","2024-05-27T09:00:00.000+02:00",[233],{"name":192,"image":234},{"url":194,"alt":149,"width":195,"height":196},{"slug":236,"social":237,"title":238,"date":242,"authors":243},"building-design-system-react-web-components",{"title":238,"description":239,"image":240},"Building a Design System with React Web Components","Learn how to create a universal Design system with React and Web Components to use in any web application or framework.",{"url":241},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1687161534-linkedin-post-1.jpg","2023-06-19T02:00:00.000+02:00",[244,246],{"name":164,"image":245},{"url":166,"alt":149,"width":167,"height":168},{"name":192,"image":247},{"url":194,"alt":149,"width":195,"height":196},{"slug":154,"social":249,"title":160,"date":161,"authors":251},{"title":156,"description":157,"image":250},{"url":159},[252],{"name":164,"image":253},{"url":166,"alt":149,"width":167,"height":168},{"slug":255,"social":256,"title":257,"date":261,"authors":262},"design-system-tooling",{"title":257,"description":258,"image":259},"Design System Tooling","Watch the videos of our October 2022 Design System Tooling meetup",{"url":260},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1581071665-chatting-robot.png","2021-11-15T01:00:00.000+01:00",[263,265],{"name":164,"image":264},{"url":166,"alt":149,"width":167,"height":168},{"name":266,"image":267},"Karlijn",{"url":268,"alt":149,"width":269,"height":270},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1683534636-placeholder.jpg",1235,1646,{"slug":272,"social":273,"title":278,"date":279,"authors":280},"kick-start-your-design-system-with-a-design-inventory-workshop",{"title":274,"description":275,"image":276},"Design System Inventory Workshop with Web Experts ","Turning an existing design into a system, can be a challenge. To kick-start this process we’ve developed the Design System Inventory Workshop. Read more.",{"url":277},"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1631791147-design-inventory-cover.jpg","Kick-start your Design System with a Design Inventory Workshop","2021-09-16T02:00:00.000+02:00",[281],{"name":164,"image":282},{"url":166,"alt":149,"width":167,"height":168},{"count":284},8,[286,290,291,295,299],{"id":287,"title":288,"slug":289},"WTPJX79URE-O5lpWLJeEHg","Headless CMS","headless-cms",{"id":142,"title":143,"slug":137},{"id":292,"title":293,"slug":294},"HgWm8aCCRMWWS0eqggo5xg","Accessibility ","accessibility",{"id":296,"title":297,"slug":298},"NJN9K2rdSY2pn9MvchHLtw","Strategy","strategy",{"id":300,"title":301,"slug":302},"b-HOCOQTRJKMsff0UxhDcg","Web performance ","web-performance",{"i18nSlugs":304,"id":142,"title":143,"slug":137,"blogTagSocial":307,"blogTopicDescription":315},[305,306],{"locale":136,"value":137},{"locale":139,"value":137},{"title":308,"description":309,"image":310},"Blogs about Design Systems ","Everything you need to know about design systems. Technical insights from web development experts from De Voorhoede.",{"id":311,"width":312,"height":313,"url":314},"Hd4aQsjUQoKZiPBitnprUw",1200,620,"https:\u002F\u002Fwww.datocms-assets.com\u002F6524\u002F1721046141-open-graph-design-systems.png","Everything you need to know about the technical approach to design systems. From tooling up to affordance.",1781883619399]