filmov
tv
Einstieg in Tailwind CSS – Utility-First heißt die CSS-Zukunft
Показать описание
Während sich die Art und Weise, wie wir im Web arbeiten, im Laufe der Zeit weiterentwickelt, kommt hin und wieder ein echter Game Changer. Der CSS-Utility-First-Ansatz von Tailwind wirft viele der traditionellen CSS-Ansätze zum Erstellen von Projekten weg und ermöglicht es uns, eine vollständige und einzigartige Website zu erstellen, ohne eine einzige CSS-Zeile schreiben zu müssen.
In diesem Live-Stream zeigt Gregor Biswanger, einen Einstieg in Tailwind CSS und wie wir alles von Schriftarten, Farben, Rahmen und dem gesamten Layout unserer Seiten verwalten können.
▼ ▼ ▼ Timestamps ▼ ▼ ▼
[00:00] Countdown
[02:00] Willkommen
[11:11] Einführung
[15:00] Eine Card nativ mit Inline CSS Styles
[22:18] Eine Bootstrap Card mit Utilities
[38:54] Eine Tailwind Card mit Utilities
[51:40] Ein neues Tailwind CSS Projekt anlegen
[1:03:10] Die Tailwind CLI
[1:09:30] Das Card Beispiel optimieren
[1:11:26] Responsive Design mit Tailwind
[1:17:02] Gruppieren mit eigenen Klassen
[1:23:44] Tailwind Konfiguration
[1:25:45] JIT-Mode in Tailwind aktivieren
[1:27:37] Vorhandene Tailwind Klassen erweitern
[1:32:15] Dynamische Werte
[1:35:44] Schriftart hinzufügen
[1:38:20] Der Dark-Mode
[1:45:45] Reflektieren über CSS Utility First
[1:48:45] Der Production Build
[1:50:55] Fazit
[2:08:58] Pause
[2:20:24] Quiz und Verlosung
[2:32:18] Abschied
In diesem Live-Stream zeigt Gregor Biswanger, einen Einstieg in Tailwind CSS und wie wir alles von Schriftarten, Farben, Rahmen und dem gesamten Layout unserer Seiten verwalten können.
▼ ▼ ▼ Timestamps ▼ ▼ ▼
[00:00] Countdown
[02:00] Willkommen
[11:11] Einführung
[15:00] Eine Card nativ mit Inline CSS Styles
[22:18] Eine Bootstrap Card mit Utilities
[38:54] Eine Tailwind Card mit Utilities
[51:40] Ein neues Tailwind CSS Projekt anlegen
[1:03:10] Die Tailwind CLI
[1:09:30] Das Card Beispiel optimieren
[1:11:26] Responsive Design mit Tailwind
[1:17:02] Gruppieren mit eigenen Klassen
[1:23:44] Tailwind Konfiguration
[1:25:45] JIT-Mode in Tailwind aktivieren
[1:27:37] Vorhandene Tailwind Klassen erweitern
[1:32:15] Dynamische Werte
[1:35:44] Schriftart hinzufügen
[1:38:20] Der Dark-Mode
[1:45:45] Reflektieren über CSS Utility First
[1:48:45] Der Production Build
[1:50:55] Fazit
[2:08:58] Pause
[2:20:24] Quiz und Verlosung
[2:32:18] Abschied
Комментарии