How to Vibe Code with Claude: Step-by-Step Guide (2026)

Superapp's guide to vibe coding with Claude: the Claude app and artifacts, Claude Code, Claude in Xcode, and the full path to a native iPhone app.

How to Vibe Code with Claude: The Short Answer

Superapp's short version: there are three ways to vibe code with Claude. Describe an app in the Claude app and it builds a shareable artifact, free. Install Claude Code to let Claude build, run and fix a real project, on any paid plan. Or, for iPhone apps, pair Claude with Xcode or a native app builder. Start with the first, move to the second when you outgrow it.

Quick answer: how do you vibe code with Claude? Superapp's recommended path: open the Claude app and describe a small app; Claude builds it as an artifact you can use and share, on the Free plan. For real projects, install Claude Code (included in all paid plans, from $20 a month), run claude in a project folder, describe what you want, and let it write, run and fix the code while you test and steer. For a native iPhone app, combine Claude with Xcode or a native app builder. Review anything that handles logins, payments or personal data before launch.

What are the ways to vibe code with Claude?

You can vibe code with Claude at four levels of setup, from none to a full iOS workflow.

Way Setup Plan needed Best for
Superapp with Claude Code (Mac version) Mac, Xcode, guided setup Superapp plan plus a Claude paid plan Native iPhone, iPad and Mac apps with full control
Claude app with artifacts None Free Small tools, games and prototypes you can share
Claude Code Install in terminal, IDE, desktop app or browser Any paid Claude plan Real projects with files, commands and git
Claude in Xcode Xcode 26, sign in with Claude Pro, Max, or premium Team and Enterprise seats Developers already working in Xcode

Fun fact: vibe coding was named on a Claude model. Karpathy's original February 2025 post said it was "possible because the LLMs (e.g., Cursor Composer w Sonnet) are getting too good" (The New Stack). Sonnet is one of Claude's model families.

How do you vibe code in the Claude app?

The Claude app is the zero-setup way to vibe code: you describe an app in chat and Claude builds it as an artifact. Anthropic's pitch is "Just tell Claude your idea to instantly create shareable apps, tools, and games," and artifacts are available on the Free, Pro and Max plans (Claude blog).

  1. Open Claude on the web, desktop or mobile app.
  2. Describe a small app: who it is for, what it does, and how it should look.
  3. Use the artifact that appears; it runs right in the conversation.
  4. Ask for one change at a time until it works.
  5. Share it; Anthropic notes "You can also share artifacts for anyone to view your creations."

Artifacts suit flashcard apps, calculators, quizzes, small games and internal tools. They are not App Store apps; for that you need Claude Code or a native app builder.

What can Claude artifacts do?

Artifacts have grown well beyond static pages. According to Anthropic, you can build interactive, AI-powered apps, tools and games; examples include a flashcard app where users pick their own topic and generate cards, a personalized storytelling app, and a coding tutor (Claude blog). Embedding AI capabilities directly into artifacts is in beta, and an October 2025 update added MCP connections and persistent storage. Artifacts work in the Claude web, desktop and mobile apps, and people you share them with can sign in on any plan for the full experience.

Artifact idea First prompt to try Good next step
Clickable iPhone app mock-up to rebuild later in Superapp "Make an interactive mock-up of a habit tracker phone app: Today, Stats and Settings screens with working tabs." Use it to agree the screens, then build the native app
Flashcard trainer "Build a flashcard app where I paste a list of words and it quizzes me, tracking which ones I miss." Ask it to save progress between visits
Budget calculator "A monthly budget calculator: income, fixed costs, savings goal, and a chart of what's left." Add categories one at a time
Team quiz "A 10-question quiz about our product with a score and the right answers at the end." Share the link with the team
Small game "A simple browser game: dodge falling blocks with arrow keys, speed increases, high score." Tune speed and difficulty one prompt at a time

Worked example: a flashcard app in the Claude app in 5 prompts

This illustrative session needs no setup and works on the Free plan.

  1. "Build a flashcard app. I paste a list of word pairs like 'hola = hello', and it shows one side, I tap to flip, then mark right or wrong."
  2. "Shuffle the cards, and show cards I got wrong again at the end."
  3. "Add a progress bar and a final score screen."
  4. "Make it look clean: white background, large text, one blue accent, and it should work well on a phone screen."
  5. "Let me save several decks with names and switch between them."

