{"id":3477,"date":"2022-05-25T06:21:40","date_gmt":"2022-05-25T06:21:40","guid":{"rendered":"http:\/\/the-codest.localhost\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/"},"modified":"2026-04-28T14:07:07","modified_gmt":"2026-04-28T14:07:07","slug":"nuxt-3-een-populair-hybride-vue-framework","status":"publish","type":"post","link":"https:\/\/thecodest.co\/nl\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/","title":{"rendered":"Nuxt 3 - een populair hybride Vue raamwerk"},"content":{"rendered":"<p><strong>Nuxt 3<\/strong> is opnieuw ontworpen en geschreven om ESM en <a href=\"https:\/\/thecodest.co\/nl\/dictionary\/typescript-developer\/\">TypeScript<\/a> van nature. Het is momenteel onstabiel, waardoor het nog niet productierijp is. De eerste kandidaat (nuxt@3.0.0-rc.1) staat gepland voor 7 april 2022.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/zrzut-ekranu-2022-05-25-o-08.26.43.png\" alt=\"Nuxtabel \" title=\"Vergelijkingstabel Nuxt \"\/><\/figure>\n\n\n\n<p><a href=\"https:\/\/www.google.com\/url?q=https:\/\/v3.nuxtjs.org\/getting-started\/introduction\/%23comparison&amp;sa=D&amp;source=docs&amp;ust=1653463586111556&amp;usg=AOvVaw0WL5Cg-cEL0X_q8Kiu_fGy\" rel=\"nofollow\">bron<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Een nieuw project starten<\/h2>\n\n\n\n<p>Open een terminal of open een ge\u00efntegreerde terminal vanuit Visual Studio <a href=\"https:\/\/thecodest.co\/nl\/dictionary\/what-is-code-refactoring\/\">Code<\/a> en gebruik het volgende commando om een nieuwe starter te maken <a href=\"https:\/\/thecodest.co\/nl\/dictionary\/why-do-projects-fail\/\">project<\/a>:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\"><code>npx nuxi init nuxt3-app<\/code><\/code><\/pre>\n\n\n\n<p>Open de map nuxt3-app:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\"><code><code>cd nuxt3-app<\/code><\/code><\/code><\/pre>\n\n\n\n<p>Installeer de afhankelijkheden:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\"><code><code><code>yarn installeren<\/code><\/code><\/code><\/code><\/pre>\n\n\n\n<p>Start de ontwikkelserver:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\"><code><code><code><code>yarn dev<\/code><\/code><\/code><\/code><\/code><\/pre>\n\n\n\n<p>Bouw de toepassing:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\"><code><code><code><code>garen bouwen<\/code><\/code><\/code><\/code><\/code><\/code><\/pre>\n\n\n\n<p>Start de gebouwde toepassing:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\"><code><code><code><code><code>start garen<\/code><\/code><\/code><\/code><\/code><\/code><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Wat is er nieuw?<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">Vue 3 ondersteuning<\/h3>\n\n\n\n<p><strong><a href=\"https:\/\/thecodest.co\/nl\/blog\/hire-vue-js-developers\/\">Vue<\/a> 3<\/strong> kwam met verschillende nieuwe functies die het bouwen en onderhouden van applicaties een stuk sneller en eenvoudiger maken. De belangrijkste wijzigingen zijn doorgevoerd in de Global Vue <a href=\"https:\/\/thecodest.co\/nl\/blog\/compare-staff-augmentation-firms-that-excel-in-api-team-staffing-for-financial-technology-projects\/\">API<\/a> en gebeurtenissen-API. <strong>Vue 3<\/strong>introduceert ook nieuwe functies zoals provide \/ inject, composition API (hieronder beschreven), Fragments en Teleport.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/thecodest.co\/services\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/blog.webp\" alt=\"\"\/><\/a><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Samenstelling API<\/h3>\n\n\n\n<p>Composition API is een ingebouwde Vue 3 functie, die een set van API's biedt, die het gebruik van ge\u00efmporteerde functies mogelijk maakt in plaats van het declareren van opties. De belangrijkste voordelen van Composition API zijn dus beter hergebruik van logica, flexibelere code-organisatie en geweldige TypeScript integratie. Alle onderdelen van de nieuwe API kunnen worden gebruikt buiten <strong>Vue<\/strong> onderdelen.<\/p>\n\n\n\n<p><strong>Nuxt 3<\/strong> biedt een nieuwe map - <code>compositiematerialen\/<\/code> - waarmee Vue composables automatisch kunnen worden ge\u00efmporteerd in een introtoepassing.<\/p>\n\n\n\n<p>Voorbeeld samenstelbaar:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\"><code><code><code><code><code><code>\/\/ Het zal beschikbaar zijn als useFoo() (camelCase van bestandsnaam zonder extensie)\n exportstandaard functie () {\n   return useState('foo', () =&gt; 'bar')<code>\/\/ Deze is beschikbaar als useFoo() (camelCase van bestandsnaam zonder extensie)\n exportstandaard functie () {\n   return useState('foo', () =&gt; 'bar')\n }<\/code>\n }<\/code><\/code><\/code><\/code><\/code><\/code><\/code><\/code><\/pre>\n\n\n\n<p>Voorbeeld van het gebruik van een composable in een <strong>Vue<\/strong> component:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">&lt;div&gt;{{ foo }}&lt;\/div&gt;\n&lt;\/&gt;<\/code><\/pre>\n\n\n\n<p>Zoals je hierboven kunt zien, wordt een composable ge\u00ebxporteerd als useFoo, precies zoals gedeclareerd in de const naam. Als er geen exportnaam is, zal de composable toegankelijk zijn als pascelCase van de bestandsnaam. Hiermee kun je ook eenvoudig automatisch ge\u00efmporteerde composables integreren met een populaire Vue Store composable genaamd <a href=\"https:\/\/www.google.com\/url?q=https:\/\/pinia.vuejs.org\/&amp;sa=D&amp;source=docs&amp;ust=1653463671582173&amp;usg=AOvVaw1YVpJI3sNMeufnYVxcM43i\" rel=\"nofollow\">Pina<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/api.png\" alt=\"API-structuurvoorbeeld \" title=\"Opties en samenstelling API \"\/><\/figure>\n\n\n\n<p><a href=\"https:\/\/vuejs.org\/guide\/extras\/composition-api-faq.html#better-logic-reuse\" rel=\"nofollow\">bron<\/a><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Nitromotor<\/h3>\n\n\n\n<p>Nitro is een full-stack server die gebruik maakt van Rollup en <a href=\"https:\/\/thecodest.co\/nl\/blog\/find-your-node-js-expert-for-hire-today\/\">Node.js<\/a> workers in ontwikkeling om code- en contextisolatie te dienen. Het bevat ook een server API en server middleware. In productie bouwt de engine de applicatie en de server in \u00e9\u00e9n map - `.output`. Het ding is dat de uitvoer lichtgewicht is: geminified en zonder enige <a href=\"https:\/\/thecodest.co\/nl\/dictionary\/what-is-node-js-used-for\/\">knooppunt<\/a> modules. Met Nitro kun je de uitvoer implementeren op Node.js, Serverless, Workers, Edge-side rendering of puur statisch.&nbsp;<\/p>\n\n\n\n<p><strong>Nuxt 3<\/strong> biedt de mogelijkheid om in te zetten op <a href=\"https:\/\/thecodest.co\/nl\/dictionary\/azure-developer\/\">Azuur<\/a> of Netlify zonder configuratie, samen met een Firebase of Cloudflare implementatie met minimale configuratie.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Vite<\/h3>\n\n\n\n<p>Vite is een nieuwe generatie frontend-tooling, die een ingebouwde functie is voor <strong> Nuxt 3<\/strong>. Deze tool biedt een snellere ontwikkelervaring voor <a href=\"https:\/\/thecodest.co\/nl\/blog\/find-your-ideal-stack-for-web-development\/\">web<\/a> projecten. Voor ontwikkeling heeft de server Vite uitgebreide functie-uitbreidingen ten opzichte van native ES-modules en een zeer snelle Hot Module Replacement (HMR).<\/p>\n\n\n\n<p>In het bouwproces bundelt Vite code met voorgeconfigureerde Rollup om statische assets te optimaliseren voor productie.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Nieuwe bestandsstructuur<\/h3>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/zrzut-ekranu-2022-05-25-o-08.52.47.png\" alt=\"voorbeeld bestandsstructuur \" title=\"mappenstructuur \"\/><\/figure>\n\n\n\n<p><a href=\"https:\/\/v3.nuxtjs.org\/docs\" rel=\"nofollow\">bron<\/a><\/p>\n\n\n\n<p><strong>Nuxt 3<\/strong> introduceert een licht gewijzigde bestandsstructuur. De grootste veranderingen zijn gedaan in `app.vue` - `pages\/` directory is optioneel en als deze niet aanwezig is, zal de applicatie geen vue-router bevatten, wat handig is bij het maken van een laadpagina of een applicatie die geen routing nodig heeft.&nbsp;<\/p>\n\n\n\n<p>Voorbeeld app.vue bestand:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">Hallo Wereld!<\/code><\/pre>\n\n\n\n<p>Om routing, pagina's en lay-out op te nemen, moet je ingebouwde componenten gebruiken, namelijk `NuxtPage` en `NuxtLayout`. Voorbeeld:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">&lt;div&gt;\n&lt;p&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;\/p&gt;\n&lt;p&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;\/p&gt;\n&lt;p&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;\/p&gt;\n&lt;\/div&gt;<\/code><\/pre>\n\n\n\n<p>`app.vue` is het hoofdonderdeel van de <strong>Nuxt-toepassing<\/strong>Dus alles wat daar wordt toegevoegd, wordt globaal en opgenomen in elke pagina.&nbsp;<\/p>\n\n\n\n<p>De verandering in de <strong>Nux<\/strong>t mapstructuur houdt in dat de map `store\/` wordt vervangen door de map `composables\/`, omdat <strong>Vue 3<\/strong>introduceert composables die winkels vervangt.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Migreren van Vue 2 naar Vue 3 met Nuxt Bridge<\/h2>\n\n\n\n<p>Nuxt 3 introduceert Nuxt Bridge - een forward-compatibiliteitslaag die Nuxt 2-applicaties upgradet met Nuxt 3-functies, waardoor het zichzelf stukje bij beetje kan upgraden. Het biedt toegang tot functies zoals: Nitro engine, composition API en nieuwe CLI, door simpelweg de bridge te installeren en te activeren.<\/p>\n\n\n\n<p>Nuxt Bridge is achterwaarts compatibel, dus oudere plugins en modules zullen nog steeds werken, terwijl migreren eenvoudig en mogelijk is zonder de hele applicatie te herschrijven.<\/p>\n\n\n\n<p>Om Nuxt Bridge in te schakelen, moet je ervoor zorgen dat de dev server niet draait, verwijder dan alle package lock bestanden en installeer `nuxt-edge`:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">- \"nuxt\": \"^2.15.0\"\n\n\"nuxt-edge\": \"latest\".<\/code><\/pre>\n\n\n\n<p>Installeer daarna alle afhankelijkheden opnieuw:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">garen installeren<\/code><\/pre>\n\n\n\n<p>Uw migratie met Nuxt Bridge is voltooid!<\/p>\n\n\n\n<p>Een andere manier is om <strong>Nuxt<\/strong> Bridge als ontwikkelingsafhankelijkheid:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code lang=\"javascript\" class=\"language-javascript\">yarn add --dev @nuxt\/bridge@npm:@nuxt\/bridge-edge<\/code><\/pre>\n\n\n\n<p>Dan moet je scripts in `package.json` bijwerken om rekening te houden met wijzigingen die de Nitro server in het bouwproces aanbrengt.<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/thecodest.co\/contact\"><img decoding=\"async\" src=\"\/app\/uploads\/2024\/05\/interested_in_cooperation_.png\" alt=\"vaandel samenwerking\"\/><\/a><\/figure>","protected":false},"excerpt":{"rendered":"<p>Nuxt 3 is de volgende generatie van het populaire hybride Vue framework, waarmee we Vue kunnen gebruiken voor het bouwen van server-side rendered applicaties. De b\u00e8taversie werd gelanceerd op 12 oktober 2021 en brengt in Nuxt Vue 3, een nieuwe intro engine, een lichtere bundel en adhook Vite.<\/p>","protected":false},"author":2,"featured_media":3478,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"inline_featured_image":false,"footnotes":""},"categories":[8],"tags":[],"class_list":["post-3477","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-software-development"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.3 (Yoast SEO v27.3) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Nuxt 3 - a Popular Hybrid Vue Framework - The Codest<\/title>\n<meta name=\"description\" content=\"Nuxt 3 is the next generation of the popular hybrid Vue framework, which allows us to use Vue for building server-side rendered applications. Beta version was launched on 12 October 2021, bringing into Nuxt Vue 3, a new intro engine, a lighter bundle and adhook Vite.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/thecodest.co\/nl\/blog\/nuxt-3-een-populair-hybride-vue-framework\/\" \/>\n<meta property=\"og:locale\" content=\"nl_NL\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Nuxt 3 - a Popular Hybrid Vue Framework\" \/>\n<meta property=\"og:description\" content=\"Nuxt 3 is the next generation of the popular hybrid Vue framework, which allows us to use Vue for building server-side rendered applications. Beta version was launched on 12 October 2021, bringing into Nuxt Vue 3, a new intro engine, a lighter bundle and adhook Vite.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/thecodest.co\/nl\/blog\/nuxt-3-een-populair-hybride-vue-framework\/\" \/>\n<meta property=\"og:site_name\" content=\"The Codest\" \/>\n<meta property=\"article:published_time\" content=\"2022-05-25T06:21:40+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-28T14:07:07+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/nuxt_3.png\" \/>\n\t<meta property=\"og:image:width\" content=\"960\" \/>\n\t<meta property=\"og:image:height\" content=\"540\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"thecodest\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"thecodest\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/\"},\"author\":{\"name\":\"thecodest\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/person\\\/7e3fe41dfa4f4e41a7baad4c6e0d4f76\"},\"headline\":\"Nuxt 3 &#8211; a Popular Hybrid Vue Framework\",\"datePublished\":\"2022-05-25T06:21:40+00:00\",\"dateModified\":\"2026-04-28T14:07:07+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/\"},\"wordCount\":700,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/nuxt_3.png\",\"articleSection\":[\"Software Development\"],\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/\",\"url\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/\",\"name\":\"Nuxt 3 - a Popular Hybrid Vue Framework - The Codest\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/nuxt_3.png\",\"datePublished\":\"2022-05-25T06:21:40+00:00\",\"dateModified\":\"2026-04-28T14:07:07+00:00\",\"description\":\"Nuxt 3 is the next generation of the popular hybrid Vue framework, which allows us to use Vue for building server-side rendered applications. Beta version was launched on 12 October 2021, bringing into Nuxt Vue 3, a new intro engine, a lighter bundle and adhook Vite.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/#breadcrumb\"},\"inLanguage\":\"nl-NL\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/#primaryimage\",\"url\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/nuxt_3.png\",\"contentUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/05\\\/nuxt_3.png\",\"width\":960,\"height\":540},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/blog\\\/nuxt-3-a-popular-hybrid-vue-framework\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/thecodest.co\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Nuxt 3 &#8211; a Popular Hybrid Vue Framework\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#website\",\"url\":\"https:\\\/\\\/thecodest.co\\\/\",\"name\":\"The Codest\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/thecodest.co\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"nl-NL\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#organization\",\"name\":\"The Codest\",\"url\":\"https:\\\/\\\/thecodest.co\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/03\\\/thecodest-logo.svg\",\"contentUrl\":\"https:\\\/\\\/thecodest.co\\\/app\\\/uploads\\\/2024\\\/03\\\/thecodest-logo.svg\",\"width\":144,\"height\":36,\"caption\":\"The Codest\"},\"image\":{\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/pl.linkedin.com\\\/company\\\/codest\",\"https:\\\/\\\/clutch.co\\\/profile\\\/codest\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/thecodest.co\\\/#\\\/schema\\\/person\\\/7e3fe41dfa4f4e41a7baad4c6e0d4f76\",\"name\":\"thecodest\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"nl-NL\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g\",\"caption\":\"thecodest\"},\"url\":\"https:\\\/\\\/thecodest.co\\\/nl\\\/author\\\/thecodest\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Nuxt 3 - een populair hybride Vue raamwerk - The Codest","description":"Nuxt 3 is de volgende generatie van het populaire hybride Vue framework, waarmee we Vue kunnen gebruiken voor het bouwen van server-side rendered applicaties. De b\u00e8taversie werd gelanceerd op 12 oktober 2021 en brengt in Nuxt Vue 3, een nieuwe intro engine, een lichtere bundel en adhook Vite.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/thecodest.co\/nl\/blog\/nuxt-3-een-populair-hybride-vue-framework\/","og_locale":"nl_NL","og_type":"article","og_title":"Nuxt 3 - a Popular Hybrid Vue Framework","og_description":"Nuxt 3 is the next generation of the popular hybrid Vue framework, which allows us to use Vue for building server-side rendered applications. Beta version was launched on 12 October 2021, bringing into Nuxt Vue 3, a new intro engine, a lighter bundle and adhook Vite.","og_url":"https:\/\/thecodest.co\/nl\/blog\/nuxt-3-een-populair-hybride-vue-framework\/","og_site_name":"The Codest","article_published_time":"2022-05-25T06:21:40+00:00","article_modified_time":"2026-04-28T14:07:07+00:00","og_image":[{"width":960,"height":540,"url":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/nuxt_3.png","type":"image\/png"}],"author":"thecodest","twitter_card":"summary_large_image","twitter_misc":{"Written by":"thecodest","Est. reading time":"5 minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/#article","isPartOf":{"@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/"},"author":{"name":"thecodest","@id":"https:\/\/thecodest.co\/#\/schema\/person\/7e3fe41dfa4f4e41a7baad4c6e0d4f76"},"headline":"Nuxt 3 &#8211; a Popular Hybrid Vue Framework","datePublished":"2022-05-25T06:21:40+00:00","dateModified":"2026-04-28T14:07:07+00:00","mainEntityOfPage":{"@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/"},"wordCount":700,"commentCount":0,"publisher":{"@id":"https:\/\/thecodest.co\/#organization"},"image":{"@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/#primaryimage"},"thumbnailUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/nuxt_3.png","articleSection":["Software Development"],"inLanguage":"nl-NL","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/","url":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/","name":"Nuxt 3 - een populair hybride Vue raamwerk - The Codest","isPartOf":{"@id":"https:\/\/thecodest.co\/#website"},"primaryImageOfPage":{"@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/#primaryimage"},"image":{"@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/#primaryimage"},"thumbnailUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/nuxt_3.png","datePublished":"2022-05-25T06:21:40+00:00","dateModified":"2026-04-28T14:07:07+00:00","description":"Nuxt 3 is de volgende generatie van het populaire hybride Vue framework, waarmee we Vue kunnen gebruiken voor het bouwen van server-side rendered applicaties. De b\u00e8taversie werd gelanceerd op 12 oktober 2021 en brengt in Nuxt Vue 3, een nieuwe intro engine, een lichtere bundel en adhook Vite.","breadcrumb":{"@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/#breadcrumb"},"inLanguage":"nl-NL","potentialAction":[{"@type":"ReadAction","target":["https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/"]}]},{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/#primaryimage","url":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/nuxt_3.png","contentUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/05\/nuxt_3.png","width":960,"height":540},{"@type":"BreadcrumbList","@id":"https:\/\/thecodest.co\/blog\/nuxt-3-a-popular-hybrid-vue-framework\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/thecodest.co\/"},{"@type":"ListItem","position":2,"name":"Nuxt 3 &#8211; a Popular Hybrid Vue Framework"}]},{"@type":"WebSite","@id":"https:\/\/thecodest.co\/#website","url":"https:\/\/thecodest.co\/","name":"The Codest","description":"","publisher":{"@id":"https:\/\/thecodest.co\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/thecodest.co\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"nl-NL"},{"@type":"Organization","@id":"https:\/\/thecodest.co\/#organization","name":"The Codest","url":"https:\/\/thecodest.co\/","logo":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/thecodest.co\/#\/schema\/logo\/image\/","url":"https:\/\/thecodest.co\/app\/uploads\/2024\/03\/thecodest-logo.svg","contentUrl":"https:\/\/thecodest.co\/app\/uploads\/2024\/03\/thecodest-logo.svg","width":144,"height":36,"caption":"The Codest"},"image":{"@id":"https:\/\/thecodest.co\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/pl.linkedin.com\/company\/codest","https:\/\/clutch.co\/profile\/codest"]},{"@type":"Person","@id":"https:\/\/thecodest.co\/#\/schema\/person\/7e3fe41dfa4f4e41a7baad4c6e0d4f76","name":"thecodest","image":{"@type":"ImageObject","inLanguage":"nl-NL","@id":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/5dbfe6a1e8c86e432e8812759e34e6fe82ebac75119ae3237a6c1311fa19caf4?s=96&d=mm&r=g","caption":"thecodest"},"url":"https:\/\/thecodest.co\/nl\/author\/thecodest\/"}]}},"_links":{"self":[{"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/posts\/3477","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/comments?post=3477"}],"version-history":[{"count":8,"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/posts\/3477\/revisions"}],"predecessor-version":[{"id":8376,"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/posts\/3477\/revisions\/8376"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/media\/3478"}],"wp:attachment":[{"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/media?parent=3477"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/categories?post=3477"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/thecodest.co\/nl\/wp-json\/wp\/v2\/tags?post=3477"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}