Blog

Effiziente Web-Entwicklung: Wie Du mit einem AI-Agent in Zoho Cliq und GitHub Deine Projekte steuerst

In der agilen Welt der Softwareentwicklung ist die Kommunikation zwischen Fachexperten und Entwicklern oft die größte Hürde. Unklare Anforderungen, lange Feedbackschleifen und mangelnde Transparenz führen zu Verzögerungen und Frustration. Doch was wäre, wenn Du Deinem Team ein Werkzeug an die Hand geben könntest, mit dem es Entwicklungsaufgaben direkt aus dem Chat heraus beauftragen, verwalten und nachverfolgen kann – ganz ohne Programmierkenntnisse? Dieser Artikel zeigt Dir, wie Du genau das mit einer intelligenten Kombination aus Zoho Cliq, einem benutzerdefinierten AI-Agenten und der führenden Code-Plattform GitHub umsetzen kannst. Wir tauchen tief in den Tech-Stack ein und zeigen Dir einen praxiserprobten Workflow, der die Lücke zwischen Idee und Code schließt.

Das Praxisbeispiel: Vom Wunsch zur Umsetzung ohne Code

Stell Dir ein typisches Szenario in einem KMU vor: Das Marketing-Team ist für das Kundenportal verantwortlich, eine webbasierte Anwendung. Im Laufe der Zeit sammelt sich eine lange Liste mit Änderungswünschen an: Ein Button soll eine andere Farbe bekommen, die Menüpunkte müssen neu sortiert werden, ein neues Eingabefeld wird in einem Formular benötigt. Bisher lief dieser Prozess über E-Mails, unstrukturierte Listen in Zoho Sheet oder Meetings. Die Entwickler müssen ständig nachfragen, Details gehen verloren und das Marketing-Team hat keinen klaren Einblick in den Fortschritt.

Die Herausforderung ist, diesen Prozess zu strukturieren, zu automatisieren und für alle Beteiligten nachvollziehbar zu machen. Die Lösung liegt in einem Workflow, bei dem das Fachteam seine Wünsche in natürlicher Sprache in einen Chat eingibt. Ein AI-Agent analysiert diese Anfragen, wandelt sie in professionell formatierte Entwicklungsaufgaben (sogenannte „Issues“) um und legt sie im zentralen Code-Repository ab. Anschließend kann die Umsetzung der Aufgabe ebenfalls per Chat-Befehl angestoßen werden.

Die Architektur der Lösung: Dein Tech-Stack im Überblick

Dieser Workflow basiert nicht auf einer einzigen App, sondern auf dem intelligenten Zusammenspiel verschiedener spezialisierter Dienste. Das Herzstück ist die offene Architektur von Zoho, die es Dir erlaubt, interne und externe Systeme nahtlos über APIs zu verbinden.

• Kommandozentrale: Zoho Cliq
  Für Dein Team ist Cliq die einzige Schnittstelle. Hier kommunizieren sie mit dem AI-Agenten, erteilen Aufträge und erhalten Status-Updates. Die Nutzung von Slash-Befehlen (z.B. /new-issue) und interaktiven Karten macht die Bedienung intuitiv.
• Die Intelligenz: Custom AI-Agent auf Zoho Catalyst
  Der „magische“ Teil ist ein selbst entwickelter AI-Agent. Dieser läuft als serverseitige Funktion auf Zoho Catalyst, einer Low-Code-Plattform. Die Funktion empfängt die Nachrichten aus Cliq, verarbeitet sie und kommuniziert über die OpenAI API (oder eine andere LLM-API) mit einem Sprachmodell wie GPT-4, um die Anfragen zu verstehen. Anschließend interagiert sie mit der GitHub API.
• Code-Verwaltung & Task-Management: GitHub
  Der gesamte Quellcode Deiner Webanwendung liegt in einem GitHub-Repository. GitHub dient aber nicht nur als „Google Drive für Code“, sondern auch als Ticketsystem. Jede Aufgabe wird als „Issue“ angelegt. Das schafft eine lückenlose Dokumentation, ermöglicht Versionierung und macht jede Code-Änderung rückgängig. Alternativen wie GitLab oder Bitbucket funktionieren nach einem ähnlichen Prinzip.
• Sichere Entwicklungsumgebungen: Staging & Live
  Ein entscheidendes Sicherheitsmerkmal ist die strikte Trennung von Test- (Staging) und Produktivumgebung (Live). Der AI-Agent führt Änderungen grundsätzlich nur auf der Staging-Umgebung aus. So kann Dein Team das Ergebnis in einer sicheren Umgebung prüfen, bevor es manuell für die Live-Schaltung freigegeben wird.