Each prompt adds one capability, and you test it in the conversation before moving on. When you start wanting accounts, a custom domain or an App Store listing, that is the signal to move to Claude Code or a native app builder.

Decide in 3 questions: which way should you start?

  1. Do you want an iPhone, iPad or Mac app in the App Store? Use a native route: Superapp, or Claude Code with Xcode.
  2. Is it a small tool, quiz or game you just want to use and share? Start in the Claude app with artifacts.
  3. Is it a real project with files, a database or deployment? Use Claude Code.

When should you graduate from artifacts to Claude Code?

Move up when the artifact starts fighting you. Common signs: you need several screens with navigation, data that lives outside one conversation, sign-in for other people, your own domain, or code you want to keep in version control. Claude Code works on actual project files, runs commands and uses git, so the app can grow beyond a single conversation. You can carry the idea over: paste your artifact's description and the features you added as the first prompt of your Claude Code project.

How do you vibe code with Claude Code?

Claude Code is "an agentic coding tool that reads your codebase, edits files, runs commands, and integrates with your development tools," available in the terminal, IDE, desktop app and browser (Claude Code docs). It is the step up from artifacts: Claude works on a real project on your computer or in the cloud.

  1. Get a paid Claude plan; "Claude Code is included in all paid plans" (Claude pricing).
  2. Install it. On macOS, Linux or WSL: curl -fsSL https://claude.ai/install.sh | bash. Or skip installing and use the desktop app's Code tab or claude.ai/code in your browser.
  3. Make a project folder, open it in a terminal, and run claude.
  4. Describe the app you want in plain English, like a short brief.
  5. Let Claude plan and build; it writes files, runs commands and checks its work.
  6. Test the result yourself, then ask for one change per prompt.
  7. Paste exact error messages or screenshots when something breaks.
  8. Commit working versions with git so you can roll back; Claude can do this for you.

What does a good brief for Claude look like?

Your first prompt sets the direction for everything after it, so it is worth five minutes. A brief that works:

App: StreakUp, a habit tracker.
Who it's for: people trying to build one daily habit who keep forgetting.
Screens:
1. Today: my habits with a big check button each.
2. Stats: current streak and a chart of the last 7 days.
3. Settings: daily reminder time, dark mode.
The one thing it must do well: check off a habit in one tap.
Data: each user's habits are private.
Style: clean, lots of white space, one green accent.
Out of scope for version 1: payments, sharing, social features.
Before you start: ask me any questions you need answered.

Why it works: it names a real person and problem, lists screens rather than features, picks one core action to protect, sets a privacy rule early, and says what not to build. The final line invites Claude to fill gaps by asking instead of guessing.

Plan first, then build

Claude Code works best when it understands the goal before it touches files. A simple routine:

  1. Describe the app and add "Ask me any questions before you start, and don't write code yet."
  2. Answer the questions.
  3. Ask for a numbered plan and read it. Cut anything not needed for version 1.
  4. Ask Claude to build step 1 only, run it, and show you the result.
  5. Continue step by step, committing after each working step.

Reading the plan is the cheapest moment to catch a misunderstanding. Fixing it after twenty files have changed costs far more.

A starter CLAUDE.md for vibe coders

Claude Code reads CLAUDE.md at the start of every session (Claude Code docs), so it is where your project's standing instructions go. The docs advise keeping it short and limited to what Claude cannot work out from the code. A minimal version:

StreakUp
Habit tracker for people building one daily habit.
- Core action: check off a habit in one tap. Never break this.
- Each user's data is private to them.
- Ask before adding new libraries or services.
- After each change, run the app and tell me what you checked.
- Out of scope for now: payments, social features.

Five or six lines beat fifty. If a rule must never be broken, the docs suggest a hook rather than more emphasis in CLAUDE.md.

A version for an iPhone app project adds the platform facts Claude cannot guess:

StreakUp for iPhone
Native SwiftUI app, iOS only for now.
- Core action: check off a habit in one tap.
- Test on the smallest and largest current iPhone sizes.
- Each user's data is private to them.
- Ask before adding any third-party package.
- After each change, build the project and report any errors in full.

The "build and report errors in full" line gives Claude a check to run, which is exactly what the docs recommend: tell Claude what it can't see, and give it a way to verify its own work.

Worked example: a habit app with Claude Code in 8 prompts

