0Pricing
Vue Academy icon

Vue Academy

HTMLFrontendWebBeginner

Erstelle interaktive und effiziente Benutzeroberflächen mit Vue.js durch Vue Academy.

🤖 KI-Gesteuert📚 42 Kurse👥 100.000+ Lernende⭐ 4,9 Bewertung
Kursübersicht

Vue.js: Das Progressive Framework zum Erstellen echter UIs

Vue.js ist das progressive JavaScript-Framework, das für den Aufbau komponentengestützter Benutzeroberflächen entwickelt wurde – von einem einzelnen interaktiven Widget, das in eine vorhandene Seite eingebettet ist, bis hin zu einer vollständig server-gerenderten Anwendung mit Nuxt. Die Composition API, das feinkörnige Reaktivitätssystem und die erste Klasse TypeScript-Unterstützung machen es zur praktischen Wahl für neue Projekte und Teams, die von älteren Frontends migrieren. Dieser Track behandelt Vue 3 von Anfang bis Ende, von der Template-Syntax bis zur Produktionsbereitstellung.

Was Sie lernen werden

Sie werden die Composition API und die script setup-Syntax, Vue-Direktiven, berechnete Eigenschaften und Reaktivitätsgrundlagen durcharbeiten. Der Track behandelt Komponentenkommunikation, Slots, provide/inject und Composables für gemeinsame Logik. Sie werden den Anwendungszustand mit sowohl Pinia als auch Vuex verwalten, das Routing mit Vue Router einschließlich fortgeschrittener Muster handhaben, Formulare validieren und REST-APIs konsumieren sowie Echtzeitdaten über WebSockets. Spätere Kurse behandeln TypeScript-Integration, Internationalisierung, Storybook, Testen mit Vitest, Leistungsoptimierung, serverseitiges Rendering mit Nuxt 3, GraphQL mit Apollo, Progressive Web Apps und Vue-Sicherheitspraktiken.

Der Lernpfad

Zweiundvierzig Kurse erstrecken sich von A1 bis C1. Die A1- und A2-Kurse etablieren Vue CLI, Template-Syntax, Datenbindung, Direktiven, Formulare und Komponenten-Grundlagen. B1-Kurse erweitern das gesamte Ökosystem: Lifecycle Hooks, Übergänge, Pinia, Vuex, Vue Router, TypeScript, i18n und asynchrone Daten. B2 erhöht die Anforderungen mit serverseitigem Rendering über Nuxt 3, GraphQL, WebSockets, Komponententest, Render-Funktionen, PWA-Unterstützung und dem Veröffentlichen einer Komponentenbibliothek. Die C1-Capstone-Kurse befassen sich mit Micro-Frontend-Architektur, fortgeschrittenen Composition API-Mustern, SSR-Streaming mit Suspense, Vue-Leistung im großen Maßstab und einer vollständig integrierten Anwendung, die mit Fastify und Authentifizierung erstellt wurde.

So funktioniert es

Jeder Kurs ist in kurze, fokussierte Lektionen unterteilt, die Sie im integrierten Code-Editor mit Echtzeit-Feedback absolvieren. Ein KI-Tutor steht zur Verfügung, wenn Sie steckenbleiben, sodass Sie Syntax-Übungen, Komponenten-Herausforderungen und Architektur-Probleme in Ihrem eigenen Tempo durchgehen können, ohne die App zu verlassen.

Lernen starten →

So wirst du lernen

🎯
Interaktive Lektionen
Praktische Coding-Übungen mit Live-Feedback
🤖
KI-Tutor
Erhalte sofortige Hilfe von unserem KI-Tutor, wenn du nicht weiterkommst
💻
Integrierter Editor
Schreibe und starte Code direkt in deinem Browser
🏆
Zertifikat
Verdiene ein Zertifikat, wenn du den Kurs abschließt
Lehrplan

42 Kurse

Alle Kurse im Vue Academy Lernpfad.

01

Einführung in Vue.js

A13 Lektionen

Beginnen Sie mit Vue.js – erfahren Sie, was es ist, richten Sie Ihre Umgebung ein und erstellen Sie Ihre erste reaktive Anwendung.

02

Vue CLI und Projektstruktur verstehen

A13 LektionenPRO

Lernen Sie, Vue-Projekte mit der CLI zu erstellen, und verstehen Sie die erzeugte Dateistruktur und die verwendeten Tools.

03

Template-Syntax und Datenbindung

A13 LektionenPRO

Beherrschen Sie Vues deklarative Template-Syntax – Interpolation, Direktiven, Bedingungen, Schleifen und Bindings.

04

Grundlagen der Vue 3 Composition API

A24 LektionenPRO

Wechseln Sie für die moderne Vue-Entwicklung von der Options API zur Composition API von Vue 3 mit setup(), ref und reactive.

05

Vue-3-Syntax mit Script Setup

A24 LektionenPRO

Schreiben Sie mit der vereinfachten -Syntax in Vue 3 übersichtlichere und ergonomischere Komponenten.

