Tabnine: Ein Leitfaden mit Demo-Projekt

Das Schreiben von Code kann echt nervig sein, wenn man sich mit Standardtext oder kleinen Syntaxdetails rumschlagen muss. Diese Reibung wird nur noch größer, wenn du mit neuen KI-Modellen experimentierst und dich einfach nur aufs Entwickeln konzentrieren willst. Tabnine hilft dir, diese Verzögerungen zu vermeiden, indem es KI-Code-Vervollständigungen in deinem Editor anbietet.

In diesem Artikel erkläre ich dir Schritt für Schritt, wie du Tabnine in Visual Studio Code (VS Code) nutzen kannst, um einen KI-Bildeditor mit dem neuesten Bildgenerierungsmodell von Google zu erstellen: Nano Banana. Am Ende dieses Artikels haben wir eine funktionierende Python-App, mit der Leute Bilder über Eingabeaufforderungen erstellen und bearbeiten können.

Was ist Tabnine?

Tabnine ist ein KI-gestützter Programmierassistent, ähnlich wie GitHub Copilot und Cursor. Es läuft in den meisten gängigen Editoren wie VS Code, PyCharm, Jupyter und anderen.

Ein paar der wichtigsten Features von Tabnine sind:

- Jira-Integration: Tabnine kann mit Jira verbunden werden, einer beliebten Plattform für die Verwaltung von Softwareentwicklungsprojekten. Das macht es einfacher, die Arbeit zu organisieren, und Tabnine kann die anstehenden Aufgaben besser im Blick behalten.

- Benutzerdefinierte Befehle: Tabnine hat viele Befehle drauf, wie „Code erklären“ oder „Code reparieren“. Außerdem können Nutzer damit benutzerdefinierte Befehle über Eingabeaufforderungen festlegen.

- Benutzerdefiniertes Verhalten: Mit Tabnine kannst du eine Eingabeaufforderung einrichten, die bestimmt, wie die KI-Modelle antworten. Wenn du zum Beispiel klare Programmierrichtlinien hast, kannst du diese angeben, damit der Code genau nach diesen Richtlinien geschrieben wird.

- Intelligente Autovervollständigung: Es schlägt ganze Zeilen oder Blöcke von Code vor, nicht nur Variablennamen.

- Kontextbewusst: Tabnine passt sich deiner Projektstruktur und deinem Programmierstil an.

- Unterstützung für mehrere KI-Modelle: Tabnine unterstützt die beliebtesten KI-Modelle, sodass du ganz einfach auswählen kannst, welches du verwenden möchtest.

- Lernen im Team: Bei Unternehmensplänen kann es aus der privaten Codebasis deines Teams lernen, um Vorschläge zu machen, die genau auf die Muster deines Unternehmens zugeschnitten sind.

Tabnine einrichten

Um loszulegen, musst du ein Tabnine-Konto erstellen und einen ihrer Tarife abonnieren. Die bieten 'ne 14-tägige Testversion an, also kannst du's kostenlos ausprobieren. Nach der Testphase kostet Tabnine 9 Dollar pro Monat.

Nachdem du dein Tabnine-Konto erstellt hast, öffne VS Code. Wenn du VS Code nicht hast, installiere es von hier. Öffne den Tab „Erweiterungen“ und gib „tabnine“ ein, um die offizielle Erweiterung zu finden.

Sobald die Erweiterung installiert ist, werden wir aufgefordert, uns anzumelden. Dann können wir über die linke Menüleiste auf Tabnine zugreifen (die letzte Option in diesem Screenshot).

Die Benutzeroberfläche von Tabnine erkunden

Bevor wir unseren KI-Bildeditor entwickeln, schauen wir uns kurz die wichtigsten Elemente von Tabnine an.

Wenn wir Tabnine starten, sehen wir eine KI-Chat-Oberfläche:

Oben haben wir einen Modellwähler. Hier können wir uns aussuchen, welches Modell wir nehmen wollen. Ich bleibe in diesem Tutorial bei den Standardeinstellungen, Gemini 2.5 Pro.

Unten können wir den Kontext festlegen. Das legt fest, was das KI-Modell sehen soll, wenn es antwortet.

Standardmäßig umfasst der Kontext die aktuelle Datei und den Arbeitsbereich (das Projekt). Wir können noch andere Sachen hinzufügen, wie zum Beispiel das Terminal, das echt praktisch ist, um das Modell über Fehler zu informieren, wenn wir welche finden. Wir können auch einen bestimmten Codeausschnitt angeben, indem wir das Zeichen „@“ benutzen und dann den Namen der Funktion eingeben, die wir zum Kontext hinzufügen wollen.

Im Hamburger-Menü kannst du Tabnine einrichten:

Zwei wichtige Einstellungen sind benutzerdefiniertes Verhalten und benutzerdefinierte Befehle. Im Abschnitt „Benutzerdefiniertes Verhalten“ können wir eine Eingabeaufforderung festlegen, die das Modell bei der Codegenerierung anleitet. Das ist praktisch, wenn wir wollen, dass der Code bestimmte Regeln einhält.