This illustrative session shows the rhythm. The prompts are the pattern to copy.

  1. "Here is my app idea: [brief]. Ask me any questions before you start. Don't write code yet."
  2. After answering: "Write a numbered plan for version 1. Keep it to the core action and three screens."
  3. "Build step 1 only: the Today screen with sample habits. Run it and show me it works."
  4. "Make the check button mark a habit done for today and increase the streak. Undo on second tap."
  5. "Here is a screenshot: the list overlaps the bottom bar on small screens. Fix only that."
  6. "When I add a habit with an empty name it crashes. Here is the full error: [paste]. Show a message instead."
  7. "Commit this working version with a clear message."
  8. "Review this code for security and data-privacy problems before I share it. List issues first, then fix them one at a time."

Notice the pattern: one outcome per prompt, real evidence (screenshots, exact errors), a commit at a working point, and a review at the end. If a step fails twice, follow the docs' advice: /clear, then one better prompt that includes what you learned.

Worked example: fixing a bug in an existing project with Claude Code

Vibe coding is not only for new apps. This illustrative session fixes a bug in a project someone else started.

  1. "Read this project and explain in plain English what it does and how it's organized. Don't change anything."
  2. "Users say saved habits disappear after they close the app. Find where saving happens and explain why that could occur. Don't fix it yet."
  3. After reading the explanation: "Fix it with the smallest change that works. Tell me which files you changed."
  4. "Write a test that saves a habit, simulates closing the app, and checks it's still there. Run it and show me the output."
  5. "Commit this with a clear message and summarize the change for the person who owns this project."

The pattern: understand before changing, ask for the cause before the fix, keep the change small, prove it with a test, and leave a clear record. This is the same discipline Karpathy described for agentic engineering, applied by someone who may never have written the code themselves.

Which Claude Code features matter for vibe coders?

Claude Code has many features; beginners only need a few at first. All of these are described in the Claude Code docs.

  • CLAUDE.md: a project file Claude reads at the start of every session. Put your app's purpose and a handful of rules here. Claude also builds auto memory as it works, saving learnings across sessions.
  • Git integration: Claude "stages changes, writes commit messages, creates branches, and opens pull requests." For vibe coders this is your undo button.
  • Skills: packaged, repeatable workflows such as a custom review or deploy command. Useful once you repeat the same steps often.
  • Hooks: shell commands that run before or after Claude's actions, such as formatting after every edit. Use them for rules that must never be broken.
  • MCP: an open standard that lets Claude read and act in other tools, such as design docs, tickets or chat. Handy when your specs live elsewhere.
  • Subagents and background agents: several Claude agents working on parts of a task in parallel. Mostly for larger projects.
  • Scheduled tasks: run Claude on a schedule, in the cloud or on your machine, for chores like dependency checks.
  • Remote Control and the mobile app: keep a session going from your phone or another browser.

Start with CLAUDE.md and git. Add hooks when a rule matters too much to leave to judgment, and the rest when a real need appears.

Which Claude Code surface should you use?

All surfaces run the same Claude Code engine, so pick the one that matches how comfortable you are with developer tools.

Surface You need Good for
Desktop app with Superapp Mac alongside Mac, paid Claude plan iOS builders who want visual diffs and a native app project
Web (claude.ai/code) A browser, paid plan No local setup, long tasks you check on later
Desktop app (Code tab) Mac or Windows, paid plan Beginners who want visual diffs instead of a terminal
Terminal CLI A terminal The full feature set and scripting
VS Code, Cursor or JetBrains One of those editors People already coding in an editor
Claude mobile app iOS or Android Starting or checking tasks away from your desk

Your first Claude Code session without a terminal

If a terminal feels intimidating, start in the desktop app or the browser. The docs say the desktop app "includes Claude Code, so you don't need to install the CLI separately," and the web version at claude.ai/code needs no local setup (Claude Code docs).

  1. Install the Claude desktop app, sign in on a paid plan, and click the Code tab. Or open claude.ai/code in a browser.
  2. Start a new session and choose or create a project folder or repository.
  3. Paste your brief and ask Claude to ask questions first.
  4. Approve the plan, then let it build step 1.
  5. Review the changes visually; the desktop app shows diffs so you can see what changed.
  6. Ask Claude to run the app and show you the result.

You get the same engine as the terminal, with a friendlier view of what Claude is doing.

