Schritt-für-Schritt-Anleitung: So nutzen Sie Cursor

Wie funktioniert Cursor?

Cursor basiert auf Visual Studio Code (VS Code), der beliebten Entwicklungsumgebung von Microsoft. Der Editor erweitert die gewohnten Funktionen und die Benutzeroberfläche von VS Code um KI-gestützte Funktionen wie Codegenerierung, - Analyse und -Überarbeitung. Außerdem steht ein integrierter Chat zur Verfügung, über den direkt Fragen zu der bestehenden Codebasis gestellt werden können.

Um relevante und präzise Antworten zu liefern, nutzt Cursor eine Codeindexierung. Dabei werden für jede Datei sogenannte Embeddings erzeugt, mit denen das Tool Struktur, Abhängigkeiten und Semantik des Codes besser erfasst. Auf dieser Grundlage kann Cursor präzisere Vorschläge machen, gezielt auf vorhandene Implementierungen verweisen und Änderungen konsistent in den bestehenden Code einpassen.

Cursor unterstützt zudem mehrere Programmiersprachen, lässt sich in GitHub integrieren und eignet sich für unterschiedliche Einsatzszenarien – beispielsweise für schnelles Prototyping, Fehlerbehebung, Refactoring oder die Erstellung und Pflege von Codedokumentation.

Besonders relevant für den praktischen Einsatz sind drei Kernfunktionen von Cursor, die jeweils unterschiedliche Aspekte der KI-gestützten Entwicklung adressieren: Agent Mode, Regeln und Dokumentation.

Agent-Modus

Der Agent ist der Standardmodus von Cursor und ermöglicht es dem Tool, als weitgehend autonomer Agent zu agieren, der direkt mit dem lokalen Dateisystem arbeitet und Änderungen an der Codebasis vornimmt.

In diesem Modus kann Cursor komplexe Aufgaben in kleinere, handhabbare Schritte zerlegen. Das System analysiert die gestellte Aufgabe, durchsucht selbstständig die vorhandene Codebasis und relevante Dateien, entwickelt einen Lösungsplan, führt die einzelnen Schritte aus und überprüft das Ergebnis. Währenddessen informiert Cursor den Entwickler fortlaufend über den aktuellen Status und die vorgenommenen Änderungen.

Typische Einsatzszenarien für den Agent sind anspruchsvollere Aufgaben wie Debugging, Codeoptimierung, Refactoring, die Generierung von Testfällen oder die Implementierung neuer Funktionen. Voraussetzung für gute Ergebnisse sind jedoch klar formulierte Anweisungen sowie eine begleitende Kontrolle durch den Entwickler. Wichtig zu wissen: Der Agent-Modus ist als Unterstützung konzipiert, nicht als vollständig autonomes Entwicklungssystem.

Neben dem Agent Modus bietet Cursor weitere Arbeitsmodi für unterschiedliche Anwendungsfälle. Der Ask-Modus dient der KI-gestützten Suche und Analyse, etwa zum Verständnis von Code oder Architekturen. Der Plan-Modus ermöglicht die umfassende Planung der Funktionen. Ergänzend lassen sich benutzerdefinierte Befehle definieren, um die KI-Unterstützung an individuelle Arbeitsweisen und Projektanforderungen anzupassen.

Regeln

Wenn Cursor aufgefordert wird, Änderungen am Quellcode vorzunehmen – etwa einen Button hinzuzufügen, eine Umschaltfunktion zu ändern oder das Farbschema anzupassen –, folgt das Tool zunächst keinen festen projektbezogenen Vorgaben. Ohne zusätzliche Leitplanken versucht die KI lediglich, die Anforderung bestmöglich umzusetzen. Fehlen dabei klare Rahmenbedingungen, kann das zu unerwünschten Seiteneffekten im Code führen, zum Beispiel zu Stilbrüchen, inkonsistenter Architektur oder verletzten Projektkonventionen.

Um dem entgegenzuwirken, bietet Cursor – wie viele andere generative KI-Werkzeuge – die Möglichkeit, einen System Prompt zu definieren. In Cursor wird diese Funktion als Regeln bezeichnet. Regeln sind dauerhaft hinterlegte Basisanweisungen, die das zugrunde liegende Sprachmodell bei jeder Interaktion berücksichtigt.

