BROADCASTS.com

Diese Revision wollten wir uns mit Nuxt und UnJS befassen und haben uns als\nGespr\xe4chspartner Alexander Lichter (LinkedIn / Mastodon / Twitter) eingeladen,\nder sich nicht nur als Web-Engineering-Consultant, Trainer und Video\u2013Streamer\nbet\xe4tigt, sondern auch Mitglied der Nuxt- und UnJS-Teams ist.\n\n\nUNSER SPONSOR\n\n\n\nMaximale Performance f\xfcr all deine Projekte? Bei mittwald brauchst du dir nie\nwieder Sorgen um Performance-Einbr\xfcche machen. Der Traffic kann ruhig durch die\nDecke gehen, deine Seite bleibt immer rasend schnell.\n\nmittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und\nWorkloads von Agenturen und Freelancern optimiert \u2013 inklusive Infrastruktur,\nbenutzerfreundlicher Oberfl\xe4che und flexiblen Tarifen. Egal, ob du deinen Server\nselbst konfigurieren m\xf6chtest oder das mittwald-Team sich um die optimalen Specs\nk\xfcmmern soll. Der pers\xf6nliche Kundenservice unterst\xfctzt dich 24/7 bei allen\nFragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade\nbesch\xe4ftigt. Im firmeneigenen und T\xdcV-zertifizierten Rechenzentrum sind deine\nDaten in sicheren H\xe4nden. Und das Beste? Wer seine Projekte bei mittwald hostet\nbekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting.\nAlso, worauf wartest du? Geh jetzt auf mittwald.de/workingdraft und buch dein\nerstes Projekt!\n\n[00:02:18] NUXT\n\nNach einem kurzen Vorgepl\xe4nkel zu Vue.js wechseln wir sogleich zu Nuxt, das wie\nNext.js ein sogenanntes \u201eMeta-Framework\u201c darstellt, nur dass es eben Vue nutzt,\nanstelle von React. Neben Nuxt gibt es noch Quasar, das ebenfalls auf Vue setzt.\n\n\n\nAllen Meta-Frameworks ist gemein, dass sie eines der clientseitigen\nTemplating-Systeme nehmen und sie um serverseitige Funktionen erg\xe4nzen. Die\nwichtigste davon: Das Routing-System.\n\nDar\xfcberhinaus erm\xf6glichen Meta-Frameworks wie Nuxt es, statische Seiten zu\nerzeugen, die im Client ganz ohne JavaScript auskommen. Da unterscheiden sie\nsich von Konzepten wie den Server-Components von React, die es ledigleich\nerm\xf6glichen, einzelne Komponenten vom Server rendern und refreshen zu lassen,\ndas Frontend aber weiterhin im Browser orchestrieren.\n\nWir reden \xfcber die aktuellste Version von Nuxt und wie diese bei ihrem Release\nvon der Community aufgenommen wurde. Und wir blicken nach vorne auf die kommende\nVersion 4, die demn\xe4chst erscheinen soll. Anders als nach Version 3 ist hier\nnicht mit gro\xdfen Breaking Changes zu rechnen. F\xfcr einen Vorgeschmack auf die\n\xc4nderungen k\xf6nnen aber jetzt schon in Nuxt 3 entsprechende \u201eFuture Flags\u201c\naktiviert werden. Und f\xfcr eine reibungslose Migration auf Version 4 gibt es dann\nnoch sogenannte Codemods, die bestehenden Code f\xfcr das neue Framework\nautomagisch umschreiben.\n\n[01:06:18] UNJS\n\nAn dieser Stelle schwenken wir um auf das Thema UnJS, welches eine Sammlung von\nkleinen und gro\xdfen JavaScript-Helferlein ist. Zum ersten Mal h\xf6rten wir von UnJS\nvon Joe Ray Gregory Anfang 2023, lernen aber erst jetzt, dass dies ebenfalls ein\nProjekt aus dem Vue-Kosmos ist.\n\n\n\nViele dieser Helferlein sind n\xe4mlich Spin-Offs von Projekten aus der Vue-Welt,\nvon denen man aber annahm, dass sie auch f\xfcr andere Projekte hilfreich sein\nk\xf6nnten. Ein Beispiel ist der Webserver Nitro, der so etwas wie ein modernes\nExpress + Connect darstelle und der nicht nur in Nuxt Verwendung findet, sondern\nauch in Analog.js, dem Meta-Framework f\xfcr Angular.\n\nEin weiteres spannendes Paket ist Unplugin, das eine Art universelles Bindeglied\nzu allen existierenden Bundlern darstellt und einem so erm\xf6glicht, ein Plugin\nleicht in jede Build-Chain zu integrieren.\n\nMagic-Regexp erm\xf6glicht es wiederum, Regul\xe4re Ausdr\xfccke in menschlicherer\nSprache zu formulieren.\n\nDann g\xe4be es da noch ufo, das allerlei Tooling rund um das Verarbeiten von URLs\nbietet.\n\nUnd schlie\xdflich fontaine, mit dem sich aufeinander abgestimmte Schriften-Stacks\nerstellen lassen.\n\nZum Abschluss geht nochmal zur\xfcck zu Nuxt und Alex gibt uns gute Tipps f\xfcr den\nEinstieg und nennt ein paar Stolperfallen, die man bei der Arbeit mit Nuxt\nbesser vermeidet. Und wir behandeln auch die Frage, wo man sein Nuxt-Projekt am\nbesten hostet. Neben Digital Ocean lautet Alex\u2018 Tipp hier: fly.io