Claude Code commands every beginner should know

  • claude: start a session in the current folder.
  • claude --version: check the install worked; a version number means you are set.
  • Esc: stop Claude mid-task when it heads the wrong way.
  • /clear: start fresh between unrelated tasks. The docs note it "costs nothing, and it means the next task doesn't keep paying for the previous one's history."
  • /hooks: see the hooks that enforce your hard rules.
  • /desktop: continue a terminal session in the desktop app to review diffs visually.
  • claude -p "...": run a one-off request without opening a session, handy for scripts.

Can you vibe code with Claude on your phone?

Yes, in two ways. Artifacts work in the Claude iOS and Android apps, which Anthropic added in July 2025 (Claude blog), so you can describe and use a small app from your phone. Claude Code is also available in the Claude mobile app, and its docs describe starting a long-running task on the web or in the mobile app, then pulling it into your terminal later (Claude Code docs).

In practice, the phone is best for starting tasks, checking progress and testing results; detailed review of changes is easier on a bigger screen. A good pattern is to kick off a well-scoped task from your phone ("add a weekly chart to the Stats screen, run the tests, and show me the result"), then review the diff at your desk before you merge it.

How do you write prompts for Claude when vibe coding?

Give Claude what it cannot see. Claude Code's docs put it as "tell Claude what it can't see, give it a check to run" (Claude Code docs).

Build a [type of app] for [who it is for].
Screens: [screen 1], [screen 2], [screen 3].
The one thing it must do well: [core action].
Style: [short description].
When you're done, run it and show me it works.

The last line matters: the docs recommend asking for evidence, such as the command Claude ran and its output, or a screenshot, rather than accepting "all tests pass".

Follow-up prompts that work well with Claude

Situation Prompt
Building a Superapp Mac project with Claude Code "Only change the Settings screen. Build the project and tell me if it compiles."
You don't understand the code "Explain in plain English how saving a habit works in this project."
A fuzzy task "Ask me questions before you start."
A bigger feature "Plan how you'd add reminders. Numbered steps, no code yet."
A visual bug Paste a screenshot: "This is cut off on small screens. Fix only this."
An error "Here is the full error: [paste]. Find the root cause before changing anything."
Claude drifted Press Esc, then: "Stop. Undo that. Only do [the one thing]."
Before sharing "Review this for security problems as if it goes live tomorrow."

A prompt for every stage of the build

Stage Prompt
Idea, for an app you'll build in Superapp or Claude Code "Here's my app idea: [one paragraph]. What's the smallest version that still solves the problem?"
Plan "Ask me any questions, then write a numbered plan for version 1. No code yet."
First build "Build step 1 only. Run it and show me the result."
Feature "Add [one feature]. Only touch the files you need, and tell me which ones you changed."
Design polish "Here's a screenshot. Make spacing consistent and the main button more obvious. Change nothing else."
Understanding "Explain how this part works as if I'm not a programmer."
Testing "Write tests for the core action and run them. Show me the output."
Security "Review this project for security and privacy problems. List them by severity before fixing."
Launch prep "What do I still need before real users can use this safely?"

What do you do when Claude gets stuck?

Most stuck sessions look the same. Match the symptom, then act.

Symptom What is going on What to do
A Superapp Mac project stops building after a Claude Code change The last change broke the build Paste the build error and ask Claude to fix only that, or roll back with git
Claude keeps fixing the same bug The conversation is cluttered with failed attempts /clear, then one new prompt with the goal, current state and the exact error
Claude changes files you didn't mention The prompt had no boundaries Name the files or screens it may touch, and say what it must not change
It says "done" but nothing works You didn't ask for evidence Ask it to run the app or tests and show the output or a screenshot
It forgets your rules every session Rules live only in chat Put the short version in CLAUDE.md
A big change broke everything Too much at once Revert to the last commit and ask for a smaller step

How do you read errors with Claude?

You do not need to understand an error to use it. The docs' advice for bugs is simply to "paste an error message or describe the symptom," and Claude "traces the issue through your codebase, identifies the root cause, and implements a fix" (Claude Code docs). A few habits make that work better:

  1. Copy the whole error, not just the first line; the useful part is often further down.
  2. Say what you did right before it happened.
  3. Ask for the cause before the fix: "Explain what this error means and why it happened, then fix it."
  4. If the error is visual, take a screenshot instead of describing it.
  5. After the fix, ask Claude to show you the app running without the error.

