Was ist Nuxt.js? Erfahre mehr über das intuitive Vue-Framework

Nuxt.js ist das intuitivste Vue-Framework, das derzeit verfügbar ist. Es kombiniert die Leistungsfähigkeit von Vue.js mit serverseitigen Rendering-Funktionen, um es noch leistungsfähiger zu machen. Du kannst eine komplette Vue.js-Anwendung mit clientseitigem Rendering, eine umfassende statisch generierte Anwendung und eine monolithische Anwendung erstellen.

Nuxt.js löst das Problem der Strukturierung deines Vue.js-Projekts, da es mit einer unternehmenstauglichen Frontend-Entwicklungsarchitektur ausgestattet ist. Die Funktionen von Nuxt.js sind bereits nach Industriestandards strukturiert, um Unternehmensanwendungen zu erstellen.

In diesem Leitfaden lernst du Nuxt.js kennen und erfährst, was du damit bauen kannst und wie es von innen heraus funktioniert.

Was ist Nuxt.js?

Nuxt.js ist ein serverseitiges Rendering-Framework, das auf Vue.js aufbaut. Es abstrahiert den Großteil der komplexen Konfiguration, die mit der Verwaltung von asynchronen Daten, Middleware und Routing verbunden ist. Außerdem hilft es bei der Strukturierung von Vue.js-Anwendungen, indem es eine standardisierte Architektur für den Aufbau einfacher oder unternehmensweiter Vue.js-Anwendungen verwendet.

Wofür wird Nuxt.js verwendet?

Mit Nuxt.js kannst du viele verschiedene Arten von Anwendungen erstellen. Im Folgenden findest du die drei beliebtesten Anwendungen, die mit Nuxt.js erstellt wurden.

Statisch generierte Seiten

Diese Art von Webseite benötigt keine externe Inhaltsquelle – der Inhalt ist bereits in das HTML eingebettet. Beispiele für solche Webseiten sind Portfolio-, Demo- und Tutorial-Webseiten.

Single-Page-Anwendungen (SPA)

Bei diesem Frontend-Entwicklungsansatz werden dynamische Inhalte von einer externen API abgerufen und auf der Client-Seite angezeigt. Die meisten JavaScript-Frameworks wie Vue.js, React.js, Angular und Ember.js sind allesamt Single-Page Application Frameworks.

Darüber hinaus wird das Routing-System einer SPA mit der HTML 5 History API oder dem Location Hash für das Routing erreicht, was es Entwicklern ermöglicht, die URL einer Webseite zu ändern, ohne die Seite komplett zu aktualisieren.

Universelle Anwendungen

der Begriff „universelle Anwendung“ beschreibt die Verwendung eines serverseitigen Rendering-Ansatzes, bei dem die Daten des Clients auf dem Server abgerufen werden, bevor die Seite im Browser des Clients vollständig gerendert wird.

Das serverseitige Rendering (SSR) ist ein bekanntes Problem in Vue.js, weil es mühsam konfiguriert werden muss, um es richtig zu machen.

Nuxt.js löst das SSR-Problem in Vue.js, was für die Suchmaschinenoptimierung (SEO) hilfreich ist. Nuxt.js kann Universal-Anwendungen sogar zu einer vollwertigen Monolith-Anwendung ausbauen, bei der sich Frontend und Backend eine einzige Codebasis teilen.

Wie funktioniert Nuxt.js?

Nuxt.js funktioniert genauso wie ein serverseitiges Framework, wenn ein Nutzer eine Webseite besucht. Wenn das serverseitige Rendering aktiviert ist, werden die Anfragen jedes Mal auf dem Server gerendert, wenn der Nutzer eine Seite anfordert. Wenn das clientseitige Rendering aktiviert ist, wird der Inhalt der Seite mithilfe von JavaScript im Browser gerendert.

Dies sind die wichtigsten Aktionen und Methoden, die in Nuxt.js verwendet werden:

• nuxtServerInit (Action): Dies ist der erste Lifecycle-Hook, der auf der Serverseite aufgerufen wird, wenn der Vuex-Store aktiviert ist. Es handelt sich um eine Vuex-Aktion, die nur auf der Serverseite aufgerufen wird, um den Store vorzubefüllen, und schließlich kann sie verwendet werden, um andere Aktionen im Vuex-Store zu starten.

