[{"data":1,"prerenderedAt":98},["ShallowReactive",2],{"blog-\u002Fblog\u002Fnuxt-gridsome\u002F":3},{"id":4,"title":5,"abstract":6,"author":7,"body":8,"cover_image":83,"date":84,"description":85,"extension":86,"meta":87,"navigation":88,"path":89,"published":88,"seo":90,"stacker":91,"stem":92,"tags":93,"updated":96,"__hash__":97},"blog\u002Fblog\u002Fnuxt-gridsome.md","Von Nuxt.JS zu Gridsome und wieder zurück","Ein cooles Framework mit Ecken und Kanten vs. einem 'Oldie' welcher doch nochmals so richtig Gas gibt.","Rolf Eggenberger",{"type":9,"value":10,"toc":78},"minimark",[11,24,31,34,47,52,55,58,65],[12,13,14,15,19,20,23],"p",{},"Entstanden als ",[16,17,18],"strong",{},"Vue.JS Alternative zu React\u002FGatsby"," bietet ",[16,21,22],{},"Gridsome"," viele hilfreiche Tools um in Kürze JAMStack konforme\nWebseiten zu entwickeln. Alte Wordpress Instanzen lassen sich damit zum Beispiel wunderbar in eine Headless Server\nArchitektur umwandeln, sodass Wordpress nur noch die Backend-API - also den Inhalt - zur Verfügung\nstellt, das Frontend jedoch statisch gerendert als reine HTML Dokumente auf dem Server abgelegt werden kann.\nVorbei mit Sicherheitsproblemen, regelmässigem Updatezwang und schlaflosen Nächsten bei PHP und Wordpress Core\nUpdates. Wie einfach dies geht hat unsere Entwicklerin Marielle Beusch an der letzten JAMStack Barconf der Web Professionals\nin einem Live Coding eindrücklich demonstriert.",[12,25,26,27,30],{},"Soweit so gut und alles (nach wie vor) eine tolle Sache. Nur: ",[16,28,29],{},"Nuxt.JS hat sich im letzten Jahr sehr\nstark weiterentwickelt"," und ist mittlerweile ein richtig mächtiges Framework in und mit einem Ökosystem geworden. Kinderkrankheiten der ersten Releases wurden\nausgebessert und die Perfomance sowohl im Build-Prozess als auch bezüglich SEO massiv optimiert.",[12,32,33],{},"Im Gegensatz zu den ersten Releases ist Nuxt.JS unter anderem dank folgenden Punkten wieder zurück an die Spitze gesprintet:",[35,36,37,41,44],"ul",{},[38,39,40],"li",{},"full static (die ersten Static Site builds waren noch etwas chaotisch, der ursprüngliche Fokus von Nuxt.JS lag auch eher beim SSR. Eher ungern erinnere ich mich an mein erstes Nuxt Projekt)",[38,42,43],{},"Verbesserung des Data Fetchings (nuxt\u002Fcontent)",[38,45,46],{},"verbesserte Search Engine Optimierung des gerenderten Codes",[48,49,51],"h2",{"id":50},"fazit","Fazit:",[12,53,54],{},"Die beiden Frameworks lassen sich nicht direkt vergleichen - genau so wenig wie sich VuePress auf einen direkten Vergleich mit den beiden einlassen muss.\nNach wie vor bietet Gridsome dank diversen Content Source Plugins eine einfache Lösung um bestehende Monolithen in die JAMStack Architektur\nzu überführen.",[12,56,57],{},"Nuxt.JS hingegen war schon immer ein flexibles und universelles Framework mit welchem sich sowohl Static Sites wie auch Server Side\nRendered Applications erstellen lassen. Und genau das macht es von Release zu Release immer besser.",[12,59,60,61,64],{},"Der grosse Unterschied zu Gridsome liegt\nim Wort ",[16,62,63],{},"Applications",". Nuxt.JS erlaubt eine viel ausgefeiltere Integration von Vue.JS und dessen Stärken in das Frontend als es Gridsome\nermöglichen kann. Aber Nuxt.JS hat auch das Data Fetching und Static Rendering mitterlweile so gut hinbekommen, dass die gängigen Search Engines\nwie Google etc. in fast allen Situationen den Content optimal indexieren können. Im static Mode wird die Grenze zwischen Pre-Rendering und\nData Fetching on demand sehr klein - und Nuxt rendert (auch über CI\u002FCD Provider wie Netlify etc.) genau so wie es soll. Was es für uns immer\nöfter zum Werkzeug unserer Wahl macht.",[12,66,67,68,73,77],{},"PS: Der gesamte Relaunch von ",[69,70],"a",{"href":71,"target":72},"https:\u002F\u002Fwww.web-professionals.ch\u002F","_blank",[69,74,71],{"href":71,"rel":75},[76],"nofollow"," wurde mittels\nNuxt.JS implementiert und bietet nebst Pre-Rendered Content diverse \"Vue-powered\" Tools wie z.B. Anmeldung, Online-Prüfungen, Studenten-Portal\nmit Diplomen und Rechnungskontrolle und und und... Eine Web-Applikation, static und doch dynamic.",{"title":79,"searchDepth":80,"depth":80,"links":81},"",2,[82],{"id":50,"depth":80,"text":51},"\u002Fimg\u002Ffrom-nuxt-to-gridsome-and-back.webp","2021-02-03","Entstanden als Vue.JS Alternative zu React\u002FGatsby bietet Gridsome viele hilfreiche Tools um in Kürze JAMStack konforme\nWebseiten zu entwickeln. Alte Wordpress Instanzen lassen sich damit zum Beispiel wunderbar in eine Headless Server\nArchitektur umwandeln, sodass Wordpress nur noch die Backend-API - also den Inhalt - zur Verfügung\nstellt, das Frontend jedoch statisch gerendert als reine HTML Dokumente auf dem Server abgelegt werden kann.\nVorbei mit Sicherheitsproblemen, regelmässigem Updatezwang und schlaflosen Nächsten bei PHP und Wordpress Core\nUpdates. Wie einfach dies geht hat unsere Entwicklerin Marielle Beusch an der letzten JAMStack Barconf der Web Professionals\nin einem Live Coding eindrücklich demonstriert.","md",{},true,"\u002Fblog\u002Fnuxt-gridsome",{"title":5,"description":85},"rolf","blog\u002Fnuxt-gridsome",[94,95],"Events","Conferences",null,"qemQ9Z5zGtAvYE59--g3UNmDVRlg2DEhQB6vfaPba9E",1787847800409]