Schritt-für-Schritt: So implementierst Du den Workflow

Lass uns nun konkret werden. Wie kannst Du einen solchen Prozess in Deinem Unternehmen aufbauen? Hier ist eine detaillierte Anleitung.

Schritt 1: Einen Bot in Zoho Cliq erstellen

Zuerst benötigst Du einen Bot in Zoho Cliq, der als Schnittstelle für Deinen AI-Agenten dient. Gehe in den Cliq-Einstellungen zu „Bots & Tools“ und erstelle einen neuen Bot. Wichtig sind hier die Slash-Befehle. Du könntest zum Beispiel einen Befehl /issue definieren. Wenn ein Nutzer diesen Befehl eingibt, sendet Cliq die Nachricht an eine von Dir definierte URL – idealerweise einen API-Endpunkt Deiner Catalyst-Funktion.

Schritt 2: Die Logik in Zoho Catalyst implementieren

In Zoho Catalyst erstellst Du eine Funktion (z.B. in Java, Node.js oder Python), die als Gehirn des Bots fungiert. Diese Funktion muss mehrere Dinge tun:

1. Anfragen von Cliq empfangen: Die Funktion wird über einen API-Gateway-Endpunkt aufgerufen und empfängt die Nutzereingabe aus Cliq als JSON-Payload.
2. Anfrage an ein LLM senden: Die Funktion formatiert die Nutzereingabe und sendet sie an eine externe AI-API (z.B. OpenAI). Der Prompt könnte lauten: „Fasse die folgende Nutzeranforderung als prägnanten GitHub-Issue-Titel und eine detaillierte Beschreibung zusammen: [Nutzereingabe]“.
3. Mit der GitHub API kommunizieren: Nachdem die Funktion die Antwort vom LLM erhalten hat, stellt sie eine Verbindung zur GitHub REST API her, um den Issue im richtigen Repository zu erstellen.

Dafür benötigst Du ein GitHub Personal Access Token (PAT), das Du sicher, beispielsweise in Zoho Vault, speichern solltest.

Schritt 3: Der „Qualifizierte Issue“ Prozess

Das ist der entscheidende, wertschöpfende Schritt. Anstatt nur einen Issue zu erstellen, soll der Bot eine „qualifizierte Issue“ anlegen. Das bedeutet, der AI-Agent soll vor der Erstellung des Tickets den bestehenden Code analysieren, um dem Entwickler (oder sich selbst) bereits Lösungsansätze zu liefern.

Der Dialog in Cliq könnte so aussehen:

Dein Team: /qualify-issue Die Reiter in der Navigation sollen in der Reihenfolge 'Dashboard, Berichte, Einstellungen' angeordnet werden. Hier ist die URL: [staging-url]

Der AI-Agent (nach Analyse im Hintergrund): Ich habe die Anfrage analysiert. Die relevante Datei ist 'components/navigation.js' in Zeile 45. Ich schlage vor, die Reihenfolge im Array anzupassen. Ich erstelle jetzt eine qualifizierte Issue dazu.

Der AI-Agent (wenige Sekunden später): Issue #52 "Reiter in der Hauptnavigation neu anordnen" wurde erstellt. Du kannst mich jetzt anweisen, mit 'arbeite an issue #52' die Umsetzung zu starten.

Dieser Prozess stellt sicher, dass jede Aufgabe technisch voranalysiert ist, was die spätere Umsetzungszeit drastisch verkürzt.

Schritt 4: Umsetzung anstoßen und prüfen

Sobald die Issue existiert, kann die Umsetzung beauftragt werden. Dein Team gibt den Befehl, und der AI-Agent führt die Code-Änderungen durch und committet sie in einen neuen Branch im GitHub-Repository. Ein Continuous Integration/Continuous Deployment (CI/CD) Prozess, z.B. über GitHub Actions, sorgt dann dafür, dass der neue Code automatisch auf der Staging-Umgebung bereitgestellt wird. Der Agent meldet den Erfolg zurück nach Cliq, und Dein Team kann das Ergebnis live auf der Staging-URL prüfen.

Codebeispiele für die Praxis

Um die technischen Konzepte greifbarer zu machen, hier einige vereinfachte Code-Snippets.

Deluge-Snippet für eine Cliq Custom Function

