Warum dieser Stack?
Die kürzeste Strecke von der Idee zur Live-Website.
Was du nach diesem Modul kannst
- Du verstehst, welche vier Tools zusammenspielen und warum.
- Du kennst die typische Reise einer Idee: von der Skizze bis zur Domain.
Stell dir vor, du hast morgen früh eine Idee. Ein neues Produkt, eine Landingpage, ein kleines Tool. Heute Abend läuft sie unter deiner eigenen Domain, dein Team kann mitarbeiten, und du hast trotzdem nicht den ganzen Tag in einer Konsole verbracht.
Die Bestandteile
Die vier Werkzeuge im Überblick
Statt dreißig verschiedener Tools bekommst du genau vier. Alle sind für deine ersten Schritte kostenlos und so aufeinander abgestimmt, dass die typische Entwickler-Friktion fast verschwindet:
- Cursor ist deine Werkstatt. Eine moderne IDE mit einer KI, die dein Projekt versteht und auf Wunsch ganze Dateien für dich bearbeitet.
- GitHub ist dein gemeinsamer Speicher mit Versions-Historie. Hier arbeitet dein Team, hier ist jede Änderung jederzeit nachvollziehbar.
- Next.js ist das Fundament. Das Framework, mit dem 2026 die meisten modernen Webseiten gebaut werden, von OpenAI über Notion bis Adidas.
- Vercel ist die Live-Schaltung. Ein Klick, und dein Code läuft auf deiner eigenen Domain.
Der Weg deiner Idee
Von der Skizze zur Live-Website in sechs Stationen
Deine Idee
Skizze, Notiz, Gedanke
1/6Cursor
KI baut mit dir
2/6GitHub
Speichern · Teamwork
3/6Next.js
Das Fundament
4/6Vercel
Auto-Deploy
5/6Deine Domain
deine-idee.de
6/6
Begründung
Warum gerade diese Kombination
Es gibt unzählige Wege, eine Webseite zu bauen. Diese vier Werkzeuge wurden allerdings aktiv füreinander gebaut. Cursor ist auf Git-Workflows ausgelegt. Vercel ist von den Erfinder:innen von Next.js. GitHub bildet die Klammer. Drei Konsequenzen:
- Du verlierst weniger Zeit mit Setup, Konfiguration und Versöhnung von Tools.
- Wenn du Hilfe von Profis dazu holst, finden die sich in deinem Repo sofort zurecht.
- Wenn deine Idee Traktion bekommt, skaliert der Stack mit dir bis zum Enterprise-Niveau.
Abgrenzung
Wieso nicht einfach Claude Code oder ein Artefakt?
Vielleicht hast du schon mit Claude Code, ChatGPT-Canvas oder einem v0-Artefakt etwas zusammengeklickt. Diese Tools sind großartig zum Brainstormen und um eine Idee in fünf Minuten greifbar zu machen. Dort hört die Reise dann allerdings auf:
Claude / Artefakt
Skizze
Vibe-Coding Stack
Produkt
Anders gesagt: Artefakte sind das Whiteboard. Der Vibe-Coding Stack ist der Boden, auf dem dein Produkt steht. Beides hat seinen Platz. Wenn deine Idee nur ein Demo-Moment ist (z. B. eine schnelle Visualisierung im Pitch), bleib beim Artefakt. Wenn echte Menschen mit deiner Idee interagieren sollen, brauchst du den Stack.
Vergleich
Wie sich der Weg verkürzt
Klassischer Weg
≈ 4–8 Wochen
Vibe-Coding Stack
≈ 1 Tag
Was du tust
Du beschreibst, die KI baut
Du wirst Code sehen, schreibst ihn aber selbst nicht. Cursor übernimmt das. Deine Aufgabe ist, in klarer Sprache zu beschreiben, was du willst, und der KI gute Anweisungen zu geben. Genau dafür bekommst du in den nächsten Modulen die Vokabeln.
Wir wollen dich nicht zur Entwickler:in machen. Wir geben dir das nötige Verständnis, um eine Idee schnell zu testen, eine Landingpage selbst online zu bringen und mit der KI auf Augenhöhe zu sprechen. Sobald deine Idee Traktion bekommt, übergibst du sauber an dein Team. Dafür ist Modul 05 da.
Falls du Begleitung suchst
Colortreat begleitet Research → Prototyp → Build → Scale
Die Werkzeuge in diesem Guide sind dieselben, die wir im Colortreat-InnovationLab täglich einsetzen. Bevor du startest, dazwischen, oder wenn aus deinem Prototyp ein Team werden soll: wir steigen dort ein, wo du Unterstützung brauchst, über Machbarkeitsstudien, Consulting, unser Partner-Netzwerk oder als externes Entwicklungs-Team.
Weiter geht's
Was du als Nächstes tust
Im nächsten Modul richten wir GitHub ein, deinen sicheren Speicher. Du erstellst einen Account, lernst die vier zentralen Begriffe (Repository, Commit, Branch, Pull Request) und legst dein erstes Repository an. Den Rest erledigt ab Modul 02 dann die KI in Cursor für dich.
Modul 00 · 6 min