06

Vue-Direktiven intensiv

A24 LektionenPRO

Beherrschen Sie alle integrierten Vue-Direktiven und lernen Sie, eigene benutzerdefinierte Direktiven zu schreiben.

07

Formulare und Validierung in Vue

A24 LektionenPRO

Erstellen Sie robuste Formulare mit v-model, nativer Validierung und der Bibliothek VeeValidate.

08

Komponentengrundlagen und Kommunikation

A23 LektionenPRO

Erstellen Sie wiederverwendbare Vue-Komponenten und verbinden Sie sie mit Props, benutzerdefinierten Events und Slots.

09

Reaktivität und berechnete Eigenschaften

A23 LektionenPRO

Verstehen Sie Vues Reaktivitätssystem und setzen Sie berechnete Eigenschaften und Watcher effektiv ein.

10

Lebenszyklus von Vue-Komponenten

B14 LektionenPRO

Beherrschen Sie die Lifecycle-Hooks von Vue-3-Komponenten und verstehen Sie, wann jede Phase ausgeführt wird.

11

Übergänge und Animationen in Vue

B14 LektionenPRO

Fügen Sie mit und von Vue fließende Enter-/Leave-Übergänge und Listenanimationen hinzu.

12

Fortgeschrittene Vue-Slots

B14 LektionenPRO

Beherrschen Sie benannte Slots, Scoped Slots und dynamische Slot-Inhalte, um vielseitig wiederverwendbare Komponenten-APIs zu erstellen.

13

Provide und Inject

B14 LektionenPRO

Teilen Sie Daten über tief verschachtelte Komponenten hinweg, ohne Props durchreichen zu müssen, und nutzen Sie dafür Vues provide/inject-M…

14

Vue-3-Composables

B14 LektionenPRO

Schreiben Sie wiederverwendbare zustandsbehaftete Logik als Composables – das wichtigste Muster zur Code-Wiederverwendung in Vue 3.

15

Fehlerbehandlung in Vue

B14 LektionenPRO

Erstellen Sie robuste Vue-Anwendungen mit geeigneten Error Boundaries, Fallback-UIs und globaler Fehlerbehandlung.

16

Zustandsverwaltung mit Pinia

B14 LektionenPRO

Ersetzen Sie Vuex durch Pinia – die offizielle State-Management-Bibliothek von Vue 3, die einfacher und auf TypeScript ausgerichtet ist.

17

TypeScript mit Vue 3

B14 LektionenPRO

Schreiben Sie mit TypeScript vollständig typsichere Vue-3-Komponenten mit typisierten Props, Emits und Composables.

18

Vue-Internationalisierung (i18n)

B14 LektionenPRO

Erstellen Sie mehrsprachige Vue-Anwendungen mit vue-i18n v9, Sprachumschaltung und korrekter Pluralbildung.

19

Vue-Storybook-Integration

B14 LektionenPRO

Dokumentieren und entwickeln Sie Vue-Komponenten isoliert mit Storybook, indem Sie Stories und interaktive Steuerelemente erstellen.

20

Routing mit Vue Router

B13 LektionenPRO

Fügen Sie Vue-Apps mit Vue Router clientseitige Navigation hinzu – Routen, Parameter und Navigationswächter.

21

Zustandsverwaltung mit Vuex

B13 LektionenPRO

Verwalten Sie den gemeinsam genutzten Anwendungszustand mit Vuex – State, Mutations, Actions, Getters und Modules.

22

APIs und asynchrone Daten verarbeiten

B13 LektionenPRO

Rufen Sie entfernte Daten in Vue-Apps mit Axios und Lifecycle-Hooks ab und verwalten Sie sie mit robuster Fehlerbehandlung.

23

Vue-Apps bereitstellen und warten

B13 LektionenPRO

Erstellen, stellen Sie Vue-Anwendungen in der Produktion bereit und warten Sie sie mit Hosting-Plattformen und Monitoring.

24

Vue-Ökosystem und der nächste Schritt

B14 LektionenPRO

Erkunden Sie moderne Vue-Tools, den Vapor Mode und neue Muster, die die Zukunft der Vue-Entwicklung prägen.

25

Fortgeschrittene Muster mit Vue Router

B24 LektionenPRO

Beherrschen Sie fortgeschrittene Funktionen von Vue Router – Route-Metadaten, Scrollverhalten, Übergänge und programmatische Navigation.

26

Serverseitiges Rendering mit Nuxt 3

B24 LektionenPRO

Erstellen Sie Full-Stack-Vue-Anwendungen mit dem dateibasierten Routing, Server-Routen und den SSR-/SSG-Funktionen von Nuxt 3.

27

Vue mit GraphQL und Apollo

B24 LektionenPRO

Integrieren Sie GraphQL mit Apollo Client in Vue-Apps und arbeiten Sie mit Queries, Mutations und Echtzeit-Subscriptions.

28

Echtzeitanwendungen mit Vue und WebSockets

B24 LektionenPRO