Im Bereich „Befehle“ kannst du eigene Befehle festlegen, die du über „ / “ im Chat ausführen kannst. Ein Befehl ist im Grunde eine Aufforderung, bestimmte Aktionen durchzuführen. Das ist eine gute Möglichkeit, Zeit zu sparen und zu vermeiden, dass man dieselbe Eingabeaufforderung immer wieder wiederholen muss.

Vibe-Codierung eines KI-Bildbearbeitungsprogramms mit Tabnine

In diesem Abschnitt zeige ich dir, wie du eine Python-App baust, die Nano Banana, Googles neuestes Modell zur Bilderzeugung, zum Bearbeiten von Bildern nutzt. Der Nutzer kann mit einer Eingabeaufforderung ein Bild erstellen oder vorhandene Bilder mit der Eingabeaufforderung kombinieren und bearbeiten.

Ich wollte mal schauen, ob ich diese App mit Vibe-Code machen kann, also komplett von Grund auf mit Prompts.

Der ganze Code, der in diesem Tutorial erstellt wurde, ist in diesem GitHub-Repository.

Die Basis-Benutzeroberfläche erstellen

Als Erstes wollte ich die Basis-Benutzeroberfläche machen, wo Leute Bilder von ihrem Computer auswählen und eine Eingabe machen können. Ich hab einen neuen Ordner erstellt und VS Code in diesem Ordner geöffnet. Ich hab keine Dateien erstellt. Das war meine erste Eingabeaufforderung:

Mir ist hinterher aufgefallen, dass ich vergessen habe zu sagen, dass ich eine Python-App entwickle. Irgendwie hatte ich Glück, und das war genau das, was das KI-Modell dachte, dass ich wollte. Es hat auf meine Eingabe geantwortet, indem es die Befehle erklärt hat, die es ausführen würde, und den Code, den es schreiben würde.

Um die Änderungen zu machen, müssen wir sie entweder einzeln anwenden oder auf die Schaltfläche „Alle anwenden“ unten auf dem Bildschirm klicken. Beachte, dass einige der Änderungen die Ausführung von Befehlen betreffen. In diesen Fällen installieren die Befehle die benötigten Python-Pakete und erstellen die Dateien und Ordner, um den Code zu speichern.

So sah die Oberfläche aus, als ich das Skript ausgeführt habe, das es erstellt hat:

Oben gibt's eine Liste mit allen ausgewählten Bildern und einen Knopf, um einen Dateiauswähler zu öffnen. Der Benutzer kann eine oder mehrere Dateien auswählen, und die ausgewählten Dateien werden aufgelistet. Wenn aber neue Dateien ausgewählt werden, wird die alte Liste überschrieben. Deshalb hab ich darum gebeten, die neuen Dateien an die Liste anzuhängen, anstatt die alten zu löschen.

Als Nächstes wollte ich die Benutzeroberfläche verbessern, damit die Bildminiaturen statt ihrer Pfade angezeigt werden:

Das ist das Ergebnis:

Ein weiteres wichtiges Feature ist, dass man Bilder ganz einfach löschen kann:

Mit dieser Eingabeaufforderung wurde der Code so geändert, dass beim Rechtsklick auf eine Miniaturansicht ein Popup-Menü angezeigt wurde, über das wir das Bild löschen konnten. Ich wollte, dass es so läuft, deshalb bitte ich um diese Änderung:

Als ich die Anwendung nach dieser Änderung ausprobiert habe, hat das Löschen von Bildern nicht mehr geklappt. Ich dachte, es könnte daran liegen, dass ich einen Mac benutze, aber ich hab's nicht gesagt. Ich wollte sehen, ob es das selbst herausfinden kann.

Es hat super geklappt, und ich konnte mit der rechten Maustaste auf ein Bild klicken, um es zu löschen:

Der letzte Schritt in der grundlegenden Benutzeroberfläche war, ein Textfeld für die Eingabeaufforderung hinzuzufügen.

Damit war die Basis-Benutzeroberfläche fertig. Wir können Bilder auswählen und eine Eingabeaufforderung eingeben. Aber wir können noch kein Bild erstellen. Das werden wir im nächsten Abschnitt machen.

Integration von Nano Banana

Um den Code übersichtlich zu halten, habe ich es gebeten, ein neues Python-Skript zu erstellen, das eine Funktion hat, die Googles generative KI-API mit ihrem neuesten Bildmodell nutzt, um Bilder zu generieren.

Es hat das neue Skript und die Datei „ .env “ erstellt. Diese Datei ist für den API-Schlüssel da, den du brauchst, um dich mit der Google API zu verbinden. Wenn du mitmachst, musst du hier einen API-Schlüssel erstellen und ihn in die Datei „ .env ” einfügen.

Dann hab ich es gebeten, einen neuen Button zur Oberfläche hinzuzufügen, um die Funktion zum Erstellen von Bildern aufzurufen. Der Button wurde hinzugefügt, aber als ich draufgeklickt habe, kam 'ne Fehlermeldung. Also hab ich das Terminal erst mal zum Kontext hinzugefügt, bevor ich es gebeten hab, den Fehler zu beheben.

