Claude Code + CMUX: Das ultimative KI-Coding-Terminal

BBetter Stack
컴퓨터/소프트웨어AI/미래기술

Transcript

00:00:00Das ist Cmux, ein Terminal für Coding-Agents, das ihnen die Möglichkeit gibt,
00:00:04einen Browser zu öffnen und zu steuern, Sub-Agents in verschiedenen Panes zu erstellen,
00:00:09Benachrichtigungen zu senden und vieles mehr via CLI und Socket-API.
00:00:13Aber was macht Cmux bei all den anderen Terminal-Agents wie Warp, Solotam und Dmux
00:00:19so besonders?
00:00:20Abonniert den Kanal und lasst uns direkt loslegen.
00:00:24Trotz des Namens hat Cmux nichts mit tmux zu tun; es ist eine native Mac-App,
00:00:30die auf libghosty basiert, einen Webkit-Browser nutzt und Bun-Split für das Layout,
00:00:36also für Tabs, Panes und so weiter.
00:00:37Die wahre Magie liegt jedoch in der Kommunikation zwischen Agent und App.
00:00:41Ich zeige es euch mal.
00:00:42Nach der Installation von Cmux sehen wir ein ganz normales Terminal,
00:00:46das Tabs unterstützt. Wir können Fenster vertikal oder horizontal splitten
00:00:53und innerhalb dieser Splits bei Bedarf sogar weitere Tabs haben.
00:00:55Mit Cmux installiert haben wir auch Zugriff auf die Cmux-CLI, die Optionen
00:01:00für viele Dinge bietet, wie neue Workspaces oder Split-Panes zu erstellen,
00:01:06Logs in der Sidebar anzuzeigen oder tmux-kompatible Befehle zu nutzen.
00:01:11Möglich macht das der Cmux-Unix-Socket, auf den wir später noch eingehen.
00:01:15Aber probieren wir mal etwas Spannendes aus.
00:01:16Zuerst leere ich das hier und öffne Claude Code. Wie man sieht,
00:01:20hat sich der Titel in der Sidebar geändert. Ich stelle das Modell auf Haiku um,
00:01:25um keine Token zu verschwenden.
00:01:26Dann bitte ich Claude, via Cmux-CLI den Browser in einem neuen Split-Pane
00:01:30zu öffnen, google.com aufzurufen, dort nach “Hello World” zu suchen.
00:01:36Nach dem Drücken von Enter legt Claude auch schon los.
00:01:38Hier lernt er gerade, wie man Cmux bedient.
00:01:40Er hat einen neuen Tab mit Google geöffnet.
00:01:42Mal sehen, ob er die Suche ausführt.
00:01:44Okay, er tut sich kurz schwer...
00:01:45Und da ist die Suche nach “Hello World”.
00:01:47Das hat perfekt funktioniert.
00:01:49Ich kann ihn sogar bitten, auf Links zu klicken.
00:01:51Sagen wir, ich möchte diesen IMDb-Link hier öffnen. Ich sage einfach:
00:01:55“Klick auf den Hello-World-Link von IMDb”.
00:01:57Und Claude führt das prompt aus.
00:01:59Wirklich cool ist, dass ich selbst in diesem Split-Pane-Browser Zugriff auf die
00:02:04Developer-Tools habe, um Seiten zu debuggen, an denen ich gerade arbeite.
00:02:07Das basiert alles auf Browser-Befehlen, die dem API-Design
00:02:11des Salesforce-Agent-Browsers ähneln.
00:02:12Der Vorteil dieser Side-by-Side-Ansicht ist, dass der Agent im Browser
00:02:16navigieren und testen kann, während man als Entwickler
00:02:20die Ergebnisse in Echtzeit mitverfolgt.
00:02:21Probieren wir noch etwas anderes.
00:02:22Ich schließe diesen Tab und leere die Ansicht.
00:02:25Ich bitte Claude nun, zwei Instanzen von sich selbst in Splits zu erstellen:
00:02:30eine zum Verstehen des Projekts, die andere zur Code-Analyse.
00:02:33Sobald sie fertig sind, sollen sie die Infos an die Hauptinstanz zurückgeben
00:02:38und die Panes danach automatisch schließen.
00:02:39Nach Enter werden zwei Splits erstellt und in beiden Claude gestartet.
00:02:45Wir sehen jetzt live, wie er ihnen Anweisungen gibt – echt beeindruckend.
00:02:50Die inaktiven Panes sind etwas abgedunkelt; man kann sie anklicken,
00:02:53um sie wieder hell zu machen.
00:02:54Ich spule diesen Teil des Videos mal vor, da es ein Weilchen dauert.
00:02:57Nachdem beide fertig sind, hat Claude sie automatisch geschlossen und die Infos
00:03:02der ersten Instanz hier und der zweiten dort unten gesammelt. Sehr cool.
00:03:07Man kann sich unzählige Szenarien vorstellen, etwa um Sub-Agents zu
00:03:11überwachen, damit sie nicht stecken bleiben.
00:03:12Ein Problem bei dieser Demo war jedoch: Wenn einer der Agents Hilfe brauchte
00:03:16oder fertig war, gab es keinen einfachen Weg, mich zu benachrichtigen.
00:03:21Aber zum Glück macht Cmux genau das sehr einfach.
00:03:23Versuchen wir Folgendes:
00:03:24In einer neuen Claude-Code-Session gebe ich den Befehl, via Cmux einen Split
00:03:28zu öffnen und darin Verbesserungen für den Code dieses Projekts
00:03:33auszuarbeiten.
00:03:36Wenn er fertig ist, soll er eine Benachrichtigung schreiben und “trigger flash”
00:03:40ausführen, um meine Aufmerksamkeit zu erregen.
00:03:41Das aktiviert einen blau blinkenden Rand um das entsprechende Pane.
00:03:45Während das läuft, erstelle ich einen neuen Workspace und starte
00:03:48darin Open Code.
00:03:49Das Schöne an Cmux ist: Da es eine CLI ist, funktioniert es mit jedem Agent-Harness.
00:03:54Gerade als ich fertig bin, sehen wir eine Benachrichtigung von Cmux.
00:03:58Ein Klick auf die Glocke zeigt: Die Analyse läuft noch, ist also fast fertig.
00:04:03Klicke ich auf die Nachricht, springt er direkt zum Pane mit den Informationen.
00:04:07Es war nicht ganz das, was ich wollte, also lasse ich es ihn nochmal machen.
00:04:10Währenddessen gehen wir zurück zu Open Code für das eigentliche Vorhaben:
00:04:13Mit der Cmux-CLI soll der Name des aktuellen Branches hinzugefügt werden,
00:04:19inklusive eines passenden Icons daneben.
00:04:21Ich drücke Enter und lasse ihn arbeiten. Da kommt auch schon der Hinweis,
00:04:25dass die parallele Analyse gestartet wurde – diesmal sieht es
00:04:29richtig gut aus.
00:04:30Wir sehen die Nachricht sogar direkt in der Sidebar.
00:04:32Jetzt ist er fertig.
00:04:33Ich weise ihn an, den Split zu schließen und den Text in der Sidebar zu löschen.
00:04:36Hier wurde der Branch-Name mit passendem Icon eingefügt. Vorhin sagte ich
00:04:40“SF Icons”, meinte aber “SF Symbols”; gut, dass er das selbst erkannt hat.
00:04:45Wie man sieht, ist der Split nun weg und der Sidebar-Text gelöscht.
00:04:49Diese Beispiele waren simpel, aber ich hoffe, sie geben einen Einblick
00:04:52in die Möglichkeiten, wenn ein Agent die Kontrolle über das Cmux-Terminal hat.
00:04:57Einige tolle Features habe ich noch gar nicht erwähnt, wie Fortschrittsbalken,
00:05:00eigene Farben für Workspaces, automatisches Umbenennen von Tabs,
00:05:05die Command-Palette und dass Cmux eure Ghosty-Konfiguration
00:05:10lesen und anwenden kann.
00:05:11Ich habe Cmux ohne Hooks oder Skills genutzt und die Sandbox in Claude Code
00:05:16deaktiviert, um Fehler zu vermeiden. Ich empfehle euch aber wärmstens,
00:05:20die Core- und Browser-Skills für Cmux zu nutzen und es mit Claude-Code-Hooks
00:05:26für automatische Benachrichtigungen oder eigene Skripte einzurichten.
00:05:29Das macht Cmux noch nützlicher. Ein einfacherer Setup-Prozess
00:05:33wäre wünschenswert, statt Skills und Benachrichtigungen manuell
00:05:38kopieren zu müssen.
00:05:39Ähnlich wie bei skills.sh, das automatisch das Agent-Harness erkennt,
00:05:43wäre ein solches Feature für Cmux toll, um bei der Einrichtung
00:05:48zu helfen.
00:05:49Aber Cmux ist jetzt schon klasse und ein Setup-Skript kommt sicher noch.
00:05:53Dass es eine native Mac-App ist, schont Speicher und sorgt für Performance.
00:05:58Die CLI kommuniziert via JSON über Unix-Sockets mit der App,
00:06:02was den Datenaustausch schnell und unkompliziert macht.
00:06:04Apropos schnell: Wusstet ihr, dass es eine Datenbank gibt, die 138-mal
00:06:10schneller als SQLite ist? Sie heißt StoolLab, ist in Rust geschrieben und
00:06:17wird in diesem Video von Andris genauer erklärt.

