Zum Hauptinhalt springen

Mit KI-Tools bauen

Die Copera Starter Application liefert Ihnen eine funktionierende Basis out of the box. KI-Coding-Assistenten können dramatisch beschleunigen, wie schnell Sie sie anpassen und erweitern — was Tage dauern könnte, wird zu Stunden, und Stunden zu Minuten.

Das Konzept​

Wenn Sie mit der Starter Application arbeiten, haben Sie bereits Authentifizierung, Routing, Data Fetching und UI-Muster. Ihre Aufgabe ist, diese Basis an Ihren konkreten Use Case anzupassen — welche Daten angezeigt werden, neue Seiten, neue Copera-Board-Spalten anbinden oder neue Workflows verdrahten.

Genau darin sind KI-Tools stark. Geben Sie ihnen den richtigen Kontext, und sie erzeugen neue Seiten, Komponenten und API-Routen, die zu Ihren bestehenden Codebase-Mustern passen. Der Schlüssel ist Kontext: Je besser die KI Ihre Projektstruktur und Ihr Copera-Board-Setup versteht, desto besser ist die Ausgabe.

Copera AI nutzen​

Copera hat einen eingebauten KI-Assistenten, der Ihren Workspace, Ihre Boards und Ihre Daten bereits versteht.

Was Sie fragen können:

  • „Welche Spalten hat mein Tickets-Board, und was sind ihre IDs?“
  • „Wie frage ich Zeilen aus der Orders-Tabelle ab, bei denen Status ‚Pending‘ ist?“
  • „Erzeuge ein Copera-SDK-Snippet, das eine neue Zeile in meinem Projects-Board mit Name und Due Date anlegt.“

Weil Copera AI direkten Zugriff auf Ihre Workspace-Struktur hat, kann es Ihnen genaue Spalten-IDs und Tabellennamen geben, ohne dass Sie manuell nachschlagen. Nutzen Sie es als erste Anlaufstelle, wenn Sie Ihre Datenstruktur verstehen müssen, bevor Sie Code schreiben.

tipp

Kopieren Sie die Spalten- und Tabellen-IDs, die Copera AI Ihnen gibt, direkt in Ihre config.ts. So teilen Sie später leichter genauen Kontext mit anderen KI-Tools.

Claude, ChatGPT oder Gemini nutzen​

Allgemeine KI-Assistenten eignen sich gut zum Erzeugen von Seiten, Komponenten und Logik — solange Sie ihnen genug Projektkontext vorab geben.

Eine Unterhaltung starten​

Öffnen Sie eine neue Unterhaltung und liefern Sie diesen Kontext zu Beginn:

„Ich baue eine Custom-Anwendung mit dem Copera SDK (@copera.ai/sdk). Die Anwendung verbindet sich mit Copera Boards, die als meine Datenbank dienen. Ich arbeite von der Copera Starter Application aus. Die Dokumentation der Plattform ist unter https://university.copera.ai/developer/guides/starter-application/overview“

Dieser eine Absatz orientiert die KI auf Ihren Stack. Ab hier kann sie Code erzeugen, der das SDK korrekt nutzt.

Ihre Spaltenstruktur teilen​

Fügen Sie Ihre config.ts in die Unterhaltung ein. Diese Datei mappt die Spalten-IDs Ihres Boards auf menschenlesbare Namen. Mit diesem Kontext weiß die KI genau, welche Felder in generiertem Code referenziert werden sollen.

// Example config.ts excerpt
export const COLUMNS = {
  TICKET_TITLE: 'col_abc123',
  TICKET_STATUS: 'col_def456',
  TICKET_ASSIGNEE: 'col_ghi789',
  TICKET_PRIORITY: 'col_jkl012',
};

