Vue.js
Von Grundlagen bis Best Practices
Fabian Deitelhoff
Diese Publikation zitieren
Fabian Deitelhoff, Vue.js (2022), dpunkt.verlag, Heidelberg, ISBN: 9783969107607
3476
Accesses
Accesses
189
Quotes
Quotes
Beschreibung / Abstract
Dein Einstieg in Vue.js
- Umfassender Einstieg in Vue.js
- alle Neuheiten von Vue 3 ausführlich erklärt
- Entwicklung einer Vue-Anwendung von Projekt aufsetzen bis Deployment
- Hinweise zu Stolpersteinen von Vue 2 und Unterschieden zur aktuellen Vue-Version
- Code-Beispiele und Praxistipps
Jetzt ist der richtige Zeitpunkt, sich das Web-Framework Vue einmal genauer anzusehen. Vue 3 ist endlich die aktuelle Standardversion und die Community wächst und wächst.
Dieses Buch ist ein praxisnaher Einstieg für alle, die sich Vue einmal genauer ansehen möchten. Der Autor erklärt den komponentenbasierte Ansatz, wie dieser umgesetzt wird und natürlich was für Vorteile er hat. Die Neuerungen von Vue 3 werden detailliert erklärt. Und wer noch mit Vue 2 arbeiten muss oder möchte, findet hier hilfreiche Tipps und Hinweise zu Unterschieden und Stolpersteinen. Alles natürlich mit vielen Code-Beispielen und praktischen Tipps aus der Webentwicklung von Projektstart, über Architektur bis Testen und Deployment.
Beschreibung
Dr. Fabian Deitelhoff arbeitet nach seiner Promotion zu »Source Code Comprehension« als Tech-Lead Domestics an Cloud-Themen bei Miele. Darüber hinaus ist er mit brickobotik in der MINT-Bildung und mit Loosely in der Cross-Plattform-Softwareentwicklung tätig. Seine Schwerpunkte sind Low- und No-Code sowie digitale Geschäftsmodelle. Daneben ist er als freier Autor, Dozent und Softwareentwickler im .NET- und Web-Umfeld tätig. Sie erreichen ihn über deitelhoff.me, unter fabian@deitelhoff.me oder auf Twitter als @FDeitelhoff.
Inhaltsverzeichnis
- BEGINN
- Impressum
- Inhaltsverzeichnis
- Vorwort
- Kapitel 1 - Vue im Überblick
- 1.1 Was ist ein JavaScript-Frontend-Framework?
- 1.2 Historie und das Team rund um Vue
- 1.3 Was ist Vue und was zeichnet es aus?
- 1.4 Warum Vue?
- 1.5 Unterschiede zu anderen Web-Frameworks
- 1.6 Vue 2 oder Vue 3 lernen?
- 1.7 Der Blick in die Zukunft
- Kapitel 2 - Die Grundlagen: Ein Vue-Schnellstart
- 2.1 Die erste Vue-Anwendung aufsetzen
- Kapitel 3 - Vue 3 im Überblick
- 3.1 Warum neu schreiben?
- 3.2 Ein mehrschrittiges Release
- 3.3 Interne und externe Anpassungen
- 3.4 Der neue Standard und Framework-Empfehlungen
- Kapitel 4 - Vue-Projekte aufsetzen
- 4.1 Scaffolding als Basis
- 4.2 Vue-Projekte erstellen
- 4.3 Vite als neuer Standard
- 4.4 Die Entwicklungsumgebung vorbereiten
- 4.5 Server-Side Rendering (SSR)
- Kapitel 5 - Das (neue) Reactivity-System
- 5.1 Der Ansatz von Vue
- 5.2 Die Implementierung als Proxy in Vue 3
- 5.3 Probleme bei der Reaktivität
- Kapitel 6 - Komponenten im Detail
- 6.1 Komponentenorientierte Entwicklung
- 6.2 Komponenten und das Separation-of-Concerns-Prinzip
- 6.3 Options API, Class-Style-Syntax und Composition API
- 6.4 Globale und lokale Komponenten
- 6.5 Single-File Components (SFC)
- 6.6 Lifecycle-Hooks
- 6.7 Daten und Props
- 6.8 Non-Prop-Attribute und Refs
- 6.9 Methoden
- 6.10 Benutzerdefinierte Events
- 6.11 Der Datenfluss zwischen Komponenten
- 6.12 Computed Propertys
- 6.13 Watcher
- 6.14 Eigene Komponenten mit v-model
- 6.15 Standard, Named und Scoped Slots
- 6.16 Dynamische Komponenten
- 6.17 Eigene Direktiven und Plug-ins
- 6.18 Fragmente, Portale und Suspense
- 6.19 Asynchrone und funktionale Komponenten
- 6.20 Dependency Injection mit Provide und Inject
- 6.21 Render-Funktionen und JSX
- 6.22 Vue Components und Web Components
- 6.23 Wiederverwendbarkeit und Komponenten-Patterns
- Kapitel 7 - Data Binding, Formulare und Styles
- 7.1 Einführung ins Data Binding bei Vue
- 7.2 Template-Syntax und das Binding von Attributen
- 7.3 Bedingtes Rendering mit v-if und v-show
- 7.4 Rendern von Listen mit v-for
- 7.5 Die neue Arbeit mit Arrays
- 7.6 Daten filtern, suchen und sortieren
- 7.7 Daten auf Seiten aufteilen (Pagination)
- 7.8 Formulare mit Daten verknüpfen
- 7.9 Events von Anwenderinnen verarbeiten
- 7.10 Formulare validieren
- 7.11 Class- und Style-Binding
- 7.12 Animationen und Transitionen
- Kapitel 8 - Das Composition API
- 8.1 Der Hintergrund
- 8.2 Setup, Daten und Props
- 8.3 Script Setup
- 8.4 Methoden und Lifecycle-Hooks
- 8.5 Computed Propertys und Watcher
- 8.6 Composables (Composition Function)
- 8.7 Vorgefertigte Kompositionen in Bibliotheken
- 8.8 ref vs. reactive und Reactivity Transform
- 8.9 Provide und Inject
- 8.10 Render Functions und Templates Refs
- 8.11 Eine komplette Komponente mit dem Composition API
- 8.12 Das Reactivity API
- 8.13 Composition API vs. Options API vs. Class API
- 8.14 Das Composition API und Vue 2
- Kapitel 9 - Routing mit dem Vue Router
- 9.1 Was ist Routing und was der Vue Router?
- 9.2 Installation und Bestandteile des Vue Router
- 9.3 Routen konfigurieren
- 9.4 Routen nutzen
- 9.5 Dynamische Routen mit Parametern und Props
- 9.6 Das Pattern-Matching
- 9.7 Die verschiedenen History-Modi
- 9.8 Verschachtelte Routen, Redirects und Lazy Loading
- 9.9 Route-Guards und Metadaten
- 9.10 CSS-Klassen, Transitionen und Composition API
- 9.11 Fehler bei der Navigation erkennen
- 9.12 Ein DIY-Router für Minimalistinnen und Minimalisten
- Kapitel 10 - State Management mit Vuex und Pinia
- 10.1 Was ist State Management und das Flux-Pattern
- 10.2 Andere State-Management-Patterns
- 10.3 Das neue Vuex und die Installation
- 10.4 Die drei Kernprinzipien
- 10.5 Die 4 + 1 Kernkonzepte
- 10.6 Einen Store in Komponenten nutzen
- 10.7 Vuex und das Composition API
- 10.8 Die Struktur einer Vuex-Anwendung und Plug-ins
- 10.9 Einen Store debuggen
- 10.10 State Management mit Pinia
- 10.11 Vuex bzw. Pinia nutzen oder nicht?
- Kapitel 11 - Mit Vue auf Ressourcen zugreifen
- 11.1 Das Beispiel-API
- 11.2 Zugriff auf ein API über das Fetch API
- 11.3 Axios vs. Fetch
- 11.4 Die Bibliothek Axios als Quasi-Standard
- 11.5 Axios in Vue integrieren
- 11.6 Daten abfragen und anzeigen
- 11.7 Daten hinzufügen und löschen mit POST und DELETE
- 11.8 Axios konfigurieren
- 11.9 Pagination mit API-Aufrufen
- 11.10 Mit Fehlern umgehen
- 11.11 API-Zugriffe bündeln
- 11.12 Axios mit Vue Router und Vuex
- 11.13 Ein kurzer Blick auf Alternativen
- Kapitel 12 - Anwendungsentwicklung mit Vue
- 12.1 Ein Blick über den Tellerrand
- 12.2 Das Tooling als Grundvoraussetzung
- 12.3 Eine Vue-Projektstruktur
- 12.4 Vue-Apps debuggen und Fehlerbehandlung
- 12.5 Web-Apps auf Basis von UI-Frameworks
- 12.6 Web-Apps auf Basis von Application Frameworks
- 12.7 Mobile App-Entwicklung und statische Seiten
- 12.8 Eine Web-App am Beispiel von Quasar
- Kapitel 13 - Internationalisierung und Barrierefreiheit
- 13.1 Installation und Konfiguration von Vue I18n
- 13.2 Das aktive Gebietsschema abrufen und verändern
- 13.3 Übersetzungen nutzen
- 13.4 Vue I18n und das Composition API
- 13.5 Asynchrones Laden von Übersetzungsdateien
- 13.6 Routen und Router-Links übersetzen
- 13.7 Vuex und Vue I18n
- 13.8 Anwendungsentwicklung und das Ökosystem
- 13.9 Etwas zur Barrierefreiheit
- Kapitel 14 - Testen von Vue-Anwendungen
- 14.1 Das Testen und Vue
- 14.2 Vorbereitungen im Projekt
- 14.3 Tests organisieren und strukturieren
- 14.4 Unit-Tests für JavaScript und TypeScript
- 14.5 Unit-Tests für Vue-Komponenten
- 14.6 Unit-Tests für das Composition API
- 14.7 Events testen
- 14.8 Tests für Formulareingaben
- 14.9 Tests für Vue Router
- 14.10 Tests für Vuex
- 14.11 Ende-zu-Ende-Tests
- 14.12 Snapshot-Tests
- 14.13 Tests der Internationalisierung
- Kapitel 15 - Build und Deployment von Vue-Anwendungen
- 15.1 Development- vs. Production-Build
- 15.2 Den Build im Auge behalten
- 15.3 Deployment auf Netlify und Heroku
- 15.4 CI-/CD-Pipelines mit GitHub Actions und Azure DevOps
- Kapitel 16 - Performante Vue-Apps entwickeln
- 16.1 Vue 3 als allgemeiner Vorteil
- 16.2 Performance von Komponenten prüfen
- 16.3 Events und Reactivity
- Kapitel 17 - Migration von Vue 2 auf Vue 3
- 17.1 Die Wege einer Migration und der Migration-Build
- 17.2 Breaking Changes
- 17.3 Vue Router und Vuex
- Kapitel 18 - Vue und TypeScript
- 18.1 Vue (3) und TypeScript
- 18.2 Ein neues Vue-Projekt mit TypeScript
- 18.3 TypeScript im Vue-Projekt
- 18.4 Die verschiedenen API-Modelle
- 18.5 Vue Router, Vuex und Internationalisierung
- 18.6 Vor- und Nachteile bei Vue mit TypeScript
- 18.7 Migration auf TypeScript
- Kapitel 19 - Vue und das Backend
- 19.1 Express (Node.js, JavaScript und TypeScript)
- 19.2 Django (Python)
- 19.3 Laravel (PHP)
- 19.4 Spring Boot (Java)
- 19.5 ASP.NET Core (.NET, C#, F# und Visual Basic)
- 19.6 Firebase (Low Code)
- 19.7 Serverless als Motto
- 19.8 Low- und No-Code als Wachstumsmotor
- Kapitel 20 - Etwas zu Bibliotheken
- 20.1 Composition API
- 20.2 Awesome Vue als umfassender Überblick
- 20.3 Eine Bibliothek für Vue 2 und Vue 3 erstellen
- Literaturverzeichnis
- Index