So könnte eine einfache Deluge-Funktion aussehen, die in Zoho CRM oder Zoho Creator hinterlegt ist und von einem Cliq-Bot aufgerufen wird, um eine Nachricht an eine Catalyst-Funktion weiterzuleiten.

// Deluge-Funktion, die von einem Cliq-Bot getriggert wird
void processCliqCommand(map cliqqPayload)
{
    // Die Nachricht des Nutzers extrahieren
    userInput = cliqqPayload.get("content");
    
    // URL des Catalyst Endpunkts
    catalystUrl = "https://your-catalyst-project.catalystapps.com/server/my_ai_agent/process";
    
    // Daten für den API-Call vorbereiten
    requestBody = Map();
    requestBody.put("text", userInput);
    
    // Catalyst-Funktion aufrufen, um die Anfrage zu verarbeiten
    response = invokeurl
    [
        url :catalystUrl
        type :POST
        parameters:requestBody.toString()
        connection:"my_catalyst_connection" // Gespeicherte Verbindung
    ];
    
    // Antwort an den Cliq-Chat zurücksenden
    info response;
}

Deluge-Snippet: GitHub Issue via API erstellen

Innerhalb Deiner Catalyst-Funktion (hier als Deluge-Beispiel) könntest Du so einen GitHub Issue erstellen.

// Annahme: issueTitle und issueBody wurden vom LLM generiert
githubRepo = "my-org/my-portal-project";
githubApiUrl = "https://api.github.com/repos/" + githubRepo + "/issues";
githubToken = zoho.vault.getSecret("github.pat"); // Token sicher aus Zoho Vault holen

headers = Map();
headers.put("Authorization", "Bearer " + githubToken);
headers.put("Accept", "application/vnd.github.v3+json");

body = Map();
body.put("title", issueTitle);
body.put("body", issueBody);

// API-Aufruf an GitHub
response = invokeurl
[
    url :githubApiUrl
    type :POST
    headers:headers
    parameters:body.toString()
];

// ID des neuen Issues extrahieren und an Cliq zurückmelden
newIssueId = response.get("number");
info "Issue #" + newIssueId + " wurde erfolgreich erstellt.";

Tipps und Best Practices

• Code-Hoheit sicherstellen: Ein kritischer Punkt aus der Praxis: Stelle sicher, dass das GitHub-Repository Dir oder Deinem Unternehmen gehört, nicht einem externen Dienstleister. Nur so hast Du die volle Kontrolle über Dein geistiges Eigentum.
• Präzise Prompts formulieren: Die Qualität der Ergebnisse des AI-Agenten hängt direkt von der Qualität der Eingabe ab. Ermutige Dein Team, klare, detaillierte Anfragen zu formulieren und bei Bedarf Screenshots oder URLs mitzuliefern.
• Die Datenbank-Falle: Beachte, dass eine Staging-Umgebung oft eine eigene, möglicherweise veraltete Datenbank hat. Wenn ein Feature auf der Staging-Seite nicht funktioniert, weil Daten fehlen, die auf der Live-Seite existieren, ist das ein häufiges Problem. Plane einen regelmäßigen Daten-Sync von Live zu Staging ein.
• Nutze Webhooks für bidirektionale Kommunikation: Richte in GitHub einen Webhook ein, der Deine Catalyst-Funktion benachrichtigt, wenn z.B. ein Entwickler manuell einen Kommentar zu einer Issue hinzufügt. So kann der AI-Agent diese Information proaktiv an das Team in Cliq weiterleiten.

Fazit: Mehr als nur ein Chatbot

Die Implementierung eines solchen AI-gestützten Workflows ist weit mehr als nur eine technische Spielerei. Es ist ein fundamentaler Wandel in der Art und Weise, wie technische und nicht-technische Teams zusammenarbeiten. Du senkst die Hemmschwelle für die Beauftragung von Änderungen, schaffst eine lückenlose und transparente Dokumentation und beschleunigst den gesamten Entwicklungszyklus erheblich.

Indem Du die Stärken verschiedener Plattformen – die intuitive Kommunikation von Zoho Cliq, die serverseitige Power von Zoho Catalyst und den Industriestandard GitHub – kombinierst, schaffst Du ein System, das skalierbar, sicher und extrem effizient ist. Du ermächtigst Deine Fachexperten, zu echten „Product Owners“ zu werden, und gibst Deinen Entwicklern das, was sie am meisten brauchen: klare, technisch vorqualifizierte Aufgaben.

Verwendete Zoho Apps in diesem Szenario:

• Zoho Cliq
• Zoho Catalyst
• Zoho Vault