Part 7 - Mit mir Tailwind CSS meistern: Live Coding für professionelles Webdesign 🎯
In Teil 7 unserer Tutorial-Serie laden wir dich ein, deine Fähigkeiten in Tailwind CSS auf die nächste Stufe zu heben. Schließe dich mir, Roland Golla, dem Gründer von "Never Code Alone", in diesem interaktiven Live Coding Tutorial an, in dem wir gemeinsam ein ansprechendes Hero-Element entwickeln. Als erfahrener Webentwickler und leidenschaftlicher Programmierer teile ich meine Kenntnisse und Fähigkeiten, um dich bei deinem Lernprozess zu unterstützen. Mit unserer "Hands-On"-Herangehensweise und dem Fokus auf praktische Anwendungen kannst du sicher sein, wertvolle Einblicke und Erfahrungen zu sammeln. Wir starten mit der Installation und Konfiguration von Tailwind CSS, optimieren es entsprechend unseren Bedürfnissen und arbeiten dann Schritt für Schritt an der Entwicklung unseres Hero-Elements. Dabei legen wir besonderen Wert auf Barrierefreiheit und nachhaltiges Design, um sicherzustellen, dass unsere Websites für alle Nutzer zugänglich sind. Zusätzlich zu den Grundlagen von Tailwind CSS werden wir auch einen Blick auf einige der fortgeschrittenen Funktionen werfen, die dein Webdesign auf das nächste Level heben können. Nach Abschluss dieses Tutorials wirst du ein tiefgehendes Verständnis von Tailwind CSS haben und in der Lage sein, atemberaubende und zugängliche Webdesigns zu erstellen. Bist du bereit, mit uns zu lernen und dein Webdesign auf die nächste Stufe zu bringen? Klicke auf das Video, abonniere unseren Kanal für weitere nützliche Tutorials und vergiss nicht, das Video zu liken, wenn du es hilfreich fandest. Wir freuen uns auf deine Kommentare und Fragen, also zögere nicht, uns dein Feedback zu geben. Bleib am Ball und code nie allein, Roland 00:00 Header mit Tailwind CSS für ein CMS in Symfony einrichten 01:15 Tailwind UI Kit Best Practice Template runterladen und auf Linux auspacken 02:45 Axe Dev Tool in der Debug Bar für Accessibility a11y und barrierefreies Webdesign 04:24 Aktuelle Probleme mit Themeforrest Templates im Bezug auf Dependencies, Performance und Development 07:10 HTML Element mit Element untersuchen übernehmen 07:47 DDEV Docker Setup für Sulu CMS mit dem Symfony Framework 08:33 JetBrains Toolbox mit PhpStorm für das aktuelle Projekt starten 10:45 Neues Content Element als Block in einer Symfony XML Config anlegen 20:54 HTML Twig Template für Tailwind Hero Secion anlegen und Variablen ausgeben 28:07 Links mit Title rendern für Accessibility a11y und barrierefreies Webdesign 31:36 Sulu Admin Interface für Redakteure um ein Header Element zu editieren 32:16 Symfony Cache in Docker Container mit exec Command löschen 36:36 Customizing HTML Templates und Farben mit Tailwind CSS für eine Hero Section 40:09 Hover Effekte in Tailwind CSS 50:02 NPM Build und Git Commits für GitLab Pipeline 51:37 Zusammenfassung Tailwind CSS Hero Section mit Roland Golla ChatGPT Playlist: https://www.youtube.com/watch?v=Rfh8DSpRYIM&list=PLKrKzhBjw2Y9WAmajKpaE8mzQ2UpY1UYu Cypress.IO Live Coding Tutorial Playlist: https://www.youtube.com/watch?v=mb_PTxDeJKI&list=PLKrKzhBjw2Y9ceCxO3ollOc4eIVPAjiHs Vim Playlist: https://www.youtube.com/playlist?list=PLKrKzhBjw2Y-9sCNpvbg3BY9v4JRc6fgn ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ Hier geht es zu unseren Social-Media-Kanälen: ► Patreon: https://patreon.com/nevercodealone ► Twitter: https://twitter.com/nevercodealone ► Instagram: https://www.instagram.com/nevercodealone/ ► LinkedIn: https://www.linkedin.com/company/never-code-alone/ ► Facebook: https://www.facebook.com/nevercodealone ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ Das sind unsere Webseiten: ► Never Code Alone bietet kostenlose und kommerzielle live Coding Events und PHP Kurse für Fortgeschrittene an und unterstützt soziale Projekte https://nevercodealone.de ► TESTIFY - Agentur für Website Testing mit Cypress.IO und dem Codeception Testing Framework https://testify.team/ ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ Du möchtest Never Code Alone unterstützen? Dann lass uns gerne ein Abo da und schreibe deine Fragen und/oder Anregungen in die Kommentare. Danke fürs zuschauen! Ich hoffe das Video hat dir gefallen. ▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬▬ Kontakt: roland@nevercodealone.deyoutube.com
