Seminare
Seminare

Vue 3 mit TypeScript

Seminar - GFU Cyrus AG

Nach dieser Schulung kennen Sie die Grundlagen von Vue 3 mit TypeScript und können komponentenbasierte Webanwendungen erstellen. Sie wissen, wie Sie Daten, Props und Events typisieren und die Kommunikation zwischen Komponenten gestalten. Sie können Templates, Bindings und Direktiven einsetzen sowie die Seitennavigation mit Vue Router umsetzen. Darüber hinaus kennen Sie das State Management mit Pinia und können eigene Komponenten mit Vitest testen. Die praktischen Projekte unterstützen Sie dabei, die behandelten Techniken auf Ihre eigenen Anwendungen zu übertragen.
Termin Ort Preis*
firmenintern auf Anfrage auf Anfrage
*Alle Preise verstehen sich inkl. MwSt.

Detaillierte Informationen zum Seminar

Inhalte:
  • Einstieg in Vue 3 mit Vite
    • Konzepte von Vue
    • Konfiguration der Umgebung, Tools und Plugins
    • Neue Projekte mit Vite erzeugen
    • Erstellen einer Startseite
    • Composition API und Options API
    • TypeScript in Vue-Komponenten: Typisierung von Daten, Props und Events
    • Einsatz mehrerer Root-Elemente / Fragments

  • Templates, Komponenten, Direktiven
    • Erstellen von Komponenten
    • Templates und Template-Syntax
    • Data-Binding mit Attributen und v-bind
    • Two-Way-Binding mit v-model
    • Event-Binding mit v-on
    • Verwenden der Shorthand Bindings
    • Binding von Computed Properties
    • Darstellung von Daten mit Interpolation
    • Bedingte Darstellung von Inhalten mit v-if und v-show
    • Elemente wiederholen mit v-for
    • Styling von Komponenten
    • Bedingte Formatierung mit style- und class-Bindings
    • Verwendung von Sass und anderen CSS-Präprozessoren
    • Verwendung einzelner Lifecycle Hooks

  • Kommunikation zwischen Komponenten
    • Erstellen von Child-Komponenten
    • Datenaustausch mit Child-Komponenten über Props
    • Validierung von Props
    • Weitergabe an Parent-Komponenten mit Events
    • Einfügen von Inhalten in Child-Komponenten mit Slots
    • Daten komponentenübergreifend übergeben und entgegennehmen mit provide / inject
    • Verwendung von Teleport

  • Erstellen von Custom Directives
    • Erzeugen einer Custom Directive
    • Datenübergabe an Directives
    • Verwenden der Directive-Lifecycle-Hooks
    • Globale Directives

  • AJAX-Requests
    • AJAX-GET- und POST-Requests nativ mit der Fetch API
    • AJAX-Requests mit der Bibliothek Axios

  • Seitennavigation mit Routing
    • Hinzufügen von Routing zu einer Vue-App
    • Verlinkung von Routen
    • Styling aktiver RouterLinks
    • Navigation per JavaScript-Code
    • Arbeiten mit Routenparametern
    • Weitergabe von Params als Props
    • Verwendung von geschachtelten Routen
    • Verwendung benannter Views
    • Aktivieren des HTML5-History-Modus
    • Schutz von Seiten mit Navigation Guards

  • State Management mit Pinia als Data Store
    • Pinia als Store verwenden
    • State Management mit Pinia in Vue 3
    • Kurzer Überblick über Pinia im Vergleich zu Vuex
    • Pinia installieren
    • Getters und Actions erstellen

  • Unit Testing mit Vitest
    • Installation, Integration und Konfiguration von Vitest in einem Vite-Projekt
    • Eigene Test-Suites erstellen
    • Mausklicks in Tests simulieren und Ergebnisse auswerten
    • Mocks am Beispiel von AJAX-Requests mit Axios erstellen
    • Browser-APIs mit Happy DOM simulieren
    • Erstellen von Spy-Objekten
    • Testabdeckung der Anwendung mit Coverage beobachten
    • Snapshots erstellen
    • Eigene Vue-Komponenten mounten und testen

  • Ausblick auf den Vapor Mode
    • Grundidee des Vapor Mode und des alternativen Rendering-Ansatzes
    • Vapor im Vergleich zum Virtual DOM
    • Performance: In welchen Fällen der Modus Vorteile bietet
    • Einschränkungen und Funktionsumfang
    • Typische Anwendungsfälle für den Einsatz
    • Aktivierung im Projekt: Überblick über Konfiguration und Opt-in

Zielgruppe:
Das Seminar richtet sich an Webentwickler, Webprogrammierer und Entwickler webbasierter Anwendungen, die Webanwendungen und Single-Page-Apps mit Vue 3 erstellen möchten.

Teilnahmevoraussetzungen


Sie benötigen Grundkenntnisse in HTML, CSS und JavaScript.
Seminarkennung:
S2398
Nach unten
Nach oben
Wir setzen Analyse-Cookies ein, um Ihre Zufriedenheit bei der Nutzung unserer Webseite zu verbessern. Diese Cookies werden nicht automatisiert gesetzt. Wenn Sie mit dem Einsatz dieser Cookies einverstanden sind, klicken Sie bitte auf Akzeptieren. Weitere Informationen finden Sie hier.
Akzeptieren Nicht akzeptieren









Um Spam abzuwehren, geben Sie bitte die Buchstaben auf dem Bild in das Textfeld ein:

captcha



Bei der Verarbeitung Ihrer personenbezogenen Daten im Zusammenhang mit der Kontaktfunktion beachten wir die gesetzlichen Bestimmungen. Unsere ausführlichen Datenschutzinformationen finden Sie hier. Bei der Kontakt-Funktion erhobene Daten werden nur an den jeweiligen Anbieter weitergeleitet und sind nötig, damit der Anbieter auf Ihr Anliegen reagieren kann.







Um Spam abzuwehren, geben Sie bitte die Buchstaben auf dem Bild in das Textfeld ein:

captcha