How to Start Vibe Hosting?
Ein komplettes Vibe Coding Tutorial von Anfang an

Du hast wahrscheinlich schon von Vibe Coding gehört — der Praxis, einem KI-System zu beschreiben, was du möchtest, und es den Code für dich schreiben zu lassen. Aber hier ist das, worüber niemand spricht: Was passiert nachdem der Code geschrieben ist?

Most vibe coders hit a wall. They've got a beautiful app sitting on their laptop, and then they Google "how to deploy a website" and fall into a rabbit hole of Docker, Kubernetes, CI/CD pipelines, and YAML files that make them question their life choices.

Da kommt Vibe Hosting ins Spiel.

In diesem Tutorial gehen wir durch den kompletten Workflow von Null bis zu einer live Website mit Claude Code für Vibe Coding und NameOcean für Vibe Hosting.

Was du brauchst

Das war's. Kein Docker. Keine AWS-Konsole. Kein Terraform. Keine Tränen.

Lade die NameOcean Vibe Hosting Desktop-App für deine Plattform herunter und melde dich mit deinem NameOcean Account an. Die App verbindet deine Server mit Claude Code über MCP, damit du alles über natürliche Sprache verwalten kannst.

Melde dich in deinem NameOcean Dashboard an und erstelle einen neuen Server. Wähle den Plan, der zu deinen Anforderungen passt:

Für eine Landing Page oder eine kleine Web-App ist der Starter-Plan mehr als ausreichend.

Wenn Sie eine Domain bei NameOcean registriert haben (oder dorthin transferiert haben), ist das Verbinden mit Ihrem Server eine einzige Aktion. Durch die MCP-Integration von Claude Code ist es buchstäblich ein Satz:

"Bind mywebsite.com to my Starter server"

Im Hintergrund führt NameOcean folgende Aktionen durch:

1. Aktualisiert DNS-Einträge, um auf Ihren Server zu verweisen
2. Stellt automatisch ein SSL-Zertifikat über Let's Encrypt bereit
3. Konfiguriert den Load Balancer, um HTTPS-Traffic an Ihren Server weiterzuleiten

Innerhalb weniger Minuten ist Ihre Domain live und mit HTTPS gesichert. Keine Certbot-Befehle, keine Nginx-SSL-Konfiguration, keine DNS-Propagierungsspiele.

Jetzt zum spaßigen Teil. Öffnen Sie Ihr Projektverzeichnis und starten Sie Claude Code:

mkdir my-awesome-site && cd my-awesome-site
git init
claude

Beschreiben Sie dann einfach, was Sie möchten:

"Create a modern landing page for my WordGrid word puzzle game.
It should have a hero section with App Store and Google Play buttons,
a features section, screenshots, how-to-play steps, and a CTA section.
Use the game's color palette — orange, teal, purple on a dark background."

Claude Code erstellt eine vollständige, responsive, produktionsreife Website. Sie schreiben keine einzige Zeile Code. Sie beschreiben den Vibe, und die KI liefert.

Die Kunst des Vibe Coding

Der Schlüssel zum erfolgreichen Vibe Coding ist, spezifisch zu sein über was Sie möchten, aber flexibel über wie es umgesetzt wird:

Think of it like talking to a skilled designer. You say "I want a modern, dark-themed landing page that feels playful and energetic" -- you don't say "use flexbox with a 24px gap and a linear gradient from #0f1628 to #161d35."

Hier glänzt Vibe Hosting. Jeder NameOcean-Server wird mit einem integrierten Git Remote geliefert. Fügen Sie ihn einmalig hinzu:

# Add the remote (first time only)
git remote add nameocean ssh://root@yourserver.nameocean.org:PORT/root/app

# Deploy
git add .
git commit -m "Initial launch"
git push nameocean main

Das war's. Ihr Code landet in /root/app/ auf dem Server. Nginx ist bereits so konfiguriert, dass statische Dateien aus diesem Verzeichnis bereitgestellt werden. Ihre Website ist live.

Kein Build-Schritt. Kein Docker-Image. Keine Deployment-Pipeline. Kein Warten. Einfach git push und Browser aktualisieren.

Die echte Stärke von Vibe Coding + Vibe Hosting ist die Iterationsgeschwindigkeit. Möchten Sie den Hero-Bereich ändern?

"Make the hero headline bigger and add a floating animation to the phone mockup"

Dann stellen Sie erneut bereit:

git add . && git commit -m "Bigger hero headline + animation" && git push nameocean main

Ihre Änderungen sind in Sekunden live. Diese Feedback-Schleife — beschreiben → generieren → bereitstellen → live sehen — macht Vibe Hosting transformativ. Sie codieren nicht nur schneller; Sie versenden schneller.

Über statische Seiten hinaus

Vibe Hosting auf NameOcean ist nicht auf statisches HTML beschränkt. Die Plattform unterstützt Full-Stack-Anwendungen sofort.

Node.js / Express / Next.js

Sagen Sie Claude Code, es soll Ihre Express-API oder Next.js-App erstellen. Konfigurieren Sie sie so, dass sie auf Port 8000 lauscht, richten Sie Supervisor ein, um sie am Laufen zu halten, und heben Sie die Auskommentierung des Reverse Proxy in der Nginx-Konfiguration auf. Fertig.

Python / Flask / FastAPI

Derselbe Workflow. Ihre Python-App lauscht auf Port 8000, Supervisor verwaltet den Prozess, Nginx leitet die Anfragen weiter. NameOcean wird mit Python 3.14 und pyenv vorinstalliert geliefert.

Go / Rust / Alles

Kompiliere dein Binary, starte es auf Port 8000, und Nginx kümmert sich um den Rest. Oder nutze Docker, wenn dir das besser gefällt – es ist auch vorinstalliert.

Die MCP-Integration: Vibe Hosting im Autopilot

Hier ist, was die NameOcean + Claude Code Kombination besonders macht: MCP (Model Context Protocol) Integration.

Wenn du NameOcean als MCP-Server in Claude Code verbindest, kann die KI direkt:

• Server erstellen und verwalten — Infrastruktur mit einem Satz aufbauen
• Domains binden — mit automatischer SSL und DNS-Konfiguration
• Ports öffnen/schließen — für Datenbanken, APIs und Services
• Code deployen — via git push, ausgelöst aus dem Gespräch
• Server-Status prüfen — deine Infrastruktur in natürlicher Sprache überwachen

Das bedeutet, du kannst einfach sagen:

"Create a new Starter server, bind mydomain.com to it, build
a portfolio website with my projects, and deploy it"

Und Claude Code kümmert sich um alles — von der Server-Bereitstellung über das Schreiben des Codes bis zum Deployment. Der gesamte Lebenszyklus, gesteuert durch natürliche Sprache. Die Infrastruktur wird unsichtbar.

Echtes Beispiel: WordGrid Landing Page

Lass uns dich durch ein echtes Beispiel führen. Wir haben die Landing Page für WordGrid, ein türkisches Wortpuzzle-Spiel, von Grund auf gebaut.

Gesamtzeit: unter 10 Minuten.

Das Ergebnis: eine vollständig responsive, dunkel gestaltete Landing Page mit animiertem Hero-Bereich, App Store und Google Play Download-Buttons, Features Grid, Screenshot-Galerie, Spielanleitung, Call-to-Action-Bereich und mobil-optimiertes Layout. Alles von KI generiert und mit einem einzigen Push deployed.

Tipps für effektives Vibe Hosting