Vue Academy · Lektion

Überwachung und Wartung

Überwachen Sie Produktions-Apps und halten Sie sie zuverlässig am Laufen.

Überwachung und Wartung ist eine kostenlose Vue Academy-Lektion auf CoddyKit. Dies ist Lektion 3 von 3. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des Vue Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der Vue Academy-Kurs umfasst insgesamt 3 Lektionen.

Das Leben nach dem Launch

Die Veröffentlichung ist der Anfang, nicht das Ende. Eine gesunde Anwendung benötigt kontinuierliches Monitoring, um Fehler zu erkennen, Analytics, um die Nutzung zu verstehen, und regelmäßige Wartung, um sicher und aktuell zu bleiben.

Warum Fehler erfassen?

Fehler, die auf den Geräten der Benutzer auftreten, bleiben für Sie unsichtbar, sofern Sie sie nicht erfassen. Fehler-Tracking zeichnet Abstürze in der Produktion auf, sodass Sie von Benutzern festgestellte Probleme beheben können – häufig, bevor diese sie melden.

Sentry für Fehler-Tracking

Sentry ist ein weit verbreiteter Dienst für Fehler-Tracking. Installieren Sie dessen SDK und initialisieren Sie es beim Start Ihrer Anwendung, damit unbehandelte Fehler automatisch erfasst werden.

npm install @sentry/vue

Sentry initialisieren

Initialisieren Sie Sentry mit der DSN Ihres Projekts und der Vue-App-Instanz, damit Sentry sich in die Vue-Fehlerbehandlung einklinken kann.

import * as Sentry from "@sentry/vue"
import { createApp } from "vue"
import App from "./App.vue"

const app = createApp(App)
Sentry.init({
  app,
  dsn: "https://example@sentry.io/123"
})
app.mount("#app")

Benutzerdefinierte Fehler erfassen

Neben der automatischen Erfassung können Sie behandelte Fehler manuell melden, um Kontext zu Problemen zu erhalten, die Ihr Code bereits abfängt.

try {
  riskyOperation()
} catch (err) {
  Sentry.captureException(err)
}

Analytics hinzufügen

Analytics zeigen Ihnen, wie Benutzer Ihre Anwendung tatsächlich verwenden: welche Seiten sie besuchen, worauf sie klicken und wo sie abspringen. Diese Daten unterstützen Produktentscheidungen.

Seitenaufrufe erfassen

Mit Vue Router können Sie bei jeder Navigation mithilfe eines Router-Hooks ein Seitenaufrufereignis senden.

router.afterEach((to) => {
  trackPageView(to.fullPath)
})

Abhängigkeiten aktuell halten

Veraltete Pakete sammeln Fehler und Sicherheitslücken an. Suchen Sie regelmäßig nach Updates und spielen Sie diese ein, während Sie die Anwendung fortlaufend testen.

npm outdated
npm update

Auf Schwachstellen prüfen

Führen Sie ein Sicherheits-Audit aus, um bekannte Schwachstellen in Ihrem Abhängigkeitsbaum zu finden, und spielen Sie verfügbare Korrekturen ein.

npm audit
npm audit fix

Produktionsleistung überwachen

Echte Benutzer verwenden unterschiedliche Geräte und Netzwerke. Nutzen Sie Real User Monitoring, das häufig in Fehler-Tools integriert ist, sowie Metriken wie die Ladezeit, um sicherzustellen, dass die Leistung auch nach dem Launch gut bleibt.

Mit Breaking Changes umgehen

Updates auf eine neue Hauptversion können Breaking Changes einführen. Lesen Sie das Changelog und den Migrationsleitfaden, aktualisieren Sie in einem Branch, führen Sie Ihre Testsuite aus und beheben Sie Probleme vor dem Mergen. Tests machen diesen Prozess sicher.

Kurzer Check

Testen Sie Ihr Wissen über Monitoring und Wartung.

Zusammenfassung

Überwachen Sie die Anwendung nach dem Launch mit Fehler-Tracking (Sentry), verstehen Sie die Nutzung mithilfe von Analytics, halten Sie Pakete mit npm outdated und npm audit aktuell und beobachten Sie die Leistung in der Produktion. Gehen Sie mithilfe Ihrer Testsuite sorgfältig mit Breaking Changes um. Als Nächstes erkunden Sie fortgeschrittene Muster und Best Practices.

Häufig gestellte Fragen

Ist die Lektion „Überwachung und Wartung“ kostenlos?

Ja — der vollständige Text von „Überwachung und Wartung“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des Vue Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der Vue Academy-Kurs umfasst insgesamt 3 Lektionen.

Was lerne ich in „Überwachung und Wartung“?

Überwachen Sie Produktions-Apps und halten Sie sie zuverlässig am Laufen. Du übst Vue Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um Vue Academy zu starten?

Keine Vorkenntnisse erforderlich. Vue Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 3 von 3.

Wie lange dauert die Lektion „Überwachung und Wartung“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser Vue Academy-Lektion Code schreiben und ausführen?

Ja. Jede Vue Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

← Zurück zu Vue Academy