[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"global":3,"footer-navigation":18,"main-menu-products":239,"main-menu-blog-posts":355,"blog-post-web-applikationen-mit-nuxtjs":409},[4,13],{"globalSet":5},{"alertBannerList":6},[7],{"id":8,"title":9,"alertType":10,"description":11,"linkLabel":12,"linkField":12},"4647","Dies ist eine Beta-Version der neuen cyon-Website","warning","\u003Cp>Einige Funktionen funktionieren möglicherweise \u003Cstrong>nicht\u003C\u002Fstrong> wie erwartet.\u003C\u002Fp>",null,{"globalSet":14},{"tokens":15},[16],{"key":17,"value":17},"",{"footerNavigation":19,"googleRating":234},{"footerMenu":20},[21,77,100,128,151,215],{"title":22,"footerMenuItems":23},"Hosting",[24,39,48,57,68],{"title":25,"footerMenuItemLink":26},"Webhosting",{"__typename":27,"type":28,"label":12,"link":29,"url":30,"urlSuffix":12,"entry":31},"LinkData","entry","\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fwebhosting\">Webhosting\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fwebhosting",{"id":32,"uri":33,"slug":34,"title":25,"enabled":35,"typeHandle":36,"sectionHandle":37,"__typename":38},"736","hosting\u002Fwebhosting","webhosting",true,"productPageHostings","products","productPageHostings_Entry",{"title":40,"footerMenuItemLink":41},"Webhosting Pro",{"__typename":27,"type":28,"label":12,"link":42,"url":43,"urlSuffix":12,"entry":44},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fwebhosting-pro\">Webhosting Pro\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fwebhosting-pro",{"id":45,"uri":46,"slug":47,"title":40,"enabled":35,"typeHandle":36,"sectionHandle":37,"__typename":38},"5348","hosting\u002Fwebhosting-pro","webhosting-pro",{"title":49,"footerMenuItemLink":50},"Sitebuilder",{"__typename":27,"type":28,"label":12,"link":51,"url":52,"urlSuffix":12,"entry":53},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fsitebuilder\">Sitebuilder\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fsitebuilder",{"id":54,"uri":55,"slug":56,"title":49,"enabled":35,"typeHandle":36,"sectionHandle":37,"__typename":38},"5360","hosting\u002Fsitebuilder","sitebuilder",{"title":58,"footerMenuItemLink":59},"https:\u002F\u002F für alle",{"__typename":27,"type":28,"label":12,"link":60,"url":61,"urlSuffix":12,"entry":62},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fssl\">https:\u002F\u002F für alle\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fssl",{"id":63,"uri":64,"slug":65,"title":58,"enabled":35,"typeHandle":66,"sectionHandle":37,"__typename":67},"4388","hosting\u002Fssl","ssl","productPageMeta","productPageMeta_Entry",{"title":69,"footerMenuItemLink":70},"Umzugsservice",{"__typename":27,"type":28,"label":12,"link":71,"url":72,"urlSuffix":12,"entry":73},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fumzug\">Umzugsservice\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fumzug",{"id":74,"uri":75,"slug":76,"title":69,"enabled":35,"typeHandle":66,"sectionHandle":37,"__typename":67},"4365","hosting\u002Fumzug","umzug",{"title":78,"footerMenuItems":79},"Server",[80,89],{"title":81,"footerMenuItemLink":82},"Managed Server",{"__typename":27,"type":28,"label":12,"link":83,"url":84,"urlSuffix":12,"entry":85},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fserver\u002Fmanaged-server\">Managed Server\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fserver\u002Fmanaged-server",{"id":86,"uri":87,"slug":88,"title":81,"enabled":35,"typeHandle":36,"sectionHandle":37,"__typename":38},"5355","server\u002Fmanaged-server","managed-server",{"title":90,"footerMenuItemLink":91},"Agency Server",{"__typename":27,"type":28,"label":12,"link":92,"url":93,"urlSuffix":12,"entry":94},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fserver\u002Fagency-server\">Agency Server\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fserver\u002Fagency-server",{"id":95,"uri":96,"slug":97,"title":90,"enabled":35,"typeHandle":98,"sectionHandle":37,"__typename":99},"1444","server\u002Fagency-server","agency-server","productPageAgency","productPageAgency_Entry",{"title":101,"footerMenuItems":102},"Domains",[103,113,122],{"title":101,"footerMenuItemLink":104},{"__typename":27,"type":28,"label":12,"link":105,"url":106,"urlSuffix":12,"entry":107},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fdomains\u002Fdomain-kaufen\">Domains\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fdomains\u002Fdomain-kaufen",{"id":108,"uri":109,"slug":110,"title":101,"enabled":35,"typeHandle":111,"sectionHandle":37,"__typename":112},"3330","domains\u002Fdomain-kaufen","domain-kaufen","productPageDomain","productPageDomain_Entry",{"title":114,"footerMenuItemLink":115},"Domain transferieren",{"__typename":27,"type":28,"label":12,"link":116,"url":117,"urlSuffix":12,"entry":118},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fdomains\u002Fdomain-transferieren\">Domain transferieren\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fdomains\u002Fdomain-transferieren",{"id":119,"uri":120,"slug":121,"title":114,"enabled":35,"typeHandle":36,"sectionHandle":37,"__typename":38},"4114","domains\u002Fdomain-transferieren","domain-transferieren",{"title":123,"footerMenuItemLink":124},"Alle Domains",{"__typename":27,"type":125,"label":12,"link":126,"url":127,"urlSuffix":12,"entry":12},"url","\u003Ca href=\"\u002Fdomains\u002Falle-domains\">\u002Fdomains\u002Falle-domains\u003C\u002Fa>","\u002Fdomains\u002Falle-domains",{"title":129,"footerMenuItems":130},"Support",[131,136,141,146],{"title":132,"footerMenuItemLink":133},"Support Center",{"__typename":27,"type":125,"label":12,"link":134,"url":135,"urlSuffix":12,"entry":12},"\u003Ca href=\"\u002Fsupport\">\u002Fsupport\u003C\u002Fa>","\u002Fsupport",{"title":137,"footerMenuItemLink":138},"E-Mail Zauberer",{"__typename":27,"type":125,"label":12,"link":139,"url":140,"urlSuffix":12,"entry":12},"\u003Ca href=\"\u002Fsupport\u002Fmailwizard\">\u002Fsupport\u002Fmailwizard\u003C\u002Fa>","\u002Fsupport\u002Fmailwizard",{"title":142,"footerMenuItemLink":143},"my.cyon",{"__typename":27,"type":125,"label":12,"link":144,"url":145,"urlSuffix":12,"entry":12},"\u003Ca href=\"https:\u002F\u002Fmy.cyon.ch\u002F\">my.cyon.ch\u003C\u002Fa>","https:\u002F\u002Fmy.cyon.ch\u002F",{"title":147,"footerMenuItemLink":148},"Webmail",{"__typename":27,"type":125,"label":12,"link":149,"url":150,"urlSuffix":12,"entry":12},"\u003Ca href=\"https:\u002F\u002Fwebmail.cyon.ch\u002F\">webmail.cyon.ch\u003C\u002Fa>","https:\u002F\u002Fwebmail.cyon.ch\u002F",{"title":152,"footerMenuItems":153},"Über uns",[154,166,176,186,195,204,206,208,210],{"title":155,"footerMenuItemLink":156},"Warum cyon",{"__typename":27,"type":28,"label":12,"link":157,"url":158,"urlSuffix":12,"entry":159},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fcyon-macht-das-internet-zu-einem-besseren-ort\">cyon macht das Internet zu einem besseren Ort\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fcyon-macht-das-internet-zu-einem-besseren-ort",{"id":160,"uri":161,"slug":162,"title":163,"enabled":35,"typeHandle":164,"sectionHandle":164,"__typename":165},"2016","ueber-cyon\u002Fcyon-macht-das-internet-zu-einem-besseren-ort","cyon-macht-das-internet-zu-einem-besseren-ort","cyon macht das Internet zu einem besseren Ort","about","about_Entry",{"title":167,"footerMenuItemLink":168},"Team",{"__typename":27,"type":28,"label":12,"link":169,"url":170,"urlSuffix":12,"entry":171},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fteam\">Unser Team\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fteam",{"id":172,"uri":173,"slug":174,"title":175,"enabled":35,"typeHandle":164,"sectionHandle":164,"__typename":165},"2029","ueber-cyon\u002Fteam","team","Unser Team",{"title":177,"footerMenuItemLink":178},"Jobs",{"__typename":27,"type":28,"label":12,"link":179,"url":180,"urlSuffix":12,"entry":181},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fjobs\">Jobs bei cyon\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fjobs",{"id":182,"uri":183,"slug":184,"title":185,"enabled":35,"typeHandle":164,"sectionHandle":164,"__typename":165},"3760","ueber-cyon\u002Fjobs","jobs","Jobs bei cyon",{"title":187,"footerMenuItemLink":188},"Geschichte",{"__typename":27,"type":28,"label":12,"link":189,"url":190,"urlSuffix":12,"entry":191},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fgeschichte\">Geschichte\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fgeschichte",{"id":192,"uri":193,"slug":194,"title":187,"enabled":35,"typeHandle":164,"sectionHandle":164,"__typename":165},"3819","ueber-cyon\u002Fgeschichte","geschichte",{"title":196,"footerMenuItemLink":197},"Partner*innen",{"__typename":27,"type":28,"label":12,"link":198,"url":199,"urlSuffix":12,"entry":200},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fpartner\">Partner*innen\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fueber-cyon\u002Fpartner",{"id":201,"uri":202,"slug":203,"title":196,"enabled":35,"typeHandle":164,"sectionHandle":164,"__typename":165},"3861","ueber-cyon\u002Fpartner","partner",{"title":205,"footerMenuItemLink":12},"Engagement",{"title":207,"footerMenuItemLink":12},"Nachhaltigkeit",{"title":209,"footerMenuItemLink":12},"Infrastruktur",{"title":211,"footerMenuItemLink":212},"Blog",{"__typename":27,"type":125,"label":12,"link":213,"url":214,"urlSuffix":12,"entry":12},"\u003Ca href=\"\u002Fblog\">\u002Fblog\u003C\u002Fa>","\u002Fblog",{"title":216,"footerMenuItems":217},"Rechtliches",[218,230,232],{"title":219,"footerMenuItemLink":220},"AGB",{"__typename":27,"type":28,"label":12,"link":221,"url":222,"urlSuffix":12,"entry":223},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Flegal\u002Fagb\">AGB\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Flegal\u002Fagb",{"id":224,"uri":225,"slug":226,"title":219,"enabled":35,"typeHandle":227,"sectionHandle":228,"__typename":229},"6225","legal\u002Fagb","agb","legalPage","legalPages","legalPage_Entry",{"title":231,"footerMenuItemLink":12},"Datenschutzerklärung",{"title":233,"footerMenuItemLink":12},"Impressum",{"heroContent":235},{"__typename":236,"googleRating":237},"heroContent_ContentBlock",{"stars":238},4.8,{"productsEntries":240,"productMetaMenuSections":319,"aboutEntries":323,"aboutMenuSections":350},[241,249,256,263,271,278,286,292,306,314],{"__typename":38,"title":25,"uri":33,"color":242,"subtitle":243,"productMenuSection":244,"productIcon":246},"cherry","Alles, was deine Website braucht",[245],"hosting",[247],{"url":248},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fcherry.svg",{"__typename":38,"title":40,"uri":46,"color":250,"subtitle":251,"productMenuSection":252,"productIcon":253},"plum","Mehr Power für anspruchsvolle Webprojekte",[245],[254],{"url":255},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fplum.svg",{"__typename":38,"title":49,"uri":55,"color":257,"subtitle":258,"productMenuSection":259,"productIcon":260},"strawberry","Deine eigene Website, überraschend einfach gemacht.",[245],[261],{"url":262},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fstrawberry.svg",{"__typename":38,"title":81,"uri":87,"color":264,"subtitle":265,"productMenuSection":266,"productIcon":268},"pear","Dein eigener Server. Wir kümmern uns um den Rest.",[267],"server",[269],{"url":270},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fpear.svg",{"__typename":99,"title":90,"uri":96,"color":272,"subtitle":273,"productMenuSection":274,"productIcon":275},"grape","Deine Kundschaft, dein Server.",[267],[276],{"url":277},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fgrape.svg",{"__typename":112,"title":101,"uri":109,"color":279,"subtitle":280,"productMenuSection":281,"productIcon":283},"bee","Alles beginnt mit deiner Domain",[282],"domains",[284],{"url":285},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fbee.svg",{"__typename":38,"title":114,"uri":120,"color":279,"subtitle":287,"productMenuSection":288,"productIcon":289},"Gönn deiner Domain ein schöneres Zuhause",[282],[290],{"url":291},"https:\u002F\u002Fcms.production-edge.cyon.ch\u002Ffiles\u002Fimages\u002FProduct-Icons\u002Fflower.svg",{"__typename":67,"title":293,"uri":294,"metaMenuTitle":295,"iconSelect":298,"productMenuSection":299,"directLink":300},"my.cyon: Ein Login für alles","hosting\u002Fmy-cyon",[296],{"title":297},"Services","apps",[245,267,282],{"__typename":27,"type":28,"label":12,"link":301,"url":302,"urlSuffix":12,"entry":303},"\u003Ca href=\"http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fmy-cyon\">my.cyon: Ein Login für alles\u003C\u002Fa>","http:\u002F\u002Flocalhost:3000\u002Fhosting\u002Fmy-cyon",{"id":304,"uri":294,"slug":305,"title":293,"enabled":35,"typeHandle":66,"sectionHandle":37,"__typename":67},"5322","my-cyon",{"__typename":67,"title":69,"uri":75,"metaMenuTitle":307,"iconSelect":309,"productMenuSection":310,"directLink":311},[308],{"title":297},"rocket",[245,267],{"__typename":27,"type":125,"label":12,"link":312,"url":313,"urlSuffix":12,"entry":12},"\u003Ca href=\"https:\u002F\u002Forder.cyon.ch\u002Forder\u002Fpublic\u002Fdomains\">order.cyon.ch\u002Forder\u002Fpublic\u002Fdomains\u003C\u002Fa>","https:\u002F\u002Forder.cyon.ch\u002Forder\u002Fpublic\u002Fdomains",{"__typename":67,"title":58,"uri":64,"metaMenuTitle":315,"iconSelect":317,"productMenuSection":318,"directLink":12},[316],{"title":297},"certificate",[245,267],[320,321],{"title":297},{"title":322},"Preise",[324,329,333,337,341,344],{"label":325,"uri":161,"aboutMenuTitle":326,"iconSelect":328,"directLink":12},"Über cyon",[327],{"title":325},"mood-smile",{"label":167,"uri":173,"aboutMenuTitle":330,"iconSelect":332,"directLink":12},[331],{"title":325},"users-group",{"label":177,"uri":183,"aboutMenuTitle":334,"iconSelect":336,"directLink":12},[335],{"title":325},"book",{"label":187,"uri":193,"aboutMenuTitle":338,"iconSelect":340,"directLink":12},[339],{"title":325},"file-description",{"label":196,"uri":202,"aboutMenuTitle":342,"iconSelect":298,"directLink":12},[343],{"title":325},{"label":207,"uri":345,"aboutMenuTitle":346,"iconSelect":349,"directLink":12},"ueber-cyon\u002Fnachhaltigkeit",[347],{"title":348},"Verantwortung & Vertrauen","leaf",[351,352,353],{"title":325},{"title":348},{"title":354},"Team & Kultur",[356,383],{"title":357,"commentCount":358,"categories":359,"slug":365,"excerpt":366,"featuredImage":367,"seo":370,"author":373,"date":381,"id":382},"Phishing-Angriffe: Was wir täglich dagegen tun",3,{"nodes":360},[361,363],{"id":362,"name":211},"dGVybTozNQ==",{"id":364,"name":325},"dGVybTo2NzAz","phishing-angriffe-was-wir-taeglich-dagegen-tun","\u003Cp>«Wurden wir gehackt?» Diese Frage hören wir von unserer Kundschaft im Support immer wieder, sagt Lindita, Customer Care Specialist bei cyon. Die Nachricht wirkt bedrohlich: Da steht die eigene Domain, eine bekannte E-Mail-Adresse, vielleicht sogar ein Ablaufdatum. Alles klingt echt. Entsprechend gross ist die Unsicherheit. In solchen Situationen weisst du vielleicht nicht, wie du die […]\u003C\u002Fp>\n",{"node":368},{"sourceUrl":369},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2026\u002F03\u002Fphishing-angriffe.png",{"opengraphImage":371},{"mediaItemUrl":372},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2026\u002F03\u002Fphishing-angriffe-fb-li.jpg",{"node":374},{"id":375,"name":376,"email":377,"avatar":378},"dXNlcjozNw==","Svetlana Marchenko","sma@cyon.ch",{"url":379,"height":380,"width":380},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002Fa996559fe3a54e54474180cf9fd6292eb26e2bc18f22d8a3039785e3cdd14b53?s=96&d=mm&r=g",96,"2026-03-19T14:00:14","cG9zdDoyMjU0OQ==",{"title":384,"commentCount":385,"categories":386,"slug":392,"excerpt":393,"featuredImage":394,"seo":397,"author":400,"date":407,"id":408},"Welche Domains bei cyon am häufigsten registriert werden?",2,{"nodes":387},[388,389],{"id":362,"name":211},{"id":390,"name":391},"dGVybTo2NzAy","Neuigkeiten","cyon-domain-rangliste","\u003Cp>Die Wahl der passenden Domain-Endung ist ein zentraler Schritt für jede Website. Sie prägt, wie dein Projekt wahrgenommen wird, welche Zielgruppe du erreichst und wie klar dein Auftritt positioniert ist. In diesem Beitrag werfen wir einen Blick auf die beliebtesten Domain-Endungen unserer Kundinnen und Kunden, zeigen Entwicklungen der letzten Jahre auf und ordnen ein, was […]\u003C\u002Fp>\n",{"node":395},{"sourceUrl":396},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2026\u002F02\u002Fdomain-endungen.png",{"opengraphImage":398},{"mediaItemUrl":399},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2026\u002F02\u002Fdomain-endungen-fb-li.png",{"node":401},{"id":402,"name":403,"email":404,"avatar":405},"dXNlcjozMg==","Mona Sorcelli","mos@cyon.ch",{"url":406,"height":380,"width":380},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002Fb2a78212ccc46cd4dbd3c34c1e94df688a1397ff1fda06be5dcd76c3ec142043?s=96&d=mm&r=g","2026-02-12T16:23:59","cG9zdDoyMjUxOQ==",{"id":410,"databaseId":411,"slug":412,"title":413,"content":414,"date":415,"modified":416,"commentCount":417,"status":418,"featuredImage":12,"categories":419,"seo":425,"author":433,"comments":440},"cG9zdDoxMjIxMQ==",12211,"web-applikationen-mit-nuxtjs","Web-Applikationen mit NuxtJS entwickeln","\u003Cp>Web-Applikationen mit dem JavaScript-Framework \u003Ca href=\"https:\u002F\u002Fvuejs.org\u002F\">Vue.js\u003C\u002Fa> aufzusetzen ist nicht immer ganz trivial. In die Bresche springt hier ein weiteres Framework, das unter anderem auf Vue basiert: \u003Ca href=\"https:\u002F\u002Fnuxt.com\u002F\">NuxtJS\u003C\u002Fa>. Nuxt kann zum einen für sogenannte «Universelle Applikationen» eingesetzt werden, die auf dem Server generiert werden. Zum anderen sind damit auch «Single Page Applications» (SPA) sowie \u003Ca href=\"https:\u002F\u002Fwww.cyon.ch\u002Fblog\u002Fstatic-site-generators\" title=\"Static Site Generators: Schnelle und sichere Websites\">statisch generierte Applikationen\u003C\u002Fa> möglich.\u003C\u002Fp>\n\u003Cp>\u003Cimg loading=\"lazy\" decoding=\"async\" src=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fwebapplikationen-nuxt-600x315.png\" alt=\"Web-Applikationen mit NuxtJS entwickeln.\" width=\"600\" height=\"315\" class=\"alignnone size-large wp-image-12220\" srcset=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fwebapplikationen-nuxt-600x315.png 600w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fwebapplikationen-nuxt-576x302.png 576w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fwebapplikationen-nuxt-768x403.png 768w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fwebapplikationen-nuxt.png 1200w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \u002F>\u003C\u002Fp>\n\u003Cp>Das Framework integriert andere wichtige Bibliotheken, welche für die Entwicklung von Applikationen verwendet werden. So werden z. B. der \u003Ca href=\"https:\u002F\u002Frouter.vuejs.org\u002F\">Vue Router\u003C\u002Fa> oder die State Management Library \u003Ca href=\"https:\u002F\u002Fvuex.vuejs.org\u002F\">Vuex\u003C\u002Fa> bereits mitgeliefert . Dabei gibt Nuxt eine bestimmte Verzeichnisstruktur vor, wie die Applikation organisiert werden muss. Ausserdem integriert das Framework die Tools \u003Ca href=\"https:\u002F\u002Fwebpack.js.org\u002F\">Webpack\u003C\u002Fa> und \u003Ca href=\"https:\u002F\u002Fbabeljs.io\u002F\">Babel\u003C\u002Fa>. Ich zeige heute, wie man eine einfache Nuxt-Applikation in wenigen Schritten aufgesetzt hat.\u003C\u002Fp>\n\u003Caside class=\"explanation\">\n\u003Ch3>Community für Vue-Fans\u003C\u002Fh3>\n\u003Cp>Seit 2018 treffen sich Vue-Interessierte regelmässig zum Meetup \u003Ca href=\"https:\u002F\u002Fwww.cyon.ch\u002Fblog\u002Fneue-meetup-reihe-vue-basel\" title=\"https:\u002F\u002Fblog.cyon.ch\u002FNeue-Meetup-Reihe-Vue-Basel\">Vue Basel\u003C\u002Fa> in den cyon-Büros. Sehen wir Dich bei einem der \u003Ca href=\"https:\u002F\u002Fwww.meetup.com\u002Fvue-basel\u002Fevents\u002F\">nächsten Events\u003C\u002Fa>?\n\u003C\u002Fp>\n\u003C\u002Faside>\n\u003Ch2>Startschuss: Ein neues Nuxt-Projekt erstellen\u003C\u002Fh2>\n\u003Cp>Um ein neues Projekt zu initialisieren, nutzen wir die Library \u003Ccode>\u003Ca href=\"https:\u002F\u002Fwww.npmjs.com\u002Fpackage\u002Fcreate-nuxt-app\">create-nuxt-app\u003C\u002Fa>\u003C\u002Fcode>. Damit das funktioniert, installieren wir zuerst \u003Ca href=\"https:\u002F\u002Fnodejs.org\u002Fen\">Node.js\u003C\u002Fa> sowie die passende Paketverwaltung \u003Ccode>npm\u003C\u002Fcode>, die automatisch mit Node.js mitgeliefert wird. Dann kann es losgehen: Mit dem Befehl \u003Ccode>npx create-nuxt-app my-web-app\u003C\u002Fcode> starten wir den Assistenten, der uns durch die Erstellung der neuen Applikation begleitet.\u003C\u002Fp>\n\u003Cp>\u003Cimg loading=\"lazy\" decoding=\"async\" src=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fcreate-nuxt-app-600x696.png\" alt=\"Startschuss: Ein neues Nuxt-Projekt erstellen.\" width=\"600\" height=\"696\" class=\"alignnone size-large wp-image-12212\" srcset=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fcreate-nuxt-app-600x696.png 600w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fcreate-nuxt-app-576x668.png 576w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fcreate-nuxt-app-768x890.png 768w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fcreate-nuxt-app.png 1200w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \u002F>\u003C\u002Fp>\n\u003Cp>Im letzten Schritt werden wir nach dem «Rendering Mode» gefragt. Wir wählen hier die Option «Single Page App». Dies bedeutet, dass wir eine normale Single Page Application bauen, ohne dabei «Server Side Rendering» (SSR) zu nutzen. Nach einem Wechsel in das Verzeichnis, wo Nuxt die Applikation generiert hat, können wir die Applikation bzw. den Entwicklungs-Server mit dem Befehl \u003Ccode>npm run dev\u003C\u002Fcode> starten.\u003C\u002Fp>\n\u003Ch2>Das Aussehen: Layouts\u003C\u002Fh2>\n\u003Cp>Im Verzeichnis \u003Ccode>layouts\u002F\u003C\u002Fcode> finden wir zu Beginn eine Datei mit dem Namen \u003Ccode>default.vue\u003C\u002Fcode>. Sie bestimmt das Layout, das für alle Seiten der Applikation verwendet wird. Hier könnten wir nun verschiedene Layouts definieren, vorerst reicht es aber, wenn wir das vorgegebene Layout editieren.\u003C\u002Fp>\n\u003Cp>Die Datei ist das Grundgerüst für alle Seiten und definiert, wie diese dargestellt werden sollen. Wir möchten nun einen einfachen Header einbauen und fügen im Template folgenden Codeblock vor \u003Ccode><nuxt \u002F>\u003C\u002Fcode> ein:\u003C\u002Fp>\n\u003Cpre>\u003Ccode><nav>\r\n  <span>My app<\u002Fspan>\r\n  <nuxt-link to="\u002Fabout">About us<\u002Fnuxt-link>\r\n<\u002Fnav>\r\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Mit dem Codeblock haben wir hier auch gleich einen Link auf die Seite \u003Ccode>\u002Fabout\u003C\u002Fcode> eingefügt, weshalb wir diese Seite jetzt noch erstellen müssen. Alles was es dafür braucht, ist eine Datei im Ordner \u003Ccode>pages\u002F\u003C\u002Fcode> mit dem Namen \u003Ccode>about.vue\u003C\u002Fcode>.\u003C\u002Fp>\n\u003Ch2>Der Inhalt: Pages\u003C\u002Fh2>\n\u003Cp>Das Routing einer Seite, sprich die Zusammensetzung der URL, ergibt sich bei Nuxt immer aus der Verzeichnisstruktur. Das bedeutet, dass unsere Datei \u003Ccode>about.vue\u003C\u002Fcode> unter der Adresse \u003Ccode>\u002Fabout\u003C\u002Fcode> erreichbar ist.\u003C\u002Fp>\n\u003Cp>Wir füllen die Datei nun mit Inhalt:\u003C\u002Fp>\n\u003Cpre>\u003Ccode><template>\r\n  <div>\r\n    <h1>Über uns<\u002Fh1>\r\n    <p>Das ist unsere Über-uns-Seite. Wir erstellen heute eine Website mit Nuxt.<\u002Fp>\r\n  <\u002Fdiv>\r\n<\u002Ftemplate>\r\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Wenn wir jetzt in unserem Browser auf den «About us»-Link klicken, sehen wir auch gleich die neu erstellte Seite:\u003C\u002Fp>\n\u003Cp>\u003Cimg loading=\"lazy\" decoding=\"async\" src=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-pages-600x535.png\" alt=\"Der Inhalt: Pages.\" width=\"600\" height=\"535\" class=\"alignnone size-large wp-image-12213\" srcset=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-pages-600x535.png 600w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-pages-576x514.png 576w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-pages-768x685.png 768w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-pages.png 1200w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \u002F>\u003C\u002Fp>\n\u003Ch2>Der Wegweiser: Dynamisches Routing\u003C\u002Fh2>\n\u003Cp>Die Verzeichnisstruktur für Seiten kann auch dynamisch sein. Nehmen wir an, wir benötigen für verschiedene Benutzerinnen und Benutzer eine Detailansicht. Dazu erstellen wir im Verzeichnis \u003Ccode>pages\u002F\u003C\u002Fcode> einen neuen Ordner mit dem Namen \u003Ccode>users\u002F\u003C\u002Fcode> und dort wiederum eine Datei mit dem Namen \u003Ccode>_id.vue\u003C\u002Fcode>. Diese Datei befüllen wir danach mit folgendem Inhalt:\u003C\u002Fp>\n\u003Cpre>\u003Ccode><template>\r\n  <h1>Hallo Benutzer {{ $route.params.id }}<\u002Fh1>\r\n<\u002Ftemplate>\r\n<script>\r\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>In unserer Navigation können wir nun Links zu den verschiedenen Benutzerinnen und Benutzern setzen. Dazu erweitern wir die Datei \u003Ccode>default.vue\u003C\u002Fcode> im Verzeichnis \u003Ccode>layouts\u002F\u003C\u002Fcode> mit folgendem Code:\u003C\u002Fp>\n\u003Cpre>\u003Ccode><nuxt-link to="\u002Fusers\u002F1">Benutzerin 1<\u002Fnuxt-link>\r\n<nuxt-link to="\u002Fusers\u002F2">Benutzerin 2<\u002Fnuxt-link>\r\n\u003C\u002Fcode>\u003C\u002Fpre>\n\u003Cp>Im Browser präsentiert sich das dann so:\u003C\u002Fp>\n\u003Cp>\u003Cimg loading=\"lazy\" decoding=\"async\" src=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-routes-600x535.png\" alt=\"Der Wegweiser: Dynamisches Routing.\" width=\"600\" height=\"535\" class=\"alignnone size-large wp-image-12214\" srcset=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-routes-600x535.png 600w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-routes-576x514.png 576w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-routes-768x685.png 768w, https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fnuxt-routes.png 1200w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \u002F>\u003C\u002Fp>\n\u003Ch2>Bereit zur Veröffentlichung: Deployment\u003C\u002Fh2>\n\u003Cp>Sind wir mit der Applikation nun soweit, dass wir sie auf den Server laden können, klappt das mit Nuxt ebenso komfortabel wie die vorherigen Schritte. Mit dem Befehl \u003Ccode>npm run generate\u003C\u002Fcode> werden die nötigen Dateien im Verzeichnis \u003Ccode>dist\u002F\u003C\u002Fcode> generiert. Da es sich dabei um rein statische Dateien (HTML, CSS, Bilder und JavaScript) handelt, die nicht auf dem Server ausgeführt werden müssen, lässt sich die Applikation auf jedes erdenkliche Webhosting laden. Ob per FTP, SSH oder Git, uns sind keine Grenzen gesetzt. Ich wünsche viel Spass beim Ausprobieren ? \u003C\u002Fp>\n\u003Caside class=\"explanation\">\n\u003Ch3>TL;DR\u003C\u002Fh3>\n\u003Cp>Mit Nuxt lassen sich in kürzester Zeit hochwertige Web-Applikationen entwickeln. Dank der sehr guten Dokumentation findet man sich mit dem Framework schnell zurecht.\n\u003C\u002Fp>\n\u003C\u002Faside>\n","2020-01-31T11:39:59","2025-02-20T14:59:31",7,"publish",{"nodes":420},[421,422],{"id":362,"name":211},{"id":423,"name":424},"dGVybTo2NzA1","Entwicklung & Performance",{"fullHead":426,"metaDesc":427,"metaRobotsNofollow":428,"metaRobotsNoindex":429,"title":413,"opengraphModifiedTime":430,"opengraphImage":431},"\u003C!-- This site is optimized with the Yoast SEO Premium plugin  - https:\u002F\u002Fyoast.com\u002Fproduct\u002Fyoast-seo-premium-wordpress\u002F -->\n\u003Cmeta name=\"description\" content=\"Web-Applikationen mit Vue.js aufzusetzen ist nicht immer ganz trivial. In die Bresche springt ein weiteres Framework: NuxtJS.\" \u002F>\n\u003Clink rel=\"canonical\" href=\"https:\u002F\u002Fwww.cyon.ch\u002Fblog\u002Fweb-applikationen-mit-nuxtjs\" \u002F>\n\u003Cmeta property=\"og:locale\" content=\"de_DE\" \u002F>\n\u003Cmeta property=\"og:type\" content=\"article\" \u002F>\n\u003Cmeta property=\"og:title\" content=\"Web-Applikationen mit NuxtJS entwickeln\" \u002F>\n\u003Cmeta property=\"og:description\" content=\"Web-Applikationen mit Vue.js aufzusetzen ist nicht immer ganz trivial. In die Bresche springt ein weiteres Framework: NuxtJS.\" \u002F>\n\u003Cmeta property=\"og:url\" content=\"https:\u002F\u002Fwww.cyon.ch\u002Fblog\u002Fweb-applikationen-mit-nuxtjs\" \u002F>\n\u003Cmeta property=\"og:site_name\" content=\"cyon-Blog\" \u002F>\n\u003Cmeta property=\"article:publisher\" content=\"https:\u002F\u002Fwww.facebook.com\u002Fcyonhosting\" \u002F>\n\u003Cmeta property=\"article:published_time\" content=\"2020-01-31T10:39:59+00:00\" \u002F>\n\u003Cmeta property=\"article:modified_time\" content=\"2025-02-20T13:59:31+00:00\" \u002F>\n\u003Cmeta property=\"og:image\" content=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fwebapplikationen-nuxt.png\" \u002F>\n\t\u003Cmeta property=\"og:image:width\" content=\"1200\" \u002F>\n\t\u003Cmeta property=\"og:image:height\" content=\"630\" \u002F>\n\t\u003Cmeta property=\"og:image:type\" content=\"image\u002Fpng\" \u002F>\n\u003Cmeta name=\"author\" content=\"Max Gfeller\" \u002F>\n\u003Cmeta name=\"twitter:card\" content=\"summary_large_image\" \u002F>\n\u003Cmeta name=\"twitter:image\" content=\"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fwebapplikationen-nuxt-tw-card.png\" \u002F>\n\u003Cmeta name=\"twitter:creator\" content=\"@mgfeller\" \u002F>\n\u003Cmeta name=\"twitter:site\" content=\"@cyon\" \u002F>\n\u003Cmeta name=\"twitter:label1\" content=\"Verfasst von\" \u002F>\n\t\u003Cmeta name=\"twitter:data1\" content=\"Max Gfeller\" \u002F>\n\t\u003Cmeta name=\"twitter:label2\" content=\"Geschätzte Lesezeit\" \u002F>\n\t\u003Cmeta name=\"twitter:data2\" content=\"4 Minuten\" \u002F>\n\u003Cscript type=\"application\u002Fld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\u002F\\\u002Fschema.org\",\"@graph\":[{\"@type\":[\"Article\",\"BlogPosting\"],\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs#article\",\"isPartOf\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs\"},\"author\":{\"name\":\"Max Gfeller\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#\\\u002Fschema\\\u002Fperson\\\u002Fd17fccae011865b1974a32105b79b8e9\"},\"headline\":\"Web-Applikationen mit NuxtJS entwickeln\",\"datePublished\":\"2020-01-31T10:39:59+00:00\",\"dateModified\":\"2025-02-20T13:59:31+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs\"},\"wordCount\":653,\"commentCount\":7,\"publisher\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#organization\"},\"image\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs#primaryimage\"},\"thumbnailUrl\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2020\\\u002F01\\\u002Fwebapplikationen-nuxt-600x315.png\",\"keywords\":[\"JavaScript\",\"Vue\"],\"articleSection\":[\"Blog\",\"Entwicklung & Performance\"],\"inLanguage\":\"de-CH\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs\",\"url\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs\",\"name\":\"Web-Applikationen mit NuxtJS entwickeln\",\"isPartOf\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs#primaryimage\"},\"image\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs#primaryimage\"},\"thumbnailUrl\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2020\\\u002F01\\\u002Fwebapplikationen-nuxt-600x315.png\",\"datePublished\":\"2020-01-31T10:39:59+00:00\",\"dateModified\":\"2025-02-20T13:59:31+00:00\",\"description\":\"Web-Applikationen mit Vue.js aufzusetzen ist nicht immer ganz trivial. In die Bresche springt ein weiteres Framework: NuxtJS.\",\"breadcrumb\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs#breadcrumb\"},\"inLanguage\":\"de-CH\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de-CH\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs#primaryimage\",\"url\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2020\\\u002F01\\\u002Fwebapplikationen-nuxt-600x315.png\",\"contentUrl\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2020\\\u002F01\\\u002Fwebapplikationen-nuxt-600x315.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002Fweb-applikationen-mit-nuxtjs#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Web-Applikationen mit NuxtJS entwickeln\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#website\",\"url\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F\",\"name\":\"cyon-Blog\",\"description\":\"Herzlich. Nachhaltig. Schnell. Sicher. Ästhetisch. Unser Blog - Deine Plattform für inspirierende Hosting-News.\",\"publisher\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de-CH\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#organization\",\"name\":\"cyon\",\"url\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de-CH\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#\\\u002Fschema\\\u002Flogo\\\u002Fimage\\\u002F\",\"url\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2025\\\u002F06\\\u002Fo_RGB_ColorfulOnWhite-01.png\",\"contentUrl\":\"https:\\\u002F\\\u002Fblog.cyon.ch\\\u002Fwp-content\\\u002Fuploads\\\u002F2025\\\u002F06\\\u002Fo_RGB_ColorfulOnWhite-01.png\",\"width\":939,\"height\":938,\"caption\":\"cyon\"},\"image\":{\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#\\\u002Fschema\\\u002Flogo\\\u002Fimage\\\u002F\"},\"sameAs\":[\"https:\\\u002F\\\u002Fwww.facebook.com\\\u002Fcyonhosting\",\"https:\\\u002F\\\u002Fx.com\\\u002Fcyon\",\"https:\\\u002F\\\u002Fswiss.social\\\u002F@cyon\",\"https:\\\u002F\\\u002Finstagram.com\\\u002Fcyon.ch\\\u002F\",\"https:\\\u002F\\\u002Fwww.linkedin.com\\\u002Fcompany\\\u002F1876493\\\u002F\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fblog\\\u002F#\\\u002Fschema\\\u002Fperson\\\u002Fd17fccae011865b1974a32105b79b8e9\",\"name\":\"Max Gfeller\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de-CH\",\"@id\":\"https:\\\u002F\\\u002Fsecure.gravatar.com\\\u002Favatar\\\u002Fd8ce106672fef833e68cd38a0ed05d36000b78d49bcd495adf89564399b1c700?s=96&d=mm&r=g\",\"url\":\"https:\\\u002F\\\u002Fsecure.gravatar.com\\\u002Favatar\\\u002Fd8ce106672fef833e68cd38a0ed05d36000b78d49bcd495adf89564399b1c700?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\u002F\\\u002Fsecure.gravatar.com\\\u002Favatar\\\u002Fd8ce106672fef833e68cd38a0ed05d36000b78d49bcd495adf89564399b1c700?s=96&d=mm&r=g\",\"caption\":\"Max Gfeller\"},\"sameAs\":[\"https:\\\u002F\\\u002Fwww.cyon.ch\\\u002Fueber-uns\\\u002Fteam#mg\",\"https:\\\u002F\\\u002Fx.com\\\u002Fmgfeller\"]}]}\u003C\u002Fscript>\n\u003C!-- \u002F Yoast SEO Premium plugin. -->","Web-Applikationen mit Vue.js aufzusetzen ist nicht immer ganz trivial. In die Bresche springt ein weiteres Framework: NuxtJS.","follow","index","2025-02-20T13:59:31+00:00",{"mediaItemUrl":432},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2020\u002F01\u002Fwebapplikationen-nuxt.png",{"node":434},{"id":435,"email":436,"name":437,"avatar":438},"dXNlcjoxMw==","mg@cyon.ch","Max Gfeller",{"url":439,"height":380,"width":380},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002Fd8ce106672fef833e68cd38a0ed05d36000b78d49bcd495adf89564399b1c700?s=96&d=mm&r=g",{"nodes":441},[442,457,501,526],{"author":443,"content":451,"date":452,"dateGmt":453,"parentId":12,"databaseId":454,"replies":455},{"node":444},{"id":445,"email":446,"name":447,"avatar":448,"__typename":450},"Y29tbWVudF9hdXRob3I6MTc4NTA1","steven.brauer@webbrauer.ch","Steven",{"url":449,"height":380,"width":380},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002F364aa7d7d2fcc38f7522296e10fdbf2c80041e4189102f20baae0ade6d5d36c4?s=96&d=mm&r=g","CommentAuthor","\u003Cp>Es wäre mal interessant, warum cyon nicht node.js auf ihren Angeboten zur Verfügung stellt?\u003C\u002Fp>\n","2020-11-05 07:02:09","2020-11-05 06:02:09",178505,{"nodes":456},[],{"author":458,"content":465,"date":466,"dateGmt":467,"parentId":12,"databaseId":468,"replies":469},{"node":459},{"id":460,"email":461,"name":462,"avatar":463,"__typename":450},"Y29tbWVudF9hdXRob3I6MTc4MTQz","nicolas@paratainment.com","Nicolas",{"url":464,"height":380,"width":380},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002F0d30277bdf9c4cd96c8d33e46edb642a739c28c870231278a5ed81c55c5af123?s=96&d=mm&r=g","\u003Cp>Ich finde es noch pikant, dass ein Hoster einen interessanten Artikel über eine spannende Technologie schreibt, die man hier jedoch gar nicht richtig einsetzen kann. Da Suchmaschinen-Crawler kein JavaScript ausführen, ist man faktisch auf SSR angewiesen, damit die Webseite überhaupt im Internet gefunden wird. Daher taugen diese ganzen schönen Technologien für mich nur als Hobby-Projekt oder für Applikationen z. B. im geschäftlichen Intranet. Solange dies nicht anders ist, verwende ich meinen eigenen kleinen JS-Code, der kombiniert mit dem PHP-Backend eine AJAX\u002FSSR-Kombination ermöglicht. Es gäbe zudem auch PhpJS, eine PHP-Library, die JavaScript ausführt. Technisch möglicherweise ein bisschen ein Murks. Bei Cyon vermutlich nicht verfügbar, oder ich täusche mich. Es wäre immerhin ein guter Anfang.\u003C\u002Fp>\n\u003Cp>Was für Hosting-Lösungen\u002F-Varianten könnt ihr konkret empfehlen für jemanden, der diese Technologien heute ernsthaft einsetzen möchte?\u003C\u002Fp>\n","2020-02-06 18:11:37","2020-02-06 17:11:37",178143,{"nodes":470},[471,486],{"author":472,"content":479,"date":480,"dateGmt":481,"parentId":482,"databaseId":483,"replies":484},{"node":473},{"id":474,"email":475,"name":476,"avatar":477,"__typename":450},"Y29tbWVudF9hdXRob3I6MTc4Mjk3","sv@premiummedia.ch","Severin",{"url":478,"height":380,"width":380},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002Fea2121289ab17f36a0a8225a0c6055967c4291f872e9ee60c8b9db3c6b41aca8?s=96&d=mm&r=g","\u003Cp>Hi Nicolas\u003C\u002Fp>\n\u003Cp>Betreffend deiner Sorge wegen dem JavaScript-Crawling:\u003Cbr \u002F>\nZumindest der Google-Bot ist schon einige Zeit in der Lage, JavaScript während des Crawlens zu interpretieren. Dazu ein Artikel von Mai 2019: \u003Ca href=\"https:\u002F\u002Fwebmasters.googleblog.com\u002F2019\u002F05\u002Fthe-new-evergreen-googlebot.html\" rel=\"nofollow ugc\">https:\u002F\u002Fwebmasters.googleblog.com\u002F2019\u002F05\u002Fthe-new-evergreen-googlebot.html\u003C\u002Fa>\u003C\u002Fp>\n\u003Cp>LG Severin\u003C\u002Fp>\n","2020-05-06 10:17:08","2020-05-06 08:17:08","Y29tbWVudDoxNzgxNDM=",178297,{"nodes":485},[],{"author":487,"content":495,"date":496,"dateGmt":497,"parentId":482,"databaseId":498,"replies":499},{"node":488},{"id":489,"email":490,"name":491,"avatar":492,"__typename":494},"dXNlcjox","pz@cyon.ch","Philipp Zeder",{"url":493},"https:\u002F\u002Fblog.cyon.ch\u002Fwp-content\u002Fuploads\u002F2025\u002F03\u002Fcropped-pz-avatar-96x96.jpeg","User","\u003Cp>Hey Nicolas, merci für Dein Feedback. Wir sind generell sehr an neuen Technologien interessiert und schauen in unseren Blogbeiträgen auch immer gerne etwas über den Tellerrand. Du hast recht, SSR kannst Du (zumindest momentan) nicht mit unseren Angeboten nutzen. Wir haben als Beispiel daher auch die SPA- bzw. die Static-Variante gewählt. Für Applikationen die SSR benötigen finden wir ZEIT und deren Serverless Functions ganz spannend (\u003Ca href=\"https:\u002F\u002Fzeit.co\u002Fdocs\u002Fv2\u002Fserverless-functions\u002Fintroduction\" rel=\"nofollow ugc\">https:\u002F\u002Fzeit.co\u002Fdocs\u002Fv2\u002Fserverless-functions\u002Fintroduction\u003C\u002Fa>).\u003C\u002Fp>\n","2020-02-10 17:19:22","2020-02-10 16:19:22",178149,{"nodes":500},[],{"author":502,"content":509,"date":510,"dateGmt":511,"parentId":12,"databaseId":512,"replies":513},{"node":503},{"id":504,"email":505,"name":506,"avatar":507,"__typename":450},"Y29tbWVudF9hdXRob3I6MTc4MTM5","samuel@gleis6.ch","Sämi",{"url":508,"height":380,"width":380},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002F6cb6d9c95078ea63a25c2979e7cca65fc4bcdf9aebac0919372f0a9093b7be20?s=96&d=mm&r=g","\u003Cp>Hallo Aaron, danke für deinen Artikel! Ich bin ein grosser Fan von vue.js und habe die Libray schon länger im Einsatz. Mit Nuxt.js habe ich mich auch schon befasst, jedoch nur am Rande.\u003Cbr \u002F>\nDa eine Frage: Um kompliziertere Applikationen (z.B. Autentifikation) nutzen zu können, muss die Applikation auf dem Server gerendert werden (mode: SSR). Wird bei cyon in Zukunft Node.js vorhanden sein? Kann ich bald SSR nuxt.js Apps auf Schweizer Servern entwickeln? ??\u003Cbr \u002F>\nDanke für eine kurze Antwort! Lg\u003C\u002Fp>\n","2020-02-03 21:12:32","2020-02-03 20:12:32",178139,{"nodes":514},[515],{"author":516,"content":519,"date":520,"dateGmt":521,"parentId":522,"databaseId":523,"replies":524},{"node":517},{"id":489,"email":490,"name":491,"avatar":518,"__typename":494},{"url":493},"\u003Cp>Zurzeit kannst Du Node.js bei uns nicht nutzen. Ich vermerke Deinen Wunsch aber gerne beim entsprechenden Punkt auf unserer Feature-Request-Liste :)\u003C\u002Fp>\n","2020-02-04 09:14:35","2020-02-04 08:14:35","Y29tbWVudDoxNzgxMzk=",178140,{"nodes":525},[],{"author":527,"content":534,"date":535,"dateGmt":536,"parentId":12,"databaseId":537,"replies":538},{"node":528},{"id":529,"email":530,"name":531,"avatar":532,"__typename":450},"Y29tbWVudF9hdXRob3I6MTc4MTM4","public.aaron@gmail.com","Aaron",{"url":533,"height":380,"width":380},"https:\u002F\u002Fsecure.gravatar.com\u002Favatar\u002F0100adbfa4999c8f22070d77707157dd8ef0657b0dced9e9c4d35288298f9d05?s=96&d=mm&r=g","\u003Cp>Setze seit einiger Zeit auch Nuxt ein – macht wirklich Spass und hilft einem dabei den Projekten eine standardisierten Aufbau zu geben.\u003C\u002Fp>\n","2020-01-31 16:45:00","2020-01-31 15:45:00",178138,{"nodes":539},[]]