Seminar Vaadin Intensivseminar: Flow und Anwendungsentwicklung

Seminarprofil

Der fünftägige Intensivkurs bündelt die zentralen Flow-Themen des Seminarprogramms in einer durchgängigen Projektarbeit. Er verbindet Einstieg, Datenbindung, Architektur, Styling, Sicherheit, Signals, Komponentenentwicklung, Tests und Produktionsvorbereitung.

Lernziele

• eine vollständige Vaadin-Flow-Anwendung von der Projektanlage bis zum Produktionsbuild entwickeln
• Grid, Binder, Formulare, Navigation und Spring-Datenzugriff professionell verbinden
• Architektur, Sicherheit, Styling und Barrierefreiheit von Anfang an berücksichtigen
• reaktive Zustände, Server Push und eigene Komponenten kontrolliert einsetzen
• browserlose und End-to-End-Tests sowie betriebliche Grundlagen integrieren

Zielgruppe

Java-Entwickler und Entwicklungsteams, die in einer Woche eine belastbare Gesamtqualifikation für Vaadin Flow benötigen.

Voraussetzungen

Sichere Java-Kenntnisse, praktische Erfahrung mit Spring Boot sowie grundlegende Kenntnisse in Datenbanken und Webanwendungen.

Inhaltsverzeichnis

1. Kapitel 1: Plattform, Projekt und Entwicklungsworkflow
2. Kapitel 2: Komponenten, Layouts und Navigation
3. Kapitel 3: Grid, Binder und Persistenz
4. Kapitel 4: Styling und Barrierefreiheit
5. Kapitel 5: Security und Schutz fachlicher Daten
6. Kapitel 6: Signals, Server Push und Hintergrundarbeit
7. Kapitel 7: Eigene Komponenten und JavaScript-Integration
8. Kapitel 8: Tests, Architektur und Produktionsvorbereitung

Kapitel 1: Plattform, Projekt und Entwicklungsworkflow

Inhaltsverzeichnis

• Vaadin 25 und Flow-Architektur
• Java- und Spring-Boot-Basis
• Projektstruktur und Entwicklungsmodus
• Build, Konfiguration und Diagnose

Schritt-für-Schritt-Anleitung

1. Ein aktuelles Projekt erzeugen und alle Versionen prüfen.
2. Schichten und Fachmodule für die Kursanwendung anlegen.
3. Entwicklungsmodus, Logging und Fehleranzeige konfigurieren.
4. Einen reproduzierbaren Ausgangsbuild erstellen.

Kapitel 2: Komponenten, Layouts und Navigation

Inhaltsverzeichnis

• Komponentenauswahl und Events
• responsive Layouts
• Routen, Parameter und MainLayout
• Navigation Lifecycle und Fehlerseiten

Schritt-für-Schritt-Anleitung

1. Views aus geeigneten Komponenten zusammensetzen.
2. Layoutregeln für breite und schmale Ansichten definieren.
3. Navigation und URL-Zustand implementieren.
4. Fehler- und Zugriffsziele eindeutig behandeln.

Kapitel 3: Grid, Binder und Persistenz

Inhaltsverzeichnis

• DataProvider und Lazy Loading
• Grid-Konfiguration und Editing
• Binder, Konverter und Validierung
• Spring Data, Transaktionen und Konflikte

Schritt-für-Schritt-Anleitung

1. Eine paginierte Datenabfrage bereitstellen.
2. Liste, Filter und Auswahlzustand aufbauen.
3. Ein validiertes Formular anbinden.
4. Speicherung und konkurrierende Änderungen absichern.

Kapitel 4: Styling und Barrierefreiheit

Inhaltsverzeichnis

• Aura und Lumo
• Design Tokens und CSS
• Komponentenbereiche und Overlays
• Tastatur, Fokus, Beschriftungen und Kontrast

Schritt-für-Schritt-Anleitung

1. Ein konsistentes Theme auswählen und konfigurieren.
2. Abstände, Typografie und Farben über Tokens steuern.
3. Komponenten gezielt ohne globale Seiteneffekte anpassen.
4. Die wichtigsten Abläufe mit Tastatur und Prüfregeln kontrollieren.

Kapitel 5: Security und Schutz fachlicher Daten

Inhaltsverzeichnis

• Spring Security und VaadinSecurityConfigurer
• Login, Logout und Rollen
• View-, Service- und Datenautorisierung
• Session-, CSRF- und Fehlerkonzept

Schritt-für-Schritt-Anleitung

1. Sicherheitsabhängigkeiten und Login-View einrichten.
2. Routen mit klaren Zugriffsregeln versehen.
3. Berechtigungen in Service und Datenabfrage wiederholen.
4. Negative Tests für unzulässige Zugriffe ergänzen.

Kapitel 6: Signals, Server Push und Hintergrundarbeit

Inhaltsverzeichnis

• lokale, berechnete und gemeinsame Signals
• Komponentenbindungen und Transaktionen
• Push und UI-Zugriff
• Echtzeitstatus und Nebenläufigkeit

Schritt-für-Schritt-Anleitung

1. UI-Zustand als Signalmodell definieren.
2. Komponenten deklarativ an Zustände binden.
3. Eine Hintergrundaufgabe sicher an die UI koppeln.
4. Gemeinsame Aktualisierungen mit Transaktions- und Fehlerschutz versehen.

Kapitel 7: Eigene Komponenten und JavaScript-Integration

Inhaltsverzeichnis

• Composite und CustomField
• Element API
• Properties, Events und JavaScript-Module
• Theming, Paketierung und Wiederverwendung

Schritt-für-Schritt-Anleitung

1. Eine wiederverwendbare Java-Komponente kapseln.
2. Ein zusammengesetztes Feld Binder-kompatibel machen.
3. Ein kleines Web-Element über Properties und Events anbinden.
4. Komponente, Styles und Tests als wiederverwendbares Modul ordnen.

Kapitel 8: Tests, Architektur und Produktionsvorbereitung

Inhaltsverzeichnis

• browserlose UI-Tests
• End-to-End-Tests und kritische Pfade
• Architektur- und Codeprüfung
• Production Build, Container- und Betriebsgrundlagen

Schritt-für-Schritt-Anleitung

1. Kernfunktionen mit schnellen UI-Tests absichern.
2. Login und Hauptgeschäftsprozess im Browser prüfen.
3. Abhängigkeiten, Zustand und Fehlerbehandlung überprüfen.
4. Einen Produktionsbuild erstellen und in einer vorbereiteten Laufzeitumgebung starten.

Praxisprojekt

Über alle fünf Tage entsteht eine vollständige, gesicherte und getestete Geschäftsanwendung mit responsiver Navigation, Datenverwaltung, Echtzeitstatus, eigener Komponente und Produktionsbuild.

Arbeitsweise

Durchgängige Projektarbeit mit täglichen Ausbaustufen, Code-Reviews, Diagnoseaufgaben und kurzen Vertiefungsblöcken zu den jeweiligen Spezialthemen.