Regeln legen fest, wie sich der Cursor-Agent verhalten soll: welche Architekturprinzipien einzuhalten sind, welche Frameworks oder Bibliotheken bevorzugt werden, wie Code strukturiert oder dokumentiert werden soll und welche Praktiken zu vermeiden sind. Da Large Language Models kein dauerhaftes Gedächtnis zwischen den einzelnen Aktionen besitzen, schaffen Regeln einen wiederverwendbaren Kontext, der bei jeder Anfrage erneut angewendet wird.

Beim Erstellen der Regeln empfiehlt es sich, einige Grundsätze zu beachten:

• Regeln sollten prägnant formuliert sein – idealerweise weniger als 500 Zeilen.
• Komplexe Abläufe lassen sich besser in mehrere, kombinierbare Regeln aufteilen.
• Bei Bedarf können konkrete Beispiele oder Referenzdateien angegeben werden.
• Unklare oder vage Anweisungen sollten vermieden werden; Regeln sollten in ihrer Präzision eher interner technischer Dokumentation als allgemeinen Richtlinien ähneln.

Für gängige Frameworks und Sprachen stellt Cursor ein Verzeichnis mit Beispielregeln zur Verfügung, das als Ausgangsbasis für eigene Regeln dienen kann.

Dokumentation

Neben Regeln bietet Cursor die Möglichkeit, Dokumentation gezielt als Kontext in die KI-gestützte Entwicklung einzubinden. Auf diese Weise greift das Tool bei der Codeerstellung explizit auf diese Informationen zurück, anstatt sich ausschließlich auf allgemeines Trainingswissen zu stützen.

Das Hinzufügen von Dokumentation ist besonders dann sinnvoll, wenn Anwendungen für neue Frameworks oder Programmiersprachen entwickelt werden oder wenn projektspezifische Besonderheiten zu berücksichtigen sind. Der zusätzliche Kontext hilft Cursor, APIs, Konfigurationen und Konventionen korrekt zu interpretieren und entsprechend anzuwenden.

Cursor wird zudem mit vordefinierten Dokumentations-Sets ausgeliefert. Diese eignen sich insbesondere für die Arbeit mit etablierten Frameworks und Werkzeugen. Wird Cursor beispielsweise in Verbindung mit dem Infrastructure-as-Code-Werkzeug Terraform eingesetzt, kann die offizielle Terraform-Dokumentation eingebunden werden. Dadurch stellt der Editor sicher, dass Parameter, Ressourcentypen und Konfigurationswerte korrekt verwendet werden und reduziert das Risiko syntaktischer oder semantischer Fehler.

Tutorial: Erstellen Sie eine Webanwendung mit Cursor

Dieses Tutorial zeigt Ihnen Schritt für Schritt, wie Sie mit Cursor eine einfache Webanwendung namens LLM sizer erstellen können.

1. Cursor installieren

Sie können Cursor auf den meisten Betriebssystemen installieren. Die Bereitstellung kann über Paketmanager erfolgen:

Mac: brew install --cask cursor

Windows: winget install --id=Anysphere.Cursor -e

Alternativ können Sie die App auch direkt von der Cursor-Website herunterladen.

Nach der Installation öffnen Sie Cursor und stellen sicher, dass Sie als Projektverzeichnis einen leeren Ordner auswählen. Dadurch wird gewährleistet, dass Cursor keine vorhandenen Dateien oder Quellcode ändert.

Bei Bedarf können Sie die Oberfläche von Cursor auf Deutsch umstellen. Hierfür muss man eine entsprechende Spracherweiterung installieren. Gehen Sie hierzu auf Preferences – Extensions und suchen im Marketplace nach German oder Deutsch. In den Ergebnissen wird das entsprechende Sprachpaket für Visual Studio Code auf Deutsch angezeigt. Da dies nicht alle Funktionen abdeckt, wird in diesem Tutorial die Originalversion auf Englisch verwendet.

2. Sprachmodell wählen

Der Model Picker von Cursor bietet verschiedene LLM-Optionen. Darunter befinden sich auch mehrerer Modelle, die speziell für logische Schlussfolgerungen (Reasoning) optimiert sind. Zusätzlich steht eine Autoselect-Funktion zur Verfügung, die dynamisch das beste Modell für die anstehende Aufgabe auswählt.

Alternativ können Sie das zu verwendende Sprachmodell auch manuell auswählen. Dieses Tutorial verwendet Claude 3.7 Sonnet, das sich gut für die Codeerstellung eignet. Mittlerweile bietet Cursor aber auch aktuellere Modell, wie zum Beispiel Claude 4.5 Sonnet an.

3. Prompt formulieren