• validate() (Funktion): Die validate-Methode wird vor dem Rendern von Seitenkomponenten aufgerufen. Sie ist nützlich, um dynamische Parameter einer Seitenkomponente zu validieren.

• Die asyncData()-Methode wird verwendet, um Daten zu holen und auf der Serverseite zu rendern, während die fetch()-Methode verwendet wird, um den Store zu füllen, bevor die Seite gerendert wird.

Wenn eine Nuxt.js-Webseite zum Beispiel einen ersten Seitenaufruf erhält, ruft sie die Aktion nuxtServerInit auf, um die Vuex-Zustände zu aktualisieren (wenn sie im Vuex-Store definiert sind). Andernfalls, wenn nuxtServerInit nicht definiert ist, geht sie zu einer anderen Phase über.

Als Nächstes wird in dieser Reihenfolge nach Middlewares gesucht. Zuerst wird in der Datei nuxt.config.js nach einer globalen Middleware gesucht. Wenn sie definiert ist, wird sie ausgeführt, bevor die layout Seiten auf Middleware überprüft werden. Zum Schluss wird die Middleware der einzelnen Seiten ausgeführt, einschließlich der untergeordneten Seiten.

Nachdem alle Middlewares der Reihe nach ausgeführt wurden, wird geprüft, ob die Route dynamisch ist und die erstellte und geprüfte Methode validate() ausgeführt.

Als Nächstes wird die Methode asyncData() der Seite aufgerufen, um Daten auf der Serverseite zu holen und zu rendern, bevor die Methode fetch() aufgerufen wird, um den Vuex-Speicher auf der Clientseite aufzufüllen.

Zu diesem Zeitpunkt sollte die Seite alle Daten und Inhalte enthalten, die zur Anzeige einer richtigen Webseite benötigt werden. Dann wird die Seite von der Nuxt.js-Engine gerendert und dem Besucher angezeigt, womit der Prozess abgeschlossen ist.

Dieses Flussdiagramm veranschaulicht alle Schritte, die zum Rendern einer einzelnen Seite nötig sind:

Egal, welches Tool du benutzt, du wirst dich immer sicherer fühlen, wenn du verstehst, wie das Tool unter der Haube funktioniert. Mit der obigen Erklärung, wie Nuxt.js unter der Haube funktioniert, wird es leicht zu verstehen sein. Lass uns die Vorteile von Nuxt.js für dein nächstes Projekt erkunden.

Vorteile von Nuxt.js

Als Nächstes wollen wir über die Vorteile des Nuxt.js Frameworks sprechen und warum es in letzter Zeit so beliebt geworden ist.

Erstellen von Universal Apps ohne großen Aufwand

Nuxt.js macht die Erstellung von serverseitigen Rendering-Anwendungen sehr einfach. Wenn du schon einmal versucht hast, eine serverseitig gerenderte Anwendung mit Vue.js zu entwickeln, hast du wahrscheinlich schwierige Hürden überwunden, denn es gibt unzählige Konfigurationsmöglichkeiten sowohl für die Server- als auch für die Clientseite.

Die SSR-Funktion ist bereits in Nuxt.js integriert und einfach zu bedienen. Sie ermöglicht den Zugriff auf die Eigenschaften isServer und isClient deiner Komponenten, um zu entscheiden, ob du etwas auf der Client- oder der Serverseite renderst.

Außerdem gibt es die Methode asyncData, die für das Abrufen und Rendern von Daten auf der Serverseite deiner Seitenkomponente zuständig ist.

Statisch gerenderte Vue-Apps mit Universal Benefit

Statisch generierte Webseiten sind in der Webbranche auf dem Vormarsch. Mit einem einzigen nuxt generate Befehl kannst du eine statische Version deiner Webseite mit dem gesamten HTML-Code und den entsprechenden Routen erstellen.

Der Befehl nuxt generate funktioniert genau wie der Universal Application-Ansatz mit allen aktivierten SSR-Funktionen, allerdings für eine statisch generierte Webseite.

In Nuxt.js ist eine statisch generierte Webseite so, als würdest du eine leistungsstarke Universalanwendung erstellen, ohne dass ein Server für die SSR-Funktionen benötigt wird.

Automatisches Code-Splitting

Einer der Gründe, warum Nuxt.js so leistungsfähig ist, ist die Codeaufteilung, bei der eine Route eine einzelne JavaScript-Datei erhält, die nur den Code enthält, der für die Ausführung dieser Route benötigt wird, wodurch die Größe deiner Anwendung reduziert wird.

