Das bringt euch die Nuxt.js 3 Schulung
Als Entwickler:in
-
Effiziente Projektinitialisierung: Lerne wie, wie man ein NuxtJS Projekt erstellt und die Basis für skalierbare Webapplikationen schafft.
-
Strukturierte Seiten- und Layout-Erstellung: Verstehe die Konzepte von Seiten und Layouts in NuxtJS und wie sie effektiv für eine verbesserte User Experience eingesetzt werden können.
-
Optimierung der Webpräsenz: Definiere Meta-Tags in NuxtJS so, um die Sichtbarkeit deiner Applikation in Suchmaschinen optimieren.
-
Integration externer Datenquellen: Lerne APIs in Ihre NuxtJS-Anwendung einzubinden und so externe Datenquellen effizient nutzen zu können.
Als Entscheider:in
-
Zeitersparnis bei der Projektinitialisierung: Stelle sicher, dass dein Entwicklerteam von Anfang an die richtige Struktur für das Projekt festlegt, um spätere Refactorings zu vermeiden.
-
Optimierung für Suchmaschinen: Profitiere von einem besseren SEO Score deiner Webapplikation durch korrekte Definitionen von Meta-Tags-
-
Effiziente Anbindung an Backend-Systeme: Sichere dir das Know-how, um Backend-Schnittstellen nahtlos ins Frontend zu integrieren.
-
Modularität und Skalierbarkeit: Stelle sicher, dass deine Webapplikation modular und erweiterbar bleibt, indem das Potenzial von NuxtJS-Modulen voll ausgeschöpft wird.
Über die Nuxt.js 3 Schulung
Nuxt.js ist ein intuitives Vue-basiertes Meta-Framework für die Erstellung von Webanwendungen - und es wird das Leben eines Entwicklers einfacher machen. Das Framework bietet verschiedene Rendering-Modi, darunter Server Side Rendering, Static Site Generation, ISG/ISR und hybride Modi, sowie weitere Performance-Goodies wie automatisches Code-Splitting und Lazy-Loading von Haus aus. Mit Nuxt können Sie sicherstellen, dass Ihr Frontend schnell produktionsreif ist und standardmäßig über eine hervorragende Performance verfügt.
Was ihr lernen werdet
Dies ist unsere empfohlene Agenda für die Nuxt.js 3 Intensiv-Schulung. Wir verfügen darüber hinaus über weiteres Kursmaterial, um Themen einfach nach Bedarf auszutauschen.
In diesem Workshop werden wir gemeinsam eine realitätsnahe App mit Nuxt.js entwickeln, von der Projekterstellung bis zum finalen Deployment. Während dieses Prozesses werden wir einen Blick auf viele Funktionen werfen, die Nuxt.js bietet, und auch häufige Fallstricke aufzeigen und wie man sie vermeiden kann.
-
Warum Nuxt
-
Was ist Nuxt
-
Vorteile von Nuxt
-
Wann sollte man Nuxt verwenden?
-
Überblick über das Nuxt-Ökosystem
-
Vue Composition API (Auffrischung)
-
Was ist die Composition API
-
Composition vs. Options API
-
Reaktivität
-
<script setup>
-
Initialisierung des Nuxt Projekts
-
Erkundung der Verzeichnisstruktur
-
Anfängliche Struktur
-
app.vue
-
Weitere mögliche Verzeichnisse
-
Routing in Nuxt
-
Seiten mit dem Ordner
pages
-
Dynamische Routen
-
Programmatische Navigation
-
Konfigurieren der Nuxt Anwendung
-
nuxt.config.ts
-
Überblick über die wichtigsten Optionen
-
Layouts und Fehlerseite
-
Verschiedene Layouts für verschiedene Seiten verwenden
-
Einführen einer Fehlerseite, z.B. für 404s
-
Rendering-Modi (Theorie-Block)
-
Erläuterung der verschiedenen Rendering-Modi (SPA / SSR / SSG / ISG/ISR)
-
Vorstellung der Modi anhand der von uns erstellten Anwendung
-
Data Fetching
-
Einführung in
useFetch und useAsyncData
-
Erläutern des Lebenszyklus
-
Exploration der Optionen der Composables
-
$fetch
-
Composables
-
Eigene Composables erstellen
-
useState verwenden
-
Hinzufügen von VueUse zu unserem Projekt
-
SEO
-
useHead und useSeoMeta Composables
-
SEO basierend auf Rendering Modi
-
Runtime Config
-
Umgang mit Umgebungsvariablen
-
public vs private Runtime Config
-
Nitro
-
API-Routen
-
Server-Middleware
-
Typsicherheit
-
Deployment
-
Deployment unserer Seite auf Netlify
-
Ausblick
-
Weitere Ressourcen und Themen, die exploriert werden können
Was ihr wissen solltet
Das solltet ihr mitbringen
Dieser Workshop richtet sich an Entwickler:innen, die lernen wollen, wie man mit Nuxt.js Webanwendungen erstellt.
Es sind keine Vorkenntnisse mit Nuxt.js erforderlich, aber Teilnehmer:innen sollten ein Grundverständnis von Vue.js 3, der Vue Composition API und JavaScript haben.
Zielgruppe
Dieser Nuxt.js 3 Kurs richtet sich an Einsteiger.
Was enthalten ist
