Überblick
Komponenten visuell entwickeln, testen und dokumentieren
Erleben Sie die Kraft von Storybook, dem führenden Tool zur visuellen Entwicklung, Dokumentation und zum Testen von UI-Komponenten! In diesem 2-tägigen Intensivkurs lernen Sie, Storybook nahtlos in Ihre Projekte zu integrieren und Workflows effizient zu gestalten. Von der Erstellung interaktiver Stories über visuelles Testen bis hin zur Integration in CI/CD-Pipelines – wir vermitteln Ihnen das Know-how, um mit Storybook moderne und skalierbare Front-End-Architekturen zu meistern. Der Kurs verbindet Theorie, Live-Coding und praktische Übungen.
Profitieren Sie von praxisorientiertem Lernen, direktem Austausch mit erfahrenen Trainern und einem fundierten Blick auf Best Practices, die Ihre Projekte auf das nächste Level bringen!
Schulungsunterlagen:
- Präsentation im PDF-Format
- Zugriff auf ein GitHub-Repository mit Übungsaufgaben und dem Schulungsprojekt
Schulungsumgebung:
- Visual Studio Code
- Aktuelle Node.js-Version
Nach dem Kurs sind Sie in der Lage:
- Storybook zu installieren, zu konfigurieren und in bestehende Projekte zu integrieren
- Komponenten visuell zu entwickeln, zu testen und zu dokumentieren
- Storybook Add-ons zu nutzen, um Workflows zu optimieren
- Stories für unterschiedliche Zustände und Szenarien zu erstellen
- Automatische Tests mit Storybook und Tools wie Chromatic durchzuführen
- Storybook in CI/CD-Workflows einzubinden
- Storybook individuell anzupassen und Best Practices anzuwenden
Wer hier richtig ist
- Webentwickler
- App-Entwickler
Die Themen
1. Einführung in Storybook
- Was ist Storybook?
- Vorteile und Einsatzmöglichkeiten
2. Installation und Setup
- Einrichtung und grundlegende Konfiguration
3. Stories erstellen
- Struktur und Aufbau von Stories
- Erstellung von Stories für unterschiedliche Zustände und Variationen
- Interaktive Stories gestalten
4. Dokumentation von Komponenten
- Detaillierte Dokumentation mit Storybook
5. Testing mit Storybook
- Visuelles Testen von Komponenten
- Erstellung von Komponententests
- Snapshots generieren und vergleichen
- Integration von Testing-Tools wie Jest oder Chromatic
6. CI/CD-Integration
- Einbindung von Storybook in CI/CD-Pipelines
- Automatisierte Tests und Überprüfung von Stories
- Deployment der Storybook-Dokumentation
7. Best Practices
- Organisation und Struktur von Stories
- Wiederverwendbarkeit von Konfigurationen
- Pflege und Aktualisierung von Stories
8. Storybook erweitern
- Anpassung von Themes
- Erstellung eigener Pages
- Erweiterung für spezifische Projektanforderungen
- Optional: Entwicklung eigener Add-ons
Empfohlene Vorkenntnisse
- Kenntnisse in TypeScript
- Erfahrung mit einem der folgenden Frameworks: React, Vue oder Angular
- Optional: Grundkenntnisse in Testing-Tools wie Jest oder Cypress
Termine & Buchung
Vor Ort
Online
Der passende Termin ist nicht dabei? Kontaktiere uns – wir finden die passende Lösung
Inhouse-Schulungen & Firmenseminare
Inhouse-Schulungen
Buche diese Schulung als maßgeschneiderte Inhouse-Schulung für dein Unternehmen oder deine Behörde. Unsere Trainer kommen zu dir und führen die Schulung in deinen Räumlichkeiten durch.
Vorteile:
- Maßgeschneiderte Inhalte für dein Unternehmen
- Flexible Terminplanung nach euren Bedürfnissen
- Kosteneffizient bei mehreren Teilnehmern
- Schulung in vertrauter Umgebung
- Fokus auf deine spezifischen Anforderungen
Firmen-Seminare
Firmen-Seminare finden an einem unserer Schulungsstandorte statt, sind aber maßgeschrneidert für dich und exklusiv für dein Team. Sie können auch online stattfinden.
Ideal für:
- Geschlossene Gruppen aus einem Unternehmen
- Individuelle Terminplanung für dein Team
- An unseren Schulungsstandorten oder Online
- Angepasste Inhalte für deine Anforderungen
Unser Qualitätsversprechen: Wissen, das in der Praxis funktioniert
Aus der Praxis für die Praxis
Schluss mit theoretischem Ballast. Wir trainieren dich für reale IT-Herausforderungen, nicht für Multiple-Choice-Tests. Unsere Trainer vermitteln dir genau das Wissen, das am nächsten Montagmorgen im Job wirklich funktioniert.
Individuell statt "Schema F"
Deine Fragen passen nicht ins Standard-Skript? Bei uns schon. Wir verzichten auf starre Lehrpläne und geben deinen konkreten Projekt-Fragen Raum. Unsere Trainer passen die Inhalte flexibel an das an, was dich und dein Team aktuell weiterbringt.
Maximale Freiheit: Remote oder vor Ort
Lerne so, wie es in deinen Alltag passt – ohne Reise-Stress und Zeitverlust. Egal ob remote, hybrid oder präsent vor Ort: Wir garantieren dir ein nahtloses und effektives Lernerlebnis, egal von wo du dich zuschaltest.
Mit Zufriedenheitsgarantie
Wir sind von unserer Qualität überzeugt – und wollen, dass du es auch bist. Sollte ein Training einmal nicht deinen Erwartungen entsprechen, bieten wir dir an, den Kurs kostenlos zu wiederholen oder ein anderes Training zu besuchen. Ohne Risiko, ohne Diskussion.
Ähnliche Kurse
Website Usability und Informationsarchitektur Workshop
LimeSurvey - Anwendertraining Teil 1 (Grundlagen)
Flutter Apps mit Dart - Aufbaukurs
Flutter Apps mit Dart - Grundkurs
Responsive Webdesign - Kompaktkurs
Über 20.000 Unternehmen und Behörden vertrauen auf uns