Diese Code-Splitting-Funktion nutzt die Webpack-Konfiguration, die bei der Erstellung einer statischen Version deiner Webseite bereits integriert ist.

Hot Reload

Hot Reload ist eine großartige Funktion, mit der die zeitaufwändige Methode der Softwareentwicklung, Änderungen zu aktualisieren, gelöst wird.

Sie ist so konfiguriert, dass der Entwicklungsserver automatisch aktualisiert wird, wenn du eine Datei im Stammverzeichnis änderst.

Bei der Entwicklung und der Arbeit an .vue Dateien verwendet es eine Webpack-Konfiguration, um nach Änderungen zu suchen und alles für dich zu kompilieren. Dieser Ansatz spart Entwicklern Zeit und fördert eine schnellere Anwendungsentwicklung.

ES6/ES7-Kompilierung erhalten

Nuxt.js ist mit Webpack und Babel vorinstalliert, um die neuesten JavaScript-Versionen wie ES6 und ES7 in JavaScript zu übersetzen und zu kompilieren, das auf älteren Browsern ausgeführt werden kann.

Babel ist so konfiguriert, dass alle .vue Dateien und der ES6-Code innerhalb der Skript-Tags in JavaScript kompiliert werden, das in allen Browsern funktioniert.

Mit dieser Funktion ist es nicht mehr nötig, browserkompatible Anwendungen manuell zu erstellen und die Konfiguration von Grund auf neu einzurichten.

Wie man eine Nuxt.js App erstellt

In diesem Abschnitt erfährst du, wie du eine Nuxt.js Anwendung erstellst. Bevor wir uns damit beschäftigen, wollen wir einige der wichtigsten Konzepte für die Entwicklung einer Nuxt.js-Anwendung erläutern.

Nuxt.js Anwendung erstellen

Das Erstellen eines neuen Projekts ist einfach und unkompliziert. Du kannst ein Projekt mit verschiedenen Ansätzen erstellen, die in der offiziellen Dokumentation aufgeführt sind, aber der am meisten bevorzugte und empfohlene Ansatz ist die Verwendung der CLI.

Um eine neue Anwendung mit der CLI zu erstellen, musst du sicherstellen, dass du npx installiert hast (npx wird standardmäßig mitgeliefert, wenn du yarn oder npm 5.2.0 installierst).

Als Nächstes gibst du den folgenden Befehl in den Ordner ein, in dem du dein Projekt ablegen möchtest:

npx create-nuxt-app 
cd 
npm run dev

Achte darauf, dass du den Projektnamen> durch deinen tatsächlichen Projektnamen ersetzt.

Die Nuxt.js Ordnerstruktur verstehen

Wenn du eine neue Anwendung mit einer der verschiedenen Installationsmethoden aus der offiziellen Dokumentation erstellst, siehst du verschiedene Dateien und Ordner, die von der CLI erzeugt werden. Diese Dateien und Ordner sind wichtig und erfordern, dass einige der Ordner ohne zusätzliche Konfiguration unverändert bleiben.

Wir werden uns die Ordnerstruktur ansehen, jede Datei und jeden Ordner besprechen und ihre Bedeutung kennen.

1. .nuxt

Das .nuxt-Verzeichnis wird versteckt und erzeugt, wenn du deinen Entwicklungsserver startest. Es heißt build directory. Das Verzeichnis enthält erzeugte Dateien oder Artefakte, wenn du den Befehl npm run build ausführst.

Du kannst die Dateien in diesem Verzeichnis nur zu Debugging-Zwecken ändern, da die Dateien automatisch wieder generiert werden, sobald du den Befehl dev oder build ausführst.

2. Assets

Der Ordner Assets enthält alle nicht kompilierten Assets wie Bilder, Schriftarten, SASS-Dateien und Stylus. Webpack kompiliert jede Datei, die in diesem Verzeichnis enthalten ist, während des Rendering-Prozesses.

3. Komponenten

Das Komponentenverzeichnis ähnelt dem Komponentenverzeichnis in Vue.js, in dem alle deine Vue-Komponenten gespeichert sind. Komponenten sind die Dateien, aus denen die verschiedenen Teile deiner Seiten bestehen und die wiederverwendet und in deine Seiten, Layouts und andere Komponenten importiert werden können.

4. Layouts