Key Takeaway

Cmux revolutioniert die Arbeit mit KI-Agents, indem es ein Terminal bietet, das den Agents die volle Kontrolle über Browser, Layouts und Benachrichtigungen gibt und so eine effiziente parallele Programmierung ermöglicht.

Highlights

Cmux ist ein natives Mac-Terminal, das speziell für KI-Coding-Agents entwickelt wurde und auf libghosty sowie Webkit basiert.

Die Steuerung erfolgt über eine CLI oder Socket-API, wodurch Agents Browser öffnen, Tabs verwalten und Sub-Agents in Panes erstellen können.

Eine Besonderheit ist die Side-by-Side-Ansicht, die es Entwicklern ermöglicht, die Aktionen des Agents im integrierten Browser in Echtzeit zu verfolgen.

Agents können visuelle Benachrichtigungen wie das "Blinken" (trigger flash) von Fenstern nutzen, um die Aufmerksamkeit des Nutzers zu erregen.

Durch die Unix-Socket-Kommunikation ist Cmux mit verschiedenen Agent-Harnesses wie Claude Code oder Open Code kompatibel.

Das Tool unterstützt fortgeschrittene Features wie Fortschrittsbalken, eigene Workspace-Farben und die Integration der Ghosty-Konfiguration.

Timeline

