Working Draft

Revision 608: Nuxt & UnJS


Listen Later

Diese Revision wollten wir uns mit Nuxt und UnJS befassen und haben uns als Gesprächspartner Alexander Lichter (LinkedIn / Mastodon / Twitter) eingeladen, der sich nicht nur als Web-Engineering-Consultant, Trainer und VideoStreamer betätigt, sondern auch Mitglied der Nuxt- und UnJS-Teams ist.

Unser Sponsor

Maximale Performance für all deine Projekte? Bei mittwald brauchst du dir nie wieder Sorgen um Performance-Einbrüche machen. Der Traffic kann ruhig durch die Decke gehen, deine Seite bleibt immer rasend schnell.

mittwald hat Hosting neu gedacht und alles auf die besonderen Anforderungen und Workloads von Agenturen und Freelancern optimiert – inklusive Infrastruktur, benutzerfreundlicher Oberfläche und flexiblen Tarifen. Egal, ob du deinen Server selbst konfigurieren möchtest oder das mittwald-Team sich um die optimalen Specs kümmern soll. Der persönliche Kundenservice unterstützt dich 24/7 bei allen Fragen rundum WordPress, TYPO3, Shopware oder was auch immer dich gerade beschäftigt. Im firmeneigenen und TÜV-zertifizierten Rechenzentrum sind deine Daten in sicheren Händen. Und das Beste? Wer seine Projekte bei mittwald hostet bekommt nicht nur die besten Server, sondern auch 100% CO2-neutrales Hosting. Also, worauf wartest du? Geh jetzt auf mittwald.de/workingdraft und buch dein erstes Projekt!

[00:02:18] Nuxt
Nach einem kurzen Vorgeplänkel zu Vue.js wechseln wir sogleich zu Nuxt, das wie Next.js ein sogenanntes „Meta-Framework“ darstellt, nur dass es eben Vue nutzt, anstelle von React. Neben Nuxt gibt es noch Quasar, das ebenfalls auf Vue setzt.

Allen Meta-Frameworks ist gemein, dass sie eines der clientseitigen Templating-Systeme nehmen und sie um serverseitige Funktionen ergänzen. Die wichtigste davon: Das Routing-System.

Darüberhinaus ermöglichen Meta-Frameworks wie Nuxt es, statische Seiten zu erzeugen, die im Client ganz ohne JavaScript auskommen. Da unterscheiden sie sich von Konzepten wie den Server-Components von React, die es ledigleich ermöglichen, einzelne Komponenten vom Server rendern und refreshen zu lassen, das Frontend aber weiterhin im Browser orchestrieren.

Wir reden über die aktuellste Version von Nuxt und wie diese bei ihrem Release von der Community aufgenommen wurde. Und wir blicken nach vorne auf die kommende Version 4, die demnächst erscheinen soll. Anders als nach Version 3 ist hier nicht mit großen Breaking Changes zu rechnen. Für einen Vorgeschmack auf die Änderungen können aber jetzt schon in Nuxt 3 entsprechende „Future Flags“ aktiviert werden. Und für eine reibungslose Migration auf Version 4 gibt es dann noch sogenannte Codemods, die bestehenden Code für das neue Framework automagisch umschreiben.

[01:06:18] UnJS
An dieser Stelle schwenken wir um auf das Thema UnJS, welches eine Sammlung von kleinen und großen JavaScript-Helferlein ist. Zum ersten Mal hörten wir von UnJS von Joe Ray Gregory Anfang 2023, lernen aber erst jetzt, dass dies ebenfalls ein Projekt aus dem Vue-Kosmos ist.

Viele dieser Helferlein sind nämlich Spin-Offs von Projekten aus der Vue-Welt, von denen man aber annahm, dass sie auch für andere Projekte hilfreich sein könnten. Ein Beispiel ist der Webserver Nitro, der so etwas wie ein modernes Express + Connect darstelle und der nicht nur in Nuxt Verwendung findet, sondern auch in Analog.js, dem Meta-Framework für Angular.

Ein weiteres spannendes Paket ist Unplugin, das eine Art universelles Bindeglied zu allen existierenden Bundlern darstellt und einem so ermöglicht, ein Plugin leicht in jede Build-Chain zu integrieren.

Magic-Regexp ermöglicht es wiederum, Reguläre Ausdrücke in menschlicherer Sprache zu formulieren.

Dann gäbe es da noch ufo, das allerlei Tooling rund um das Verarbeiten von URLs bietet.

Und schließlich fontaine, mit dem sich aufeinander abgestimmte Schriften-Stacks erstellen lassen.

Zum Abschluss geht nochmal zurück zu Nuxt und Alex gibt uns gute Tipps für den Einstieg und nennt ein paar Stolperfallen, die man bei der Arbeit mit Nuxt besser vermeidet. Und wir behandeln auch die Frage, wo man sein Nuxt-Projekt am besten hostet. Neben Digital Ocean lautet Alex‘ Tipp hier: fly.io

...more
View all episodesView all episodes
Download on the App Store

Working DraftBy Vanessa Otto, Peter Kröner, Hans Christian Reinl, Stefan Baumgartner, Christian »Schepp« Schaefer


More shows like Working Draft

View all
Chaosradio by Chaos Computer Club Berlin

Chaosradio

6 Listeners

Bits und so by Undsoversum GmbH

Bits und so

23 Listeners

Wissenschaft und Technik by Bayerischer Rundfunk

Wissenschaft und Technik

9 Listeners

Raumzeit by Metaebene Personal Media - Tim Pritlove

Raumzeit

11 Listeners

Logbuch:Netzpolitik by Metaebene Personal Media - Tim Pritlove

Logbuch:Netzpolitik

7 Listeners

c’t uplink - der IT-Podcast aus Nerdistan by c’t Magazin

c’t uplink - der IT-Podcast aus Nerdistan

5 Listeners

Apfelfunk by Malte Kirchner & Jean-Claude Frick

Apfelfunk

8 Listeners

heiseshow by heise online

heiseshow

2 Listeners

UKW by Metaebene Personal Media - Tim Pritlove

UKW

1 Listeners

kurz informiert by heise online by heise online

kurz informiert by heise online

2 Listeners

Mac & i - der Apple-Podcast by Mac & i

Mac & i - der Apple-Podcast

0 Listeners

Wo wir sind ist vorne. by Moritz Glantz und Sarah Groß

Wo wir sind ist vorne.

0 Listeners

Bit-Rauschen: Der Prozessor-Podcast von c’t by c't Magazin

Bit-Rauschen: Der Prozessor-Podcast von c’t

1 Listeners

KI-Update – ein heise-Podcast by Isabel Grünewald, heise online

KI-Update – ein heise-Podcast

6 Listeners

Passwort - der Podcast von heise security by Dr. Christopher Kunz, Sylvester Tremmel

Passwort - der Podcast von heise security

3 Listeners