Der Ordner Layouts speichert das Layout deiner Anwendung und ist sehr nützlich, wenn du die verschiedenen Strukturen deiner Anwendung für authentifizierte Benutzer oder Gastbenutzer trennen willst.

Du kannst viele Layouts erstellen, die der Struktur deiner Anwendung entsprechen. Manchmal möchtest du vielleicht, dass einige Seiten auf deiner Webseite unterschiedliche Seitenleisten, Kopfzeilen, Fußzeilen usw. haben. Diese und weitere Elemente werden mithilfe der Layoutdateien im Ordner layouts strukturiert.

5. Middleware

Middlewares sind benutzerdefinierte Funktionen, die vor dem Rendern einer Seite oder einer Gruppe von Seiten (Layout) ausgeführt werden können. Sie können im Ordner middlewares in Nuxt.js definiert und gespeichert werden.

Middlewares sind sehr praktisch, wenn du eine Webseite nur für Mitglieder erstellst. Wenn du den Zugang zu bestimmten Seiten einschränken willst, kannst du eine Middleware einrichten, die prüft, ob ein Benutzer angemeldet ist oder nicht.

In Nuxt.js funktionieren Middlewares ähnlich wie Middlewares in anderen Backend-Programmier-Frameworks wie ExpressJS, Laravel usw. Es gibt drei verschiedene Arten von Middlewares: benannte, anonyme und Router-Middlewares.

6. Pages

Das Verzeichnis pages ist die Grundlage des Nuxt.js Routing-Systems, da es alle .vue Dateien in diesem Verzeichnis liest und die Router-Konfiguration automatisch erstellt.

Das Verzeichnis pages enthält die Ansichten und Routen deiner Anwendung, und jede Seitenkomponente ist auch eine Standard-Vue-Komponente.

Dennoch behandelt Nuxt.js sie wie eine Route, indem es spezielle Attribute und Funktionen hinzufügt, um die Entwicklung deiner universellen Anwendung so einfach wie möglich zu machen.

7. Plugins

Das Verzeichnis plugins enthält JavaScript-Codes, die vor der Instanziierung der Vue.js-Stammanwendung ausgeführt werden sollen. Hier kannst du Vue-Plugins hinzufügen und Funktionen oder Konstanten einfügen.

In Nuxt.js erstellst du statt der Funktion Vue.use() einfach eine neue Datei im Plugins-Ordner und injizierst dein Vue-Plugin in die Vue-Instanz mithilfe der Datei nuxt.config.js.

8. Static

Der Ordner static enthält alle statischen Dateien in deinem Projekt, die sich wahrscheinlich nicht ändern werden oder die ohne Kompilierung gerendert werden sollen.

Alle Dateien im static-Verzeichnis werden automatisch von Nuxt.js bereitgestellt und sind über die Stamm-URL deines Projekts erreichbar.

Dieses Verzeichnis eignet sich hervorragend für Dateien wie das Favicon, die robots.txt, etc.

9. Store

Das Verzeichnis store enthält alle Dateien deines Vuex-Stores und ist standardmäßig in Module unterteilt.

Der Vuex-Store ist bei der Auslieferung standardmäßig deaktiviert. Du musst den Store aktivieren, indem du eine index.js Datei im Store-Verzeichnis erstellst.

Ein Vuex-Store ist notwendig, wenn du ein Unternehmensprojekt erstellst und verwaltest. Deshalb ist Nuxt.js bereits mit einem Vuex-Store ausgestattet und so konfiguriert, dass es für die Entwicklung von Unternehmensanwendungen geeignet ist.

Nuxt.js Seiten und Routing-System

Nuxt.js macht das Routing-System so einfach wie das Anlegen von Verzeichnissen und Dateien im Verzeichnis pages. Es generiert automatisch eine Router-Datei, die auf den Dateien und der Ordnerstruktur dieses Verzeichnisses basiert.

Wenn du zum Beispiel eine about.vue Datei im pages Verzeichnis hast, wird die Route automatisch umgewandelt und du kannst die Route dann in deinem Browser besuchen, um den Inhalt der „About“-Seite zu sehen.

Mit diesem Routing-System kannst du außerdem drei verschiedene Routen definieren, indem du nur Dateien und Ordner erstellst. Schauen wir uns diese Routentypen genauer an.

1. Basis-Routing