Over time, reading Claude's explanations teaches you the common error types, which makes your next prompts sharper.

How do you keep Claude Code sessions efficient?

Long, wandering sessions give worse results and use more of your plan. Keep them focused:

  • One task per session; /clear when you switch topics.
  • Scope requests to the files or screens that matter.
  • Keep CLAUDE.md short, since it loads into every session.
  • Start big jobs with a plan, so Claude does not explore in circles.
  • Stop early when Claude drifts, rather than letting a wrong approach run to the end.

How do you vibe code an iOS app with Claude?

You have three routes to a native iPhone app with Claude, depending on how much of the toolchain you want to handle.

  1. Claude Code plus Xcode: Claude writes the Swift project, you build and run it in Xcode on a Mac. Most control, most setup.
  2. Claude in Xcode: since September 2025, you can "connect their Claude account to Xcode 26" and use Claude as a coding assistant inside Apple's editor, on Pro and Max plans or premium Team and Enterprise seats (Anthropic). Best if you already know Xcode.
  3. A native app builder: describe the app and get a Swift project without touching Xcode.

As a disclosure, Superapp is our product, so weigh this accordingly. Superapp's web version builds native Swift apps from a description in any browser, with no Mac, and prepares the App Store submission. Its Mac version is built for the Claude workflow: Superapp says many users pair it with "Claude Code, Codex and Xcode", and asked whether it works with Claude Code, its FAQ answers "Yes, on the Mac version. In fact, that's how many of our users build." (Superapp). The Mac version needs a recent macOS and a one-time Xcode setup. For a broader look at AI in Xcode, see how to build apps with AI in Xcode.

Which iOS route fits you?

Route Mac needed? Xcode skills needed Best for
Superapp web version No None Non-coders who want a native app and App Store prep handled
Superapp Mac version with Claude Code Yes Light; setup is guided Builders who want Claude Code's control on a native project
Claude Code plus Xcode Yes Moderate People comfortable building, signing and running in Xcode
Claude in Xcode 26 Yes Yes iOS developers who want Claude inside Apple's editor

From idea to App Store with Claude: the full path

  1. Write a one-page brief: users, screens, core action, what is out of scope.
  2. Optional: mock up the screens as a Claude artifact to settle the flow quickly.
  3. Choose your route from the table above.
  4. Build the core screen first and run it on a real iPhone as early as possible.
  5. Add one feature per prompt, committing each working step with git.
  6. Add sign-in and stored data only once the core flow works.
  7. Test the basics: empty states, no connection, small and large iPhones, two accounts.
  8. Ask Claude for a security and privacy review, then fix issues one at a time.
  9. Prepare the listing: name, screenshots, description and privacy details. You need an Apple Developer Program membership.
  10. Submit for Apple's review, and share a beta with friends first if you can.

How do you use Claude in Xcode?

Claude in Xcode is for people who already work in Apple's editor. Anthropic's announcement describes two parts (Anthropic):

  • A coding assistant: "Interact with your code using natural language." It gathers project context and supports conversation history and file attachments.
  • Coding tools: generating documentation, explaining highlighted code, creating SwiftUI previews and playgrounds, and making inline edits in the editor.

To use it, connect your Claude account in Xcode 26's settings, on a Pro or Max plan or a premium Team or Enterprise seat. It is a good fit for targeted work inside one file or screen. For multi-file changes, setup work and running commands, Claude Code is the stronger tool, and you can use both on the same project.

How do you vibe code other kinds of projects with Claude?

The same loop works everywhere; the starting point changes.

A web app with Claude Code

  1. Make an empty folder, open it in Claude Code, and paste your brief.
  2. Ask Claude to propose a simple setup and explain it in plain English before building.
  3. Build one page at a time, running it locally after each step.
  4. Ask Claude to add sign-in and a database only when the pages work.
  5. Ask how to deploy it and what each step costs before you agree.

An internal tool from a spreadsheet

  1. Export a sample of your data as a CSV and put it in the project folder.
  2. "Read this CSV and build a page that shows totals by week as a chart."
  3. Add filters and views; keep it read-only at first.
  4. Only then allow edits, and test on a copy of the data.

A small game

  1. Start as an artifact to find the fun quickly: controls, goal, scoring.
  2. When it feels right, move to Claude Code if you want a real project you can publish.
  3. Tune one variable per prompt: speed, gravity, spawn rate.
  4. For an iPhone game, use one of the iOS routes above; casual 2D games are realistic, complex 3D needs a game engine.

How much does vibe coding with Claude cost?

You can start free in the Claude app; Claude Code needs a paid plan.

Option Cost (US, Nov 2026) Includes
Superapp Free credits to start; Pro from $25 a month Native Apple apps; paid plans get free credits on Mac
Claude Free $0 Chat and artifacts, no Claude Code
Claude Pro $20 a month, or $17 a month billed yearly Claude Code, Claude in Xcode
Claude Max From $100 a month Claude Code with more usage

Prices from Claude pricing and Superapp, checked November 2026. Publishing to the App Store also needs an Apple Developer Program membership.

How long does it take to build an app with Claude?

It depends far more on scope than on the tool. As a rough, illustrative guide based on the workflows above:

  • A small artifact, such as a calculator, quiz or flashcard app: one sitting.
  • A first Claude Code project with a few screens and saved data: a day or a few evenings, including learning the loop.
  • An app real users can sign up for: add time for testing, a security review and fixes, often more than the build itself.
  • An App Store release: add time for the listing, screenshots, privacy details and Apple's review.

The fastest builders are not the ones with the cleverest prompts. They keep scope small, commit often, restart sessions instead of fighting them, and test on real devices early.

Is Claude Code vibe coding?

It can be, depending on how you use it. If you accept Claude Code's changes without reading them and judge only by whether the app works, that is vibe coding. If you plan, review diffs and run tests, it is closer to what Karpathy later called agentic engineering. The tool is the same; the discipline differs.

What are the best practices for vibe coding with Claude?

  • One task per prompt, and /clear between unrelated tasks (Claude Code docs).
  • Paste "the screenshot of the design or the error into the prompt" instead of describing it.
  • Keep CLAUDE.md short; it is read at the start of every session.
  • "Watch the first minute, press Esc the moment Claude drifts, and after two failed corrections run /clear and write a better prompt instead of a third."
  • Ask for a security review before launch; Veracode found flaws in 45% of AI-generated code tasks in 2025 (SD Times).
  • Commit after every working step, so a bad change costs one rollback instead of an afternoon.

What can't each Claude option do?

Every route has limits, and knowing them saves frustration.

  • Claude app with artifacts: great for small tools you share by link, but not a way to publish App Store apps, and not built for large multi-screen products with their own backend and domain.
  • Claude Code: powerful, but it needs a paid plan, and you still have to judge whether its work is right. It writes, runs and fixes code; it does not replace testing with real users or a security review.
  • Claude in Xcode: needs a Mac, Xcode 26 and a qualifying plan, and assumes you know your way around Apple's editor. Best for focused edits, less so for setting up a whole project.
  • Native app builders: handle Swift and App Store prep for you, but only for the platforms they support; Superapp, for example, builds for Apple platforms, not Android.

None of these makes a vibe-coded app automatically safe. Veracode's finding that 45% of AI-generated code tasks introduced security flaws applies whichever tool you use (SD Times).

How do you hand a Claude-built app to a developer?

At some point you may want a professional to review, harden or take over the app. Make that easy:

  1. Keep the code in git from day one, with clear commit messages; Claude can write them.
  2. Keep CLAUDE.md current, so the developer sees your rules and decisions.
  3. Ask Claude to write a short README: what the app does, how to run it, and what is unfinished.
  4. Ask Claude to list known issues and shortcuts it took.
  5. Share the repository, not screenshots or pasted snippets.
  6. Agree what the developer should check first: sign-in, data access and payments.

A tidy handoff turns a few hours of developer time into a meaningful review instead of an archaeology project.

How do you set rules Claude can't break?

CLAUDE.md holds guidelines, and Claude may decide a guideline does not apply. For rules with zero exceptions, the docs are direct: "If something has to happen every time, make it a hook, a deny rule, or a managed setting" (Claude Code docs).

Typical vibe coder rules worth enforcing:

  • Never read files with secrets, such as .env.
  • Never edit a protected folder, such as database migrations.
  • Always run the formatter after editing.

You do not have to write hooks yourself. The docs note that a plain request like write a hook that blocks edits to the migrations folder works as a prompt, and /hooks shows the result. Keep hooks for true never-rules; preferences like naming style belong in CLAUDE.md.

How do teams vibe code with Claude?

Once more than one person touches the project, Claude Code can plug into the team's workflow (Claude Code docs):

  • Pull requests: Claude creates branches and opens pull requests, so changes get reviewed before they land.
  • Automated review: GitHub Actions or GitLab CI/CD can run Claude for code review and issue triage.
  • Slack: mention Claude with a bug report and get a pull request back.
  • Shared instructions: a CLAUDE.md committed to the repo gives everyone's sessions the same rules.

For a founder working with a freelancer, this is the cleanest handoff: you vibe code in a branch, the developer reviews the pull request, and nothing reaches users unreviewed.

What mistakes do people make when vibe coding with Claude?

  • Asking for the whole app in one prompt instead of planning first.
  • Letting one session run for hours across unrelated tasks.
  • Stacking a third and fourth correction instead of starting fresh.
  • Writing a huge CLAUDE.md that buries the rules that matter.
  • Accepting "done" without evidence.
  • Pasting API keys or passwords into prompts.
  • Shipping sign-in or payments without a human review.

How do you check a Claude-built app before launch?

  • The core action works on a real device or browser, not only in a preview.
  • Two test accounts cannot see each other's data.
  • No secrets sit in the code; keys live in environment settings.
  • Payments go through an established provider.
  • You asked Claude for a security review and fixed what it found.
  • Empty, offline and bad-input states behave sensibly.
  • The last working version is committed.
  • Anything with accounts, payments or personal data has had a developer's review.

Who should use which Claude workflow?

Who you are Start with Then
Non-coder with an iPhone app idea Superapp's web version Add Claude Code on the Mac version when you want more control
Curious beginner Claude app artifacts Claude Code in the desktop app or browser
Founder building an MVP Claude Code with a plan-first routine A developer review before real users
Developer new to AI Claude Code in your terminal or editor CLAUDE.md, hooks and your usual tests
iOS developer Claude in Xcode 26 Claude Code for multi-file changes

How do you learn Claude Code for free?

Anthropic's docs point to free self-paced courses at Claude Academy, including Claude Code 101 and Claude Code in Action (Claude Code docs). Pair a course with one small project of your own; the habits stick faster when you hit real errors. For a tool-agnostic walkthrough, see how to vibe code.

Frequently Asked Questions

How do I vibe code with Claude?
Describe a small app in the Claude app to get a shareable artifact, or install Claude Code on a paid plan, run it in a project folder, describe what you want, and refine one prompt at a time.

Is Claude good for vibe coding?
Yes. Claude builds working artifacts from a description in chat, and Claude Code can write, run and fix full projects. Karpathy's original vibe coding post credited a Claude Sonnet model.

Can I vibe code with Claude for free?
Partly. Artifacts in the Claude app are on the Free plan; Claude Code needs a paid plan, from $20 a month.

Is Claude Code vibe coding?
It is vibe coding if you accept changes without review. Used with planning, diff review and tests, it is closer to agentic engineering.

Do I need to know how to code to use Claude Code?
No, but you need to be comfortable running a few commands, or you can use the desktop app or claude.ai/code instead of a terminal.

Can Claude build an iPhone app?
Yes. Claude Code can write a Swift project you build in Xcode, Claude works inside Xcode 26, and native app builders can generate the app for you.

What is the difference between Claude and Claude Code?
Claude is the chat assistant, where you can build artifacts. Claude Code is an agentic coding tool that works on real project files, runs commands and uses git.

How much does Claude Code cost?
It is included in all paid Claude plans; Pro is $20 a month or $17 a month billed yearly, and Max starts at $100 a month.

Can I use Claude Code without a terminal?
Yes. Use the Code tab in the Claude desktop app or claude.ai/code in a browser; both run the same Claude Code engine on a paid plan.

How do I install Claude Code?
On macOS, Linux or WSL run curl -fsSL https://claude.ai/install.sh | bash, open a new terminal, go to your project folder and run claude. Windows has PowerShell and CMD installers.

What is CLAUDE.md?
A markdown file in your project that Claude Code reads at the start of every session. Keep it short: what the app is, rules it must follow, and how to check work.

Can I share an app I built in the Claude app?
Yes. Artifacts can be shared so anyone can view them; viewers can sign in to a Claude account on any plan for the full experience.