Beispiel-Prompts, die gut funktionieren​

  1. Neues Feld in der Detail-Ansicht:

    „Füge eine Spalte ‚Priority‘ zur Ticket-Detailseite hinzu. Die Spalten-ID in Copera ist col_jkl012. Zeige sie als farbiges Badge: rot für High, gelb für Medium, grün für Low.“

  2. Neue Dashboard-Seite:

    „Erstelle eine neue Seite unter /dashboard, die Ticket-Anzahlen gruppiert nach Status zeigt. Nutze die bestehenden React-Query-Muster aus dem Projekt.“

  3. Notification-Workflow hinzufügen:

    „Füge eine E-Mail-Benachrichtigung hinzu, wenn die Status-Spalte eines Tickets auf ‚Done‘ wechselt. Nutze die Copera-SDK-Webhook-Integration.“

  4. App für einen anderen Use Case anpassen:

    „Wandle diese Helpdesk-Anwendung in einen Produktkatalog um. Ich brauche Spalten für Product Name, Price, Description und Image URL. Hier sind die Spalten-IDs aus meinem Copera Board…“

hinweis

Prüfen Sie KI-generierten Code immer, bevor Sie ihn ausführen. Verifizieren Sie, dass Spalten-IDs zu Ihren echten config.ts-Werten passen und dass API-Aufrufe den Mustern der Starter Application folgen.

KI-gestützte IDEs nutzen (Cursor, Windsurf und andere)​

KI-gestützte IDEs betten den Assistenten direkt in den Code-Editor ein. Sie können die gesamte Codebase als Kontext lesen, was sie für die Starter Application besonders effektiv macht.

Die IDE auf Ihre Architektur ausrichten​

Die Starter Application enthält eine Datei CLAUDE.md in base-application-api/ und base-application-web/. Diese Dateien sind so geschrieben, dass KI-Assistenten verstehen:

  • Den Tech-Stack (Framework, Libraries, Versionen)
  • Ordnerstruktur und wo welcher Dateityp hingehört
  • Coding-Konventionen und Naming-Muster
  • Wie man sich mit dem Copera SDK verbindet

Fügen Sie die Datei CLAUDE.md als Referenzdokument in den Kontext-Einstellungen Ihrer IDE hinzu. Die KI erzeugt dann Code, der den etablierten Mustern folgt, statt eigene zu erfinden.

Dokumentation als Kontext hinzufügen​

Die meisten KI-IDEs erlauben, URLs oder Dokumente als Referenzmaterial hinzuzufügen. Fügen Sie die Copera-Entwicklerdokumentation hinzu:

https://university.copera.ai/developer/guides/starter-application/overview

So hat die IDE-KI Zugriff auf die SDK-Referenz und kann genaue API-Aufrufe erzeugen.

tipp

In Cursor können Sie Dokumentations-URLs unter Settings > Features > Docs hinzufügen. Nach dem Indexieren referenziert die KI automatisch SDK-Methoden und Muster aus der Dokumentation, wenn Sie Code generieren lassen.

Tipps für beste Ergebnisse​

Teilen Sie immer Ihre Spalten-IDs. KI-Tools können Ihre Copera-Board-Struktur nicht erraten. Je spezifischer Sie bei Spalten-IDs und Tabellennamen sind, desto genauer ist der generierte Code.

Bauen Sie inkrementell. Beginnen Sie mit einer kleinen Änderung — ein neues Feld, eine neue Seite — und testen Sie, bevor Sie weitermachen. Eine kleine Ergänzung ist viel leichter zu debuggen als eine große.

Referenzieren Sie bestehende Muster. Die Starter Application ist bewusst konsistent. Wenn Sie die KI etwas Neues erzeugen lassen, verweisen Sie auf eine bestehende Datei mit Ähnlichem: „Erzeuge eine neue Seite nach demselben Muster wie TicketDetailPage.tsx.“

SDK-Aufrufe gegen die Dokumentation prüfen. KI-Assistenten erzeugen gelegentlich SDK-Methodenaufrufe, die nicht existieren oder veraltete Argumentformen nutzen. Gegenprüfen Sie gegen die SDK-Dokumentation vor dem Shipping.

Copera AI für Datenfragen, externe KI für Codefragen. Copera AI kennt Ihre Boards; Claude und ChatGPT wissen, wie man React-Komponenten schreibt. Nutzen Sie jedes für das, was es am besten kann.

Nächste Schritte​