Als Basis-Routing werden die Routen bezeichnet, die keine zusätzlichen Konfigurationen benötigen, damit sie funktionieren. Es ist die einfachste Art des Routings und kann so einfach sein wie /about, /contact, etc.

Um ein einfaches Routing-System zu erstellen, kannst du dein Seitenverzeichnis wie folgt strukturieren:

pages/
--| services.vue
--| contact.vue
--| index.vue

Nuxt.js erstellt automatisch eine Router-Datei mit den Dateien, die du im Seitenverzeichnis hinzugefügt hast:

router: {
  routes: [
    {
      name: 'index',
      path: '/',
      component: 'pages/index.vue'
    },
    {
      name: ‘services’,
      path: '/services’,
      component: 'pages/services’
    },
    {
      name: 'contact',
      path: '/contact',
      component: 'pages/contact'
    },
  ]
}

Jetzt sind alle unsere Dateien ordentlich strukturiert und werden automatisch geroutet.

2. Verschachteltes Routing

Verschachtelte Routen sind Routen, die innerhalb einer übergeordneten Route erstellt werden. Verschachtelte Routen werden verwendet, um mehrere Ebenen von tiefem Routing zu erstellen.

Um verschachtelte Routen zu erstellen, legst du einen übergeordneten Ordner an und platzierst alle Routendateien in diesem Ordner.

Versuchen wir, eine verschachtelte Route zu erstellen:

pages/
 --| dashboard/
 -----| user.vue
 -----| settings.vue
 --| dashboard.vue
 --| services.vue
 --| contact.vue
 --| index.vue

In der obigen Ordnerstruktur haben wir eine neue Datei und einen neuen Ordner mit demselben Namen wie dashboard erstellt und dann die Dateien user.vue und settings.vue als Unterordner des Ordners dashboard hinzugefügt.

Diese einfache Ordnerstruktur erzeugt einen Router mit Routen, die der folgenden ähneln:

router: {
  routes: [
    {
      name: 'index',
      path: '/',
      component: 'pages/index.vue'
    },
    {
      name: 'services',
      path: '/services',
      component: 'pages/services'
    },
    {
      name: 'contact',
      path: '/contact',
      component: 'pages/contact'
    },
    {
      name: 'dashboard',
      path: '/dashboard',
      component: 'pages/dashboard.vue',
      children: [
        {
          name: 'dashboard-user',
          path: '/dashboard/user',
          component: 'pages/dashboard/user.vue'
        },
        {
          name: 'dashboard-settings',
          path: '/dashboard/settings',
          component: 'pages/dashboard/settings.vue'
        }
      ]
    }
  ]
}

Verschachtelte Routen sind in Vue.js etwas umständlich zu erstellen, vor allem, wenn du viele davon erstellen musst, wie du im obigen Codebeispiel sehen kannst, aber Nuxt.js macht es einfach und leicht, indem es nur Vue-Dateien in einem verschachtelten Ordner erstellt.

3. Dynamisches Routing

Dynamische Routen werden mit unbekannten Routen erstellt, weil sie entweder von einem API-Aufruf abhängen oder du die Seite nicht wiederholt erstellen willst. Das sind Routen, die über eine Variable definiert werden, die entweder ein Name, eine Nummer oder eine ID ist, die aus den Kundendaten der App abgerufen wird.

Das ist zum Beispiel nützlich, wenn du eine Nachrichten-App entwickelst, bei der du die ID oder den Slug des Beitrags nicht kennst, auf den der Nutzer zum Lesen klicken wird. Mit der dynamischen Route kannst du die ID/den Slug des Beitrags abrufen und den richtigen Beitrag mit der ID/dem Slug darstellen.

Um eine dynamische Route zu erstellen, fügst du einen Unterstrich an den Namen der .vue-Datei oder des Verzeichnisses an. Du kannst die Datei oder das Verzeichnis beliebig benennen, aber der Unterstrich muss hinzugefügt werden, damit sie dynamisch sind.

Wenn du zum Beispiel eine Datei _slug.vue im Verzeichnis pages definierst, kannst du mit dem Objekt params.slug auf den Wert zugreifen. Wir zeigen dir anhand eines Beispiels, wie du eine dynamische Route erstellst:

pages/
--|user/
-----| index.vue
-----| about.vue
-----| _routeName
-------| index.vue
-------| info.vue
--| dashboard/
-----| user.vue
-----| settings.vue
--| dashboard.vue
--| services.vue
--| _id.vue
--| contact.vue
--| index.vue

