Guides / Prompting and shipping

Vibe Coding With Claude: Claude Chat, Claude Code and Building From Claude

Three ways to vibe code with Claude: quick apps in Claude chat, Claude Code on your project, and building and publishing a full app from Claude over MCP.

Mythex Team · 2026-11-01 · 5 min read

Vibe coding with Claude works in three ways. Claude chat builds small single-page apps right in the conversation. Claude Code is an agent that edits a real project on your machine or in the cloud, for people comfortable with a codebase. And Claude plus an app builder over MCP lets you build, preview and publish a full-stack app with a database without leaving the Claude conversation. Which one fits depends on what you're building and how much of the setup you want to own.

This guide covers all three, with prompts and the limits of each. For the idea behind it all, see what vibe coding is.

Option 1: Claude chat for small tools

In the regular Claude app you can ask for something interactive and Claude writes it as code that runs right next to the conversation: a calculator, a flashcard drill, a small game, a chart from data you paste. You change it by replying.

A good prompt here is self-contained:

Make an interactive tool where I paste a list of expenses (one per line, "amount, category") and it shows a pie chart by category and a total. Include a sample list so it works straight away.

What it's great for: quick, single-page tools you use yourself or share as a link, and learning, because you can ask Claude to explain every part.

Where it stops: these run inside Claude's environment. There's no persistent database of your own, no user accounts, no custom domain, and nowhere to run a server. When an idea outgrows one page, you need one of the next two options.

Option 2: Claude Code for a real codebase

Claude Code is Anthropic's coding agent. It works in your terminal, in editors such as VS Code and JetBrains, in a desktop app, and on the web. You give it a task in plain language, and it reads your project, edits files, runs commands and tests, and shows you what changed. At the time of writing it's included with Claude's paid plans and available through the API; check Anthropic's site for current plans.

A typical vibe coding session looks like this:

Add a /bookings page that lists the current user's bookings, newest first, with a cancel button that's disabled less than two hours before the class. Use the existing auth helper. Run the tests when you're done.

What it's great for: developers and technical founders who already have a project, want full control of the stack, and are happy to run and deploy it themselves. It's strong at multi-file changes and at following the conventions already in a codebase.

Where it takes more work: you need a development setup, and Claude Code doesn't host anything. Databases, secrets, deployment and domains are yours to arrange. For a comparison with other developer tools, see Cursor vs Windsurf vs Claude Code.

Habits that work well with Claude Code

• Ask for a plan before large changes. "Outline the steps and files you'll touch, then wait."
• Keep a project notes file. Claude Code reads a project memory file (CLAUDE.md) for conventions, so you don't repeat them.
• Review the diff. Even when you're vibe coding, skim what changed in sensitive areas: auth, payments, anything with user data.
• Commit often. Small commits make it easy to undo a bad step.

Option 3: Build and publish from Claude with Mythex

If you like working in Claude but want a real app at the end — database, logins, file storage, a public URL — you can connect Claude to an AI app builder through MCP, the protocol that lets Claude use tools hosted elsewhere. (What MCP is explains it in plain terms.)

Mythex runs an MCP server. Once it's connected, Claude can create a Mythex project, write the code in a private cloud sandbox, start a live preview, attach a database and file storage, and publish the app. Every result includes a link to watch the project live in Mythex.

How to connect

1. In Mythex, open Account settings and copy the MCP URL: https://mcp.mythex.ai/mcp.
2. In Claude, go to Settings → Connectors → Add custom connector, paste the URL and click Connect.
3. A Mythex page opens. Sign in if needed and choose Allow access. There's no API key to copy.
4. Back in Claude, ask for what you want.

Anyone can connect on any plan; the sandbox tools need Mythex Pro ($25 a month). Claude usage stays on your Claude plan, and sandbox time, previews and hosting come from your Mythex credits. The full walkthrough is in build Mythex apps from Claude, Cursor or Codex.

A first prompt to try

Using Mythex, create a new project: a simple CRM for my small design studio. Contacts with name, company, email, phone, stage (lead, active, past) and notes. A board view by stage where I can drag contacts between columns, and a search box. Add a database so data persists, and a login so only I can see it. Start the preview and send me the link when it's running.

Then iterate in the same conversation, one change at a time:

In the Mythex project, add a "next follow-up" date to contacts and a list on the home screen of follow-ups due this week. Check it in the preview.

Publish the CRM and give me the live URL.

What it's great for: people who think best in Claude and want the result hosted, with a database, without setting up servers. You can also switch: start in Claude and carry on in the Mythex chat, or the other way round, because it's the same project.

Which one should you use?

Prompting tips that matter more with Claude

Claude follows detailed instructions closely, which cuts both ways.

• Say what not to change. "Keep the layout and colours; only change the form validation."
• Give it a definition of done. "Done means a new contact saves, appears on the board, and survives a refresh."
• Ask it to check its work. In Claude Code that means running tests; with Mythex it means checking the live preview or running a browser test.
• Ask for explanations in plain words when you don't follow a change. It's the fastest way to learn what your app is doing.

Our vibe coding prompts cheat sheet has 30 prompts that work in any of the three setups.

Safety notes for all three

• Don't paste real API keys or passwords into a Claude conversation. With Mythex, secrets go in the project's secrets settings, and Claude can see their names but not their values.
• Check who can see what before publishing. "Can a logged-in user open another user's records?" is the first question to ask.
• Review sensitive code. Claude is a capable coder, but vibe coding means you aren't reading every line, so pick the lines that matter. See is vibe coding safe?.

If you also use ChatGPT, the companion guide covers vibe coding with ChatGPT and Codex. And if you'd rather skip the setup entirely, open the AI app builder and describe your app there.