Webflow Conf 2026
Beyond Edit: Code Components fĂĽr KI-affine Kunden
Dennis Karg
Vorstellung
31 Jahre alt
Lebe in Potsdam
Seit 9 Jahren Webflow Entwickler
6 Jahre vollselbstständig
GrĂĽnder und Moderator der Webflow DACH Community
Webflow Certified Partner, Global Leader und ACE Mitglied
Hab 'nen Kater
Bin ein Nerd
Warum dieses Thema
Komplexe Entwicklungen sind nicht mehr nur Entwicklern vorbehalten
Mit zunehmender Verbreitung von AI steigt der Wunsch nach Mitwirkung der Kunden
Es reicht eine Techaffine Person auf Kundenseite um das Kundenverhältnis grundlegend zu verändern
Es entstehen Erwartungshaltungen, dass Kunden mit AI ihre Website bearbeiten können
Gleichzeitig steigt die Sorge, etwas „kaputt“ zu machen
Welche Möglichkeiten haben wir?
Kunden via MCP Zugriff auf das Webflow Projekt geben
Code Component Library
Vor- und Nachteile MCP Zugriff
Vorteil: Direkte Verwaltung aller Inhalte
Vorteil: Granulare Anpassungen
Nachteil: Sehr viel „Macht“ in der Hand von Unwissenden
Nachteil: Möglichkeiten beschränken sich auf das, was Webflow und Webflow's MCP kann
Nachteil: Fehlerhafte Änderungen fallen ggf. erst spät auf
Vor- und Nachteile Code Components
Vorteil: Isolierte Umgebung
Vorteil: Die „Macht“ der Bearbeitung beschränkt sich auf einzelne Komponenten
Vorteil: Hohe Funktionsvielfalt dank React
Nachteil: EinfĂĽhrung in Github (Pull, Push, Commit, Branch, Merge)
Nachteil: Bedarf gut organisiertes Webflow Projekt
Nachteil: Braucht einen Workspace Plan
Schauen wir uns Code Components an
Voraussetzungen fĂĽr Code Components
Das Webflow Projekt braucht gut organisierte Variablen
Es empfiehlt sich, dass das Projekt Component-First ist
Ihr und der Kunde benötigt ein Github Account
Kunde benötigt Adminzugriff, sowie Node.js und Github Desktop auf dem PC
Wichtig zu beachten
Code Components in einem Webflow Projekt rendern in einem Shadow DOM
Im Projekt existierende Klassen dringen nicht bis in das Shadow DOM
Website Variablen können hingegen im Shadow DOM verwendet werden
Los geht's
Schritt 1
Github Repo Einrichten
Repo anlegen
Pull auf dem PC
Von Hand oder mit eurem Agent der Wahl den Setup Prozess durchlaufen
Via Webflow MCP die Projektvariablen (Farben, Abstände, Größen, Radien etc.) dem Repo
als Tokens hinzufĂĽgen
(Ggf. Assets dem Repo hinzufĂĽgen)
Agent Rules fĂĽr das Projekt definieren
Schritt 2
Erste Code Component anlegen und testen
Schritt 3
Library Veröffentlichen
Schritt 4
Code Component einbinden
(Inhalte folgen)
Schritt 5
Repo Commit & Push
(Inhalte folgen)
FAQ
Sind Code Components SEO-freundlich?
Wie sehr beeinträchtigen Code Components die Ladezeit im Vergleich zu nativ in Webflow gebaute Components?
Wie gut vertragen sich Code Components mit Webflow Localization?
Können Secrets aus einer .env gefahrlos verwendet werden?
Danke und Happy Webflow Conf!