Erstellen Sie sich live aktualisierende Vue-Anwendungen mit WebSockets und Socket.io für Chats, Dashboards und Zusammenarbeit.

29

Komponententests mit Vitest

B24 LektionenPRO

Testen Sie Vue-Komponenten zuverlässig mit Vitest und Vue Test Utils einschließlich Mocking und Coverage-Berichten.

30

Performance-Optimierung in Vue

B23 LektionenPRO

Beschleunigen Sie Vue-Anwendungen mit Lazy Loading, Code Splitting, Memoization und der Analyse von Engpässen.

31

Vue-Anwendungen testen

B23 LektionenPRO

Testen Sie Vue-Apps mit Unit-Tests und Vue Test Utils sowie mit End-to-End-Tests für eine umfassende Abdeckung.

32

Fortgeschrittene Muster und Best Practices

B23 LektionenPRO

Setzen Sie fortgeschrittene Vue-Muster ein – Mixins, benutzerdefinierte Direktiven, Plugins und eine skalierbare Projektorganisation.

33

Vue-Render-Funktionen und JSX

B24 LektionenPRO

Gehen Sie mit Vues h()-Render-Funktion und JSX über Templates hinaus und erstellen Sie dynamische, programmatisch erzeugte Komponenten.

34

Progressive Web Apps mit Vue

B24 LektionenPRO

Verwandeln Sie Vue-Apps mit Offline-Unterstützung, Service Workern und einer nativen Installation ähnlichen Einrichtung in PWAs.

35

Best Practices für Vue-Sicherheit

B24 LektionenPRO

Schützen Sie Vue-Anwendungen mit praxisnahen Abwehrmustern vor XSS, CSRF und anderen Web-Sicherheitslücken.

36

Vue-Komponentenbibliotheken veröffentlichen

B24 LektionenPRO

Erstellen, dokumentieren und veröffentlichen Sie wiederverwendbare Vue-Komponentenbibliotheken mit dem Library Mode von Vite auf npm.

37

Vue-3-Plugin-Entwicklung

B24 LektionenPRO

Erstellen Sie installierbare Vue-Plugins, die globale Komponenten, Direktiven, Composables und anwendungsweite Konfigurationen hinzufügen.

38

Micro-Frontends mit Vue

C14 LektionenPRO

Strukturieren Sie umfangreiche Vue-Anwendungen mit Module Federation als unabhängige Micro-Frontends.

39

Fortgeschrittene Muster der Composition API

C14 LektionenPRO

Beherrschen Sie fortgeschrittene Reaktivitätsmuster, Zustandsautomaten und Composable-Factories für komplexe Vue-Anwendungen.

40

Fortgeschrittene Vue-Performance

C14 LektionenPRO

Analysieren und optimieren Sie die Performance von Vue-Anwendungen mit v-memo, Lazy Loading und der Feinabstimmung des reaktiven Systems.

41

Vue SSR Streaming und Suspense

C14 LektionenPRO

Implementieren Sie Streaming-SSR und Vue Suspense für progressives Laden von Seiten und bessere Core Web Vitals.

42

Full-Stack-Vue mit Fastify und Authentifizierung

C14 LektionenPRO

Erstellen Sie eine produktionsreife Full-Stack-Anwendung mit Vue-3-Frontend, Fastify-Backend und JWT-Authentifizierung.

FAQ

Häufig gestellte Fragen

Ist der Vue Academy Kurs kostenlos?

Ja. Du kannst den Vue Academy Kurs kostenlos starten und seine interaktiven Lektionen ohne Kosten abschließen. Ein optionales PRO-Abo schaltet erweiterte KI-Tools und ein teilbares Zertifikat frei.

Brauche ich Vorkenntnisse, um HTML zu lernen?

Nein. Der Kurs beginnt mit den Grundlagen und bewegt sich schrittweise zu fortgeschritteneren Themen, sodass du auch ohne HTML-Vorkenntnisse starten kannst.

Wie lerne ich HTML auf CoddyKit?

Du lernst durch Tun. Kurze interaktive Lektionen verbinden eine klare Erklärung mit einer praktischen Coding-Übung, die in Echtzeit läuft, und ein 24/7 KI-Tutor gibt dir personalisierte Hilfe, wann immer du steckenbleibst.

Erhalte ich ein Zertifikat für den Abschluss von Vue Academy?

Ja. PRO-Lerner können eine Prüfung ablegen und verdienen sich ein teilbares Abschlusszertifikat mit verifizierbarem Code für den Vue Academy Kurs.

Kann ich HTML auf meinem Telefon lernen?

Ja. CoddyKit ist im Web und als native iOS- und Android-Apps verfügbar, sodass du HTML auf jedem Gerät lernen kannst und dein Fortschritt überall synchronisiert wird.

Starte Vue Academy jetzt

Schließe dich Tausenden von Lernenden an, die Programmierung mit KI-gestützten Lektionen beherrschen.

Kostenlos starten →Alle Kurse ansehen