Seminare
Seminare
  • Seminare
  • Anbieter
  • 5 km
  • 10 km
  • 25 km
  • 50 km
  • 100 km
  • 150 km
  • 200 km
  • 300 km

Vue 3 mit TypeScript

Seminar - GFU Cyrus AG

Nach dieser Schulung kennen Sie die Grundlagen von Vue 3 mit TypeScript und können mit Components, Directives, Routing und dem Pinia-Store professionelle Web-Anwendungen erstellen.
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, Plugins
    • Neue Projekte Vite erzeugen
    • Erstellen einer Start-Seite
    • Composition API / Option API
    • Einsatz mehrerer Root Elemente / Fragments

  • Templates, Komponenten, Direktiven
    • Erstellen von Components
    • Templates und Template-Syntax
    • Data-Binding mit Attributes 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 Components
    • Bedingte Formatierung mit style- und class-Bindings
    • Verwendung von SASS und anderen CSS-Präprozessoren
    • Verwendung einzelner Lifecycle Hooks

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

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

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

  • Seitennavigation mit Routing
    • Hinzufügen von Routing in eine Vue-App
    • Verlinkung von Routen
    • Styling von Links mit der ActiveRoute
    • Navigating per JavaScript-Code
    • Arbeiten mit Routen-Parameter
    • Weitergabe von Params als Props
    • Verwendung von geschachtelten Routen
    • Verwendung benannter Views
    • Aktivieren des HTML5-History-Modus
    • Schutz von Seiten mit den Navigation-Guards

  • State Management mit Pinia als Data Store
    • Pinia als Store verwenden
    • State Management / Pinia als neuer Standard in Vue 3
    • Kurzer Überblick über Pinia vs 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 Ergebnis auswerten
    • Mocks am Beispiel von AJAX-Requests mit Axios erstellen
    • Mock Browser API mit Happy DOM
    • Erstellen von Spy-Objekten
    • Testabdeckung der Anwendung durch Coverage beobachten
    • Snapshots erstellen
    • Eigene Vue-Komponenten mounten und testen




Zielgruppe:
Web-Entwickler, Web-Programmierer, Developer webbasierter Anwendungen, Web-Worker mit Grundkenntnissen in HTML, CSS und JavaScript, die Web-Anwendungen und Single-Page-Apps (SPA) mit Vue.js erstellen wollen.

HTML- CSS- und JavaScript-Kenntnisse werden vorausgesetzt
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