Es hat ein paar Änderungen an den Dateien gemacht, aber der Fehler ist immer noch da. Ich hab's versucht, aber es hat nicht geklappt. Es fing an zu sagen, dass das KI-Modell nicht existiere, und wollte den Code in eine Richtung ändern, von der ich wusste, dass sie nicht richtig war.

Um das Problem zu lösen, musste ich den Code manuell reparieren. Ich bin auf die offizielle Website von Gemini gegangen. offizielle Website von Gemini und habe den Beispielcode von dort kopiert und angepasst.

Das ist einer der Gründe, warum ich es wichtig finde, ein paar Grundkenntnisse im Programmieren zu haben, auch wenn man vibe coding. Es kommt oft vor, dass wir auf etwas stoßen, das das KI-Modell nicht reparieren kann. Da ist es wichtig, dass wir programmieren können, damit wir erkennen, dass das, was das Modell sagt, nicht stimmt, und wir es reparieren können. Solche Tools sollten immer dazu genutzt werden, den Prozess zu beschleunigen, nicht ihn komplett zu ersetzen.

Aber auch wenn ich diesen Code manuell schreiben musste, war Tabnine dank seiner Autovervollständigungsfunktionen echt hilfreich. Als ich zum Beispiel die ausgewählten Bildpfade in Bilder umwandeln wollte, um sie dem Modell zur Verfügung zu stellen, konnte ich einfach anfangen, das Gewünschte einzugeben, und bekam den richtigen Code:

Wir sehen auch über dem Funktionsnamen, dass Tabnine Tools zum Bearbeiten, Testen, Korrigieren, Erklären und Dokumentieren der Funktion bietet. Ich hab zum Beispiel die Dokumentfunktion benutzt, um den Code zu dokumentieren, und sie hat mir einen Vergleich mit den geplanten Änderungen gezeigt, die ich dann annehmen oder ablehnen konnte:

Endergebnis

Die Anwendung war jetzt funktionsfähig und einsatzbereit. Versuchen wir mal, eine Actionfigur für eine bestimmte Person zu erstellen, mit Accessoires aus anderen Bildern:

Hier ist das Ergebnis:

Testen mit Tabnine

Es ist echt wichtig, automatisierte Tests zu schreiben, wenn man an einem Projekt arbeitet. Eine der Funktionen von Tabnine ist, uns beim Schreiben dieser Tests zu helfen.

Diese Funktion findest du auf der Registerkarte „Test“ oder indem du auf die Option „Test“ über einer Funktionsdefinition klickst. Wenn wir das machen, erstellt Tabnine einen Testplan für diese Funktion.

Ein Testplan besteht aus Szenarien mit dem erwarteten Verhalten der Funktion. Hier sind ein paar Szenarien, die Tabnine für unsere Funktion gefunden hat:

Um einen Test für ein bestimmtes Szenario zu erstellen, klicken wir einfach drauf. Es wird die Testfunktion für dieses spezielle Szenario erstellen, die wir dann in unsere Testsuite einbauen können.

Als ich diese Änderungen gemacht habe, war in der Testdatei nur die Testfunktion und sonst nichts. Es fehlten die Importe und die umgebende Testklasse. Ich musste zurück zum Reiter „Chat“ gehen, um es zu bitten, den Test fertig durchzuführen. Danach hatte ich ein Problem, weil der Name der Datei, die erstellt wurde, nicht richtig war. Wie schon vorher hab ich ihm gesagt, dass ein Fehler aufgetreten ist, und er hat ihn behoben. Jetzt läuft der Test ohne Probleme.

Als ich danach noch ein paar Tests gemacht habe, hat alles super geklappt.

Fazit

Tabnine zeigt, wie nützlich es als Tool für schnelle Entwicklung sein kann, weil es sich einfach in gängige Code-Editoren einbinden lässt. Die KI-gestützten Codierungsfunktionen machen den Prozess schneller, sodass Entwickler sich auf Innovationen konzentrieren können, statt sich mit Routineaufgaben zu beschäftigen.

Aber als ich versucht habe, eine App nur mit Vibe-Coding zu machen, wurde mir klar, wie wichtig es ist, die Grundlagen des Programmierens gut zu verstehen. Wenn man blind auf KI-generierten Code vertraut, ohne zu checken, ob er wirklich passt, kann das zu Problemen führen. Entwickler sind dann anfällig für Fehler, die sie vielleicht nicht ganz verstehen.

Tabnine hat meistens gut funktioniert, aber es kam mir oft so vor, als ob das zugrunde liegende KI-Modell die eigentliche Arbeit gemacht hat, ähnlich wie bei anderen Tools wie GitHub Copilot. Tabnine ist zwar echt ein nützliches Tool, aber diese Erfahrung zeigt, wie wichtig traditionelles Programmierwissen ist, um komplexe Softwareanwendungen effektiv und nachhaltig zu entwickeln.