Einführung in Cmux und technische Basis

Das Video stellt Cmux als ein innovatives Terminal für Coding-Agents vor, das über eine CLI und Socket-API gesteuert wird. Es wird klargestellt, dass Cmux trotz des Namens nicht mit tmux verwandt ist, sondern eine native Mac-App auf Basis von libghosty darstellt. Die Architektur nutzt einen Webkit-Browser und Bun-Split für ein flexibles Layout-Management von Tabs und Panes. Laut dem Sprecher liegt die wahre Magie in der nahtlosen Kommunikation zwischen der App und der KI. Dieser Abschnitt verdeutlicht den technischen Vorsprung gegenüber herkömmlichen Terminals wie Warp oder Dmux.

Funktionen der CLI und Browser-Integration

Nach der Installation zeigt sich Cmux als Terminal mit Unterstützung für vertikale und horizontale Splits sowie verschachtelte Tabs. Der Nutzer demonstriert, wie Claude Code via Cmux-CLI einen Browser öffnet und eine Google-Suche nach "Hello World" durchführt. Besonders beeindruckend ist die Fähigkeit der KI, auf spezifische Links zu klicken und Webseiten eigenständig zu navigieren. Entwickler behalten dabei vollen Zugriff auf die Developer-Tools innerhalb des Browsers, um die Arbeit des Agents zu debuggen. Dies ermöglicht eine effiziente Side-by-Side-Überwachung der KI-Aktionen in Echtzeit.

Einsatz von Sub-Agents und parallele Analyse

In diesem Abschnitt wird gezeigt, wie eine Hauptinstanz von Claude zwei Sub-Agents in separaten Split-Panes erstellt. Ein Agent übernimmt das Projektverständnis, während der andere eine dedizierte Code-Analyse durchführt. Die Ergebnisse werden nach Abschluss automatisch an die Hauptinstanz zurückgegeben und die temporären Panes wieder geschlossen. Der Sprecher betont, wie nützlich dieses Multitasking für die Überwachung komplexer Arbeitsabläufe ist. Inaktive Fenster werden visuell abgedunkelt, was die Übersichtlichkeit bei vielen parallelen Prozessen massiv erhöht.

Benachrichtigungen und interaktive Workspaces

Der Sprecher adressiert das Problem der Benachrichtigung, wenn ein Agent Hilfe benötigt oder fertig ist. Er demonstriert den Befehl "trigger flash", der einen blauen blinkenden Rand um das betroffene Fenster erzeugt, um Aufmerksamkeit zu generieren. Zudem wird gezeigt, wie Benachrichtigungen direkt in der Sidebar oder über eine Glocke in der Mac-App angezeigt werden. Während ein Analyse-Agent im Hintergrund arbeitet, kann der Nutzer in einem neuen Workspace bereits andere Aufgaben mit Open Code erledigen. Die KI ist dabei sogar in der Lage, unpräzise Anweisungen wie "SF Icons" korrekt als "SF Symbols" zu interpretieren.

Zusatzfeatures, Performance und Fazit

Zum Abschluss werden weitere Funktionen wie Fortschrittsbalken, Command-Paletten und die Übernahme der Ghosty-Konfiguration erwähnt. Der Sprecher empfiehlt die Nutzung von Cmux-Skills und Hooks für eine noch tiefere Automatisierung in Claude Code. Obwohl der Setup-Prozess momentan noch manuelles Kopieren erfordert, wird die native Performance und die schnelle JSON-Kommunikation via Unix-Sockets gelobt. Das Video endet mit einem kurzen Ausblick auf eine neue, extrem schnelle Datenbank namens StoolLab. Cmux wird als bereits jetzt leistungsstarkes Werkzeug für die Zukunft des KI-gestützten Codings positioniert.

Community Posts

View all posts