Wenn du den Unterstrich an _id und _routeName anhängst, wird eine dynamische Route für die Seite mit der ID param erstellt, zusammen mit einer übergeordneten Route mit einem String param und den oben genannten Unterrouten. Diese Seitenstruktur erzeugt einen Router mit den folgenden Routen innerhalb der Datei:

   {
      name: 'work',
      path: '/work',
      component: 'pages/work'
    },
    {
      name: 'contact',
      path: '/contact',
      component: 'pages/contact'
    },
    {
      name: 'id',
      path: '/:id',
      component: 'pages/_id.vue'
    }
    {
      name: 'user',
      path: '/user',
      component: 'pages/user/index.vue'
    },
    {
      name: 'user-about',
      path: '/user/about',
      component: 'pages/user/about.vue'
    },
    {
      name: 'user-routeName',
      path: '/user/:routeName',
      component: 'pages/user/_routeName/index.vue'
    },
    {
      name: 'user-routeName-info',
      path: '/user/:routeName/info',
      component: 'pages/user/route.vue'
    },
    {
      name: 'dashboard',
      path: '/dashboard',
      component: 'pages/dashboard.vue',
      children: [
        {
          name: 'dashboard-user',
          path: '/dashboard/user',
          component: 'pages/dashboard/user.vue'
        },
        {
          name: 'dashboard-settings',
          path: '/dashboard/settings',
          component: 'pages/dashboard/settings.vue'
        }
      ]
    }
  ]
}

Nachdem wir nun die verschiedenen Routing-Systeme im Nuxt.js-Framework kennengelernt haben, wollen wir nun lernen, wie man Vuex-Stores erstellt und verwaltet.

Vuex Stores in Nuxt.js verwenden

Nuxt.js löst ein großes Problem der Vue-Struktur, indem es den Umgang mit Vuex bei der Erstellung eines Enterprise-Projekts vereinfacht. Der Store-Ordner wird automatisch erstellt, wenn du eine neue Anwendung erstellst.

Du kannst den Vuex Store aktivieren, indem du eine index.js Datei im Store-Ordner erstellst. Mit dieser einfachen Verbesserung ist der Vuex-Store nun so strukturiert und moduliert, wie es in der offiziellen Vuex-Dokumentation beschrieben ist, was die Entwicklung umfangreicher Anwendungen fördert.

Deine index.js Datei sollte die folgende Struktur enthalten, damit sie der Struktur deines Vuex Stores in Nuxt.js entspricht. Schauen wir uns das mal an:

export const state = () => ({
  
})
export const getters = {

}
export const mutations = {
  
}
export const actions = {
  
}

Nuxt.js ermöglicht es dir, in deiner großen Anwendung den Split-by-Feature-Ansatz zu verwenden. Bei diesem Ansatz erstellst du verschiedene Vuex-Store-Dateien, die den Funktionen in deiner Anwendung entsprechen. Wenn deine Anwendung zum Beispiel Benutzer, Beiträge und Kommentare enthält, kannst du verschiedene Dateien wie users.js, posts.js und comments.js in deinem Store-Verzeichnis erstellen.

Mit dieser Methode ist es einfach, je nach Funktion der Anwendung auf eine bestimmte Speicherdatei zuzugreifen, wodurch das mühsame Suchen und Aktualisieren von Daten zu einem mühelosen Spaziergang wird.

Zusammenfassung

Nuxt.js ist ein sehr beliebtes SSR- und statisch generiertes Vue-Frontend-Framework. Es löst nicht nur das Problem der Konfiguration und Einrichtung von SSR in Vue-Anwendungen – es fördert auch die Entwicklung von Unternehmensanwendungen, indem es Best Practices bei der Strukturierung und Architektur von großen Vue-Anwendungen befolgt.

In diesem Leitfaden erfährst du alles, was du über Nuxt.js wissen musst, und was du damit bauen kannst. Wir haben statisch generierte Seiten, Single-Page-Anwendungen (SPAs) und Universal-Anwendungen besprochen und erklärt, wie du sie mit Nuxt.js entwickeln kannst.

Jetzt hast du selbst gesehen, wie einfach und vorteilhaft es sein kann, Nuxt.js für dein nächstes großes Unternehmensprojekt zu wählen. Lass uns im Kommentarbereich wissen, was du mit diesen neuen Superkräften bauen wirst!