Der Prompt bestimmt Aufbau und Funktionsumfang der Webanwendung. Je genauer die Beschreibung, desto besser fällt das Ergebnis aus. Für dieses Tutorial wird folgender Prompt verwendet:

Create a web application that allows me to size which GPU I should use for LLMs that I want to host. the sizer should show different GPUs and how much vRAM they have. There should be a slider to indicate how large the LLM models are in the amount of billion parameters. If the model is 8 billion it should be at least 16 GB of vRAM, if the model is 16 billion it should be at least 32 GB of vRAM. The name of the web application is LLM vRAM sizer. The web app should also have a toggle to switch between light/dark mode.

4. Erstellen einer Webanwendung zulassen

Nach dem Absenden des Prompts generiert Cursor einen Terminalbefehl, für dessen Ausführung es um Erlaubnis bittet. Dieser Befehl erstellt die Webanwendung. In den Einstellungen lässt sich festlegen, ob Cursor für jeden Schritt eine Bestätigung einholen oder Terminalbefehle automatisch ausführen soll.

5. Code überprüfen

Für jede Datei, die Cursor erstellt, werden Sie aufgefordert, den Inhalt zu überprüfen, bevor sie im Dateisystem angelegt wird. Dies ist ein wichtiger Schritt, da KI halluzinieren kann, das heißt, falsche oder irreführende Ausgaben liefert. Die manuelle Überprüfung des Codes stellt sicher, dass er qualitativ hochwertig ist, den Anforderungen des Projekts entspricht und keine offensichtlichen Fehler enthält.

6. Anwendung starten

Nach der Erstellung des Quellcodes startet Cursor die Anwendung im Hintergrund. Cursor listet den Endpunkt auf, unter dem die Anwendung verfügbar ist. Die Anwendung ist bewusst minimalistisch gehalten, wie in Abbildung 4 zu sehen ist.

7. Regeln hinzufügen

Sie können Regeln mit dem Befehl New Cursor Rule erstellen oder indem Sie zu Cursor Settings – Rules navigieren. Mit dem Befehl wird eine neue Regeldatei im Verzeichnis .cursor/rules erstellt. In den Einstellungen ist zudem eine Übersicht aller vorhandenen Regeln und deren Status verfügbar.

Um zu demonstrieren, wie bedeutend die Auswirkungen von Regeln auf die resultierende Anwendung sein können, verwenden Sie die folgende Regel aus dem offiziellen Cursor-Regelverzeichnis: Rules for cursor for react [email protected].

Nach dem Anwenden der Regel führen Sie den folgenden Befehl aus:

Recreate the web application

Mit Hinzufügen dieser speziellen Regel und Aktivieren von Cursor zum Neuerstellen der Website erhalten Sie eine viel übersichtlichere und elegantere Benutzeroberfläche im Vergleich zur ursprünglichen Website. Das liegt daran, dass die Regel Cursor einen besseren Kontext dafür gegeben hat, wie die Anwendung entwickelt werden soll und welche Webentwicklungs-Frameworks verwendet werden sollen.

8. Dokumentation hinzufügen

Zum Abschluss kann relevante Dokumentation hinzugefügt werden, um Cursor noch mehr Kontext zu liefern.

Beispielsweise lässt sich das Tailwind CSS CheatSheet integrieren, indem Sie zu Cursor – Preferences – Cursor Settings – Features navigieren und zum Abschnitt Docs scrollen.

Damit Cursor die Dokumentation nutzt, muss sie im Chat referenziert werden. Dies tun Sie, indem Sie das Chat-Fenster öffnen, @Docs eingeben und die Tailwind CSS Docs aus der Liste auswählen. Anschließend können Sie im Cursor-Chat auf die Dokumentation referenzieren.

In der Auswahlliste erscheinen auch weitere vordefinierte Dokumentationen. Dabei handelt es sich um vordefinierte Docs von Cursor, wie zum Beispiel AWS und PyTorch. Gerade bei plattformspezifischer Entwicklung ist es sinnvoll, die passende Dokumentation explizit einzubinden, da selbst leistungsfähige Sprachmodelle nicht zwangsläufig über detailliertes Spezialwissen zu allen Frameworks verfügen.

Wenn Sie beispielsweise für AWS entwickeln, sollten Sie die AWS-Dokumentation referenzieren. Unabhängig davon, welches Sprachmodell Sie verwenden, wird es nicht von Natur aus über fundierte Kenntnisse aller AWS-spezifischen Komponenten verfügen.