What can I build with Claude artifacts?
Small interactive apps, tools and games, such as flashcards, quizzes, calculators and personal trackers. They are not App Store apps.

Can I use Claude in Xcode?
Yes. Since September 2025 you can connect a Claude account to Xcode 26 and use Claude as a coding assistant, on Pro and Max plans or premium Team and Enterprise seats.

Do I need a Mac to build an iPhone app with Claude?
To build and run in Xcode, yes. A browser-based native app builder can generate the Swift app and prepare App Store submission without a Mac.

Can I use Claude Code with Superapp?
Yes, on Superapp's Mac version, which many users pair with Claude Code and Xcode. The web version works without a Mac.

What should I do when Claude Code gets stuck?
Stop after two failed corrections, run /clear, and write one new prompt with the goal, the current state and the exact error. Roll back with git if needed.

Is Claude better than ChatGPT for vibe coding?
It depends on the task and changes often. Claude's strength is Claude Code, which works on real project files and runs commands; try both on a small project before committing.

Can Claude Code use git?
Yes. It can stage changes, write commit messages, create branches and open pull requests, which makes rolling back easy.

How do I keep a Claude-built app secure?
Keep secrets out of code, test with two accounts, use an established payment provider, ask Claude for a security review, and get a developer to check anything sensitive.

What can Claude artifacts do in 2026?
They can be interactive, AI-powered apps, tools and games you share with a link. An October 2025 update added MCP connections and persistent storage.

Can Claude build a game?
Yes. Simple browser games work well as artifacts, and Claude Code can build a fuller game project. Casual 2D games are realistic; complex 3D games need a game engine.

What is the best way to vibe code an iPhone app with Claude?
For non-coders, a native app builder handles Swift and App Store prep. For more control, use Claude Code with Xcode, or Superapp's Mac version alongside Claude Code.

What is Claude in Xcode good for?
Targeted work inside Apple's editor: asking questions about your code, generating documentation, explaining code, creating SwiftUI previews and playgrounds, and inline edits.

Can I use Claude Code in VS Code or Cursor?
Yes. There is a Claude Code extension for VS Code and Cursor, and a plugin for JetBrains IDEs.

How do I stop Claude Code from touching certain files?
Use a hook or deny rule for hard limits, such as never reading .env files. You can ask Claude to write the hook for you, then check it with /hooks.

What are Claude Code skills?
Packaged, repeatable workflows you or your team can run, such as a custom review or deploy routine.

What is MCP in Claude Code?
The Model Context Protocol, an open standard that lets Claude connect to other tools, such as design docs, ticket trackers or chat.

Can a team use Claude Code together?
Yes. Commit a shared CLAUDE.md, have Claude open pull requests for review, and optionally run Claude in GitHub Actions or GitLab CI/CD for code review.

How do I explain errors to Claude?
Paste the full error, say what you did just before, ask for the cause before the fix, use screenshots for visual problems, and ask to see it working afterwards.

Should I start with artifacts or Claude Code?
Start with artifacts for small tools and quick ideas. Move to Claude Code when you need several screens, stored data, sign-in, a domain or version control.

What does /clear do in Claude Code?
It starts a fresh context between unrelated tasks, so old history does not confuse the next task or keep using your plan.

How long does it take to build an app with Claude?
A small artifact takes one sitting; a first multi-screen Claude Code project takes a day or a few evenings. Apps for real users need extra time for testing, security review and store submission.

What should my first prompt to Claude include?
Who the app is for, the problem, the screens, the one core action, data privacy rules, style, what is out of scope, and a request to ask questions before starting.

Can Claude fix bugs in an app someone else built?
Yes. Ask Claude Code to explain the project first, find the cause of the bug before fixing it, make the smallest change, and prove it with a test.

How do I hand a Claude-built app to a developer?
Keep it in git with clear commits, keep CLAUDE.md current, have Claude write a README and a list of known issues, and share the repository.

What can't Claude artifacts do?
They are not App Store apps and are not built for large products with their own backend and domain. For those, use Claude Code or a native app builder.

Is Claude Code safe to use on my computer?
It runs commands and edits files, so work in a project folder, keep secrets out of reach with hooks or deny rules, review what it changes, and commit often so you can roll back.

References

Keep reading

Build iOS apps with AI

Turn your ideas into production-ready iOS apps. Fast and easy.

Get started