Vibe Coding for Doctors

Build Real Medical Tools Without Learning Syntax With Claude Code

What is Claude Code?

Claude Code is a command-line tool that lets you delegate coding tasks to Claude directly from your terminal. Instead of manually writing code, debugging syntax, and managing Git workflows, you simply describe what you want in plain English.

The Magic: You say "create a patient feedback form and deploy it to GitHub" — Claude handles the HTML, CSS, Git commits, repository creation, and deployment. All automatically. This workflow shows Anya's journey from complete beginner to having a live project on GitHub, without writing a single line of code or memorizing Git commands.

🔧 Before You Start: Setup & Prerequisites

Let's make sure you have everything needed to use Claude Code effectively. Don't worry—this is a one-time setup!

❓ 10 FAQs for Doctors Who Want to Vibe Code

Real questions from physicians learning to build with Claude Code:

1. "I barely know how to use Excel. Can I really code?"

Yes! That's the whole point of vibe coding. You describe what you want ("create a patient intake form"), and Claude writes the code. You approve changes without understanding every line. Think of it like ordering from a menu—you don't need to know how to cook to enjoy the meal.

2. "What medical tools can I actually build?"

Plenty! Patient feedback forms, appointment schedulers, symptom checkers, medication trackers, clinical calculators (BMI, eGFR, MELD score), consent form generators, staff scheduling tools, or simple educational sites for patients. Start small—a single-page tool—then expand.

3. "How much time does this take? I'm already overworked."

Your first tool takes 30-60 minutes (including setup). After that, simple projects take 10-20 minutes. The beauty: Claude works at conversation speed. No YouTube tutorials, no Stack Overflow rabbit holes. Say what you want, approve the code, done.

4. "Is this secure enough for patient data?"

Important: The tools you build with this guide are for learning and internal use, not for storing real PHI. For HIPAA-compliant apps, you'd need proper hosting, encryption, and BAAs. Use Claude Code to prototype ideas and build non-PHI tools (like calculators or educational content).

5. "What if Claude makes a mistake in the code?"

You always approve changes before they happen. If something breaks, use git checkout . to undo. Test everything in a browser before deploying. Claude is smart but not perfect—treat it like a very competent resident: trust but verify.

6. "Do I need to learn 'real' programming eventually?"

Not necessarily! Vibe coding is a valid end state. But if you get curious, Claude teaches as it works—you'll naturally absorb HTML, CSS, and JavaScript concepts. Many doctors end up learning by osmosis. No pressure either way.

7. "Can I collaborate with other doctors on projects?"

Absolutely! Once your project is on GitHub, invite collaborators. They can fork your repo, suggest changes via pull requests, or you can give them direct access. Claude Code makes team coding accessible—no complex Git workflows to master first.

8. "What's the monthly cost?"

Claude Pro is $20/month (required for Claude Code CLI). GitHub is free for public repos. Node.js is free. That's it—$20/month total. No hidden enterprise pricing. Cancel anytime.

9. "I built something useful. Can I share it publicly?"

Yes! GitHub makes your code public by default (you can make it private). Add a README explaining what it does and how to use it. Other doctors can discover and use your tools. Open-source medical tools are valuable—you might help thousands of clinicians.

10. "What's the first project I should build?"

Start with a clinical calculator you use regularly. BMI calculator, Framingham Risk Score, CURB-65, or Wells' Criteria. It's practical, you understand the logic, and you'll immediately see value. Then expand to forms, schedulers, or patient education sites.

🎉 Ready to Build Your First Tool?

Scroll back up and follow Node 1. In 30 minutes, you'll have a working project on GitHub.

Start Building → Or Level Up with Mastery System

✅ 1. Install Node.js

Required for running Claude Code CLI

  1. Visit nodejs.org
  2. Download the LTS version
  3. Run installer and follow prompts
  4. Verify: Open terminal, type node --version

✅ 2. Install Claude Code CLI

The terminal interface to Claude

npm install -g @anthropic-ai/claude-code

Verify installation: claude --version

✅ 3. Set Up GitHub Account

For saving and sharing your projects

  1. Create account at github.com
  2. Install GitHub CLI: gh auth login
  3. Follow authentication prompts

💡 4. Quick Test

Verify everything works!

claude --version gh --version node --version

All three should return version numbers.

⚠️ Important Note

You'll need a Claude Pro subscription to use Claude Code. Visit claude.ai/upgrade to subscribe.

📂 How Claude Understands Your Project

One of the most powerful features of Claude Code is its ability to understand your entire project context. Here's how it works:

📁 Your Files index.html style.css CLAUDE.md README.md READS 🤖 Claude Reads rules Scans structure Understands context CREATES ✅ Output Context-aware Follows rules Smart changes ✨

Claude automatically scans your project when you run a command—no manual file selection needed!

🔍 The Automatic Scanning Process

  1. Step 1 - CLAUDE.md First: Reads your project rules file to understand coding standards and preferences
  2. Step 2 - Directory Scan: Examines your project structure to see what files exist and how they're organized
  3. Step 3 - Context Analysis: When you make a request, Claude reads related files (e.g., "style the form" → looks for HTML/CSS)
  4. Step 4 - Transparent Proposal: Shows you exactly which files it will modify before making any changes

💡 Key Insight: You're Always in Control

Claude can't modify files without your approval. The workflow is:

1. You: "Add a login form" 2. Claude: Scans project → "I'll modify index.html and style.css" 3. Claude: Shows you the proposed changes 4. You: Type 'y' to approve or 'n' to reject 5. Claude: Makes the changes only after approval

Interactive Workflow

Click on any step to see detailed explanations below.

Anya Asks
Describe Goal "Create patient feedback tool"
👇 Claude Acts

Claude Creates
index.html
with form & textarea

Anya Asks
Style It "Make it look professional"
👇 Claude Acts

Claude Styles
Generates CSS
Inter font, Blue button

Anya Asks
Save to GitHub "Push to my GitHub account"
👇 Claude Acts

Claude Ships
Git init, commit
Creates repo, Pushes code

Anya's Role
Claude's Role
Action Step

Detailed Breakdown: Each Step Explained

Here's the complete journey from Anya's perspective, showing exactly what happens at each stage:

1 Node 1 — Describe goal, not syntax

Anya's Request:

"Create a new project for a patient feedback tool. Make a single HTML page called index.html with a form. The form should have a textarea for feedback and a submit button."

Claude's Action: Creates folder + index.html with a functional form that is immediately viewable in a browser.

Generated Code:

<!-- index.html --> <form action="#" method="post"> <textarea name="feedback" required placeholder="Enter your feedback..."></textarea> <button type="submit">Submit Feedback</button> </form>

What you learned: HTML form basics; minimum viable UI patterns. Form elements work without needing to remember syntax.

Fallback tips: If file not found, check your working directory with pwd and list contents with ls -la.

Why this matters:

  • No need to memorize HTML tags or attributes
  • Focus on the goal, not the implementation details
  • From idea to working prototype in seconds
  • Perfect for non-technical founders and designers

2 Node 2 — Style it professionally

Anya's Request:

"Style the page. Center the form, use a clean font like 'Inter', and make the submit button blue with white text."

Claude's Action: Generates style.css, links it to the HTML file, and applies a centered layout with professional button styling.

Generated CSS:

/* style.css */ body { font-family: 'Inter', sans-serif; display: flex; justify-content: center; align-items: center; min-height: 100vh; } button { background: #3b82f6; color: white; padding: 12px 24px; border-radius: 8px; border: none; cursor: pointer; }

What you learned: External CSS linking, typography choices, modern layout techniques like Flexbox.

Fallback tips: If styles don't apply, verify <link rel="stylesheet" href="style.css"> is in the HTML <head> and hard refresh the browser cache (Ctrl+Shift+R).

Why this matters:

  • Professional design without CSS expertise
  • Modern UI patterns applied automatically
  • Consistent color schemes and typography
  • Responsive design principles included

3 Node 3 — Save to GitHub without friction

Anya's Request:

"This looks good. Save all my work and create a new project on my GitHub account called 'patient-feedback-tool'. Push all the files there."

Claude's Action: Executes the complete Git workflow and GitHub repository creation automatically.

Commands Executed:

git init git add . git commit -m "Initial commit: Create patient feedback form" gh repo create patient-feedback-tool --public git remote add origin https://github.com/username/patient-feedback-tool.git git push -u origin main

What you learned: Git basics (init, add, commit, push), remote repository creation, and conventional commit messages.

Fallback tips: If authentication fails, run gh auth login or set up a Personal Access Token. Test SSH connection with ssh -T git@github.com.

Why this matters:

  • From local files to deployed project instantly
  • No Git commands to memorize or mess up
  • Professional commit messages with context
  • Ready for collaboration and portfolio showcasing

⚠️ Troubleshooting Guide: What Can Go Wrong

Even the best developers encounter issues. Here's how to solve the most common problems:

❌ "Command not found: claude"

Problem: Claude Code CLI isn't installed or not in PATH

Fix:

npm install -g @anthropic-ai/claude-code claude --version # Test installation

❌ "Authentication failed"

Problem: GitHub credentials not set up

Fix:

gh auth login # Follow prompts # OR set up Personal Access Token at: # Settings → Developer → Personal Access Tokens

❌ "Repository already exists"

Problem: GitHub repo name is taken

Fix:

  • Choose a different repo name
  • Delete the existing repo on GitHub first
  • Or push to existing: git remote add origin ...

❌ Claude ignores CLAUDE.md

Problem: File not in project root or improperly formatted

Fix:

ls -la # Check CLAUDE.md exists pwd # Verify you're in project root # Ensure file is named exactly: CLAUDE.md

❌ Changes not showing in browser

Problem: Browser cache serving old files

Fix:

  • Windows: Ctrl + Shift + R
  • Mac: Cmd + Shift + R
  • Or: DevTools → Network → Disable cache

❌ "Permission denied" errors

Problem: File/folder permissions issue

Fix:

# Check permissions ls -la # Fix with (use carefully): sudo chmod -R 755 your-project-folder

🆘 Still Stuck? Follow This Debug Process

  1. Read error messages carefully — They usually tell you exactly what's wrong
  2. Check your location: Run pwd to verify you're in the right directory
  3. Verify files exist: Use ls -la to see all files including hidden ones
  4. Enable verbose mode: Try claude --verbose "your command" for detailed output
  5. Check documentation: Visit docs.claude.com/claude-code
  6. GitHub issues: Search for your error at github.com/anthropics/claude-code

Complete Prompt Library - 30 Examples

Copy these prompts to master every aspect of the Claude Code workflow. Organized by the 6 key workflow steps:

🎯 Step 1: Describe Goals (5 prompts)

Create a modern landing page for a SaaS product with hero section, features grid, pricing table, and contact form.
Build a task management app with drag-and-drop functionality, local storage, and dark mode toggle.
Make a portfolio website showcasing my projects with image gallery, resume download, and contact integration.
Create an e-commerce product page with image carousel, size selector, add to cart, and customer reviews section.
Build a weather dashboard that shows current conditions, 5-day forecast, and location search with API integration.

📖 Step 2: Claude Reads Context (5 prompts)

Before starting, analyze my existing codebase structure and identify the current tech stack and coding patterns.
Read my CLAUDE.md file and follow the established naming conventions and folder structure rules.
Examine my package.json dependencies and use compatible versions for any new packages you add.
Review my existing CSS variables and maintain consistent design tokens throughout the new components.
Check my current API endpoints and authentication patterns before integrating new backend calls.

🛠️ Step 3: Claude Modifies Files (5 prompts)

Refactor this component to use React hooks instead of class components while maintaining all functionality.
Add TypeScript types to all existing JavaScript files and fix any type errors that arise.
Optimize this code for performance by implementing lazy loading and reducing bundle size.
Add comprehensive error handling and loading states to all API calls in the application.
Implement accessibility improvements including ARIA labels, keyboard navigation, and screen reader support.

💾 Step 4: Claude Commits Changes (5 prompts)

Stage all changes and create a conventional commit message following the format: type(scope): description.
Commit these UI changes with a detailed message explaining what was modified and why.
Create separate commits for each feature added, with clear descriptions of functionality and impact.
Write a commit message that includes the problem solved, solution implemented, and how to test the changes.
Summarize the staged diff and explain the before/after behavior in the commit description.

🚀 Step 5: Claude Opens Pull Request (5 prompts)

Create a new branch, push changes, and open a pull request with detailed description and screenshots.
Open a PR with checklist of completed tasks, testing instructions, and deployment notes.
Push to feature branch and create pull request with before/after comparisons and breaking change warnings.
Generate a PR with links to related issues, performance impact analysis, and reviewer assignment.
Create pull request with automatic labels, milestone assignment, and integration with project management tools.

✅ Step 6: Review & Merge (5 prompts)

Review the pull request changes and provide suggestions for code improvements or optimizations.
Run all tests, check code coverage, and verify the build passes before approving the merge.
Merge this PR using squash and merge strategy, then delete the feature branch automatically.
After merging, tag this release and update the changelog with all new features and bug fixes.
Deploy the merged changes to staging environment and run smoke tests to verify everything works.