Summary of "CLAUDE CODE FULL COURSE 4 HOURS: Build & Sell (2026)"
Course overview
A practical, hands-on Claude Code (Anthropic) tutorial for beginners through intermediate users, focused on building deployable projects (websites, full‑stack apps, automation workflows). Emphasis is on installing Claude Code, integrating with IDEs (VS Code, Anti-Gravity), creating a project brain (Claude.md), organizing a .claude workspace (agents, skills, rules), using plan mode and permission modes, working with subagents/agent teams, leveraging MCP tools, managing context/tokens, and deploying (Netlify, Modal, Git worktrees).
Several full examples are shown, including:
- Iterative website build from a reference screenshot
- Live proposal-generator full‑stack app (Supabase + Stripe + Netlify)
- Automated lead scraping and email labeling
- Creating hosted API endpoints (Modal)
Practical setup and UI
Account & installation
- Claude Code requires a paid Anthropic plan (Pro+).
- Install via curl in the terminal or use the GUI extension for IDEs.
Two common IDE workflows
- Visual Studio Code: install the Anthropic / Claude Code extension; UI includes file explorer, editor, and agent panel.
- Anti-Gravity: similar layout (file tree / editor / agent), used as the primary environment in the course.
Terminal vs GUI:
- Terminal unlocks extra features (status line, faster workflows, parallel sessions).
- GUI is more beginner-friendly.
Core project configuration and files
Claude.md — the project brain
- Injected at the start of every session (global, per-workspace, enterprise precedence).
- Use it to steer behavior with concise rules and important guardrails at the top.
- Do not overload Claude.md with entire API docs—extract only what you need.
.claude workspace folder (workspace-level)
Contains advanced configuration:
- settings.json / settings.local.json — hooks, permissions, local-only secrets
- agents/ subfolders — subagent specs
- skills/ subfolder — skill files
- rules/ subfolder — split Claude.md into modular rules
- memory.md — auto memory; small scratchpad persisted across sessions
Home-level (~/.claude)
- Global Claude.md and settings that apply across projects.
Tip: use /init to auto-generate an initial Claude.md for a repo.
Modes and permissions
Permission modes (accessible in GUI bottom-left or via /permissions):
- Ask before edits — prompts before editing local files (default; safest).
- Edit automatically — edits existing files without asking; still prompts for new files.
- Plan mode — read-only research and specification phase before executing; high leverage for complex builds.
- Bypass permissions (dangerous) — Claude can create/delete files and run commands without prompting (must be enabled in extension settings).
Best practice:
- Use Plan Mode to avoid rework.
- Keep risky operations monitored.
- Enable bypass only in trusted sandboxes or when you understand the risks.
Warning: bypass permissions can run destructive shell commands. Don’t enable on untrusted machines or public repos.
Building & design workflows
Three common approaches:
-
Screenshot loop / reference design
- Capture a full-page screenshot (Chrome DevTools → Capture full-size screenshot), resize to fit token budgets, feed to Claude Code, and iterate via screenshot-compare loops.
- Good for pixel-matching high-quality designs.
-
Voice transcript dump
- Dictate content quickly, summarize with an LLM into high-information prompts, then feed to Claude to generate layout and content.
-
Component-driven
- Use component libraries (e.g., 21st.dev copy-prompt buttons) to supply component specs; paste component prompts into Claude to recreate components.
Automated build example: proposal generator app
Typical workflow:
- Use Plan Mode to draft a technical spec and answer guided questions (framework choice, DB, e-sign/payment).
- Auto-generate project code.
- Run local tests.
- Configure environment (Supabase & Stripe keys).
- Deploy to Netlify and test payments/signatures.
Tech choices demonstrated:
- Frontend: Next + Tailwind
- Auth & DB: Supabase
- Payments: Stripe
- Generation: Anthropic Opus model
- Deployments: Netlify / Modal
Skills — what they are and why use them
- Skills are reusable, documented automations (skill.md + scripts folder), like SOPs implemented as orchestrated tools and scripts.
- Typical structure:
- Front-matter (name, description, allowed tools)
- Checklist/process
- Scripts (Python, bash, etc.)
- Examples: shop-amazon, scrape-leads, literature-research, Upwork-scrape-apply, create-proposals
Benefits:
- Load-on-demand (low token cost until invoked)
- Repeatability
- Easier exposure as APIs/webhooks
Model Context Protocol (MCP) and tools
- MCP servers provide extra tools (e.g., Chrome DevTools MCP) allowing Claude to control browsers, perform clicks, take screenshots, evaluate scripts, etc.
- Install MCP by dropping an MCP server JSON into the workspace and configuring API keys when required.
- Chrome DevTools MCP is particularly valuable for extracting content from non‑API sources.
Caveat:
- Third-party MCPs can be token-heavy and large; select MCPs carefully — they can dominate context/token usage.
Context management, tokens, and slash commands
- Tokens matter: models have fixed context windows (e.g., Claude Opus ~200k tokens at recording). Tools, MCP descriptions, system prompts, memories, and skills all use tokens before your messages count.
- Useful commands:
- /context — show current token usage breakdown
- /compact — compress older conversation history into high-information summaries
- /status-line — set up a status bar in terminal
- /permissions — manage file/tool permissions
- /model — switch models (Opus, Sonnet, Haiku) and adjust thinking tokens
- /init — generate Claude.md for a project
Compaction and cost-saving strategies:
- Keep Claude.md concise; move lengthy SOPs to skills.
- Use cheaper models (Sonnet) for long-research subagents.
- Enable extended thinking for internal reasoning, then produce succinct outputs.
- Run /context often and use /compact (or auto-compaction) to avoid hitting context windows.
- Periodically prune Claude.md and memory.
Subagents and Agent Teams (parallelization)
Subagents
- Spawned child agents with independent context windows that perform focused tasks and return outputs to the main agent.
- Good for heavy research, reviewer agents (clean-slate code reviews), QA/test runners, parallel scraping/classification.
- Cost & complexity: cheaper than full teams but still increase token usage when many run.
- Example: spawn multiple subagents to classify email chunks in parallel, then merge outputs in the parent.
Agent teams
- A lead agent coordinates multiple teammate agents that can message each other and self-coordinate.
- Best for larger collaborative tasks, adversarial debates, or complex orchestration (e.g., security audits).
- Expensive: each teammate is effectively another Claude instance with its own context. Disabled by default and experimental.
- Example: spawn 10 code-scanner agents across a repo, then fixer agents and two “devil’s advocate” agents to debate findings.
Advice:
- Use subagents for focused parallel work.
- Use agent teams only when multi-agent coordination/debate has clear ROI and you can afford the cost.
MCP vs Skills: when to use which
- MCP: fast prototyping and convenient third-party tooling (browser automation, ClickUp, Gmail MCP, etc.), but token-heavy and sometimes slower.
- Skills: convert validated MCP workflows into skills (script + skill.md) for token-efficiency, repeatability, and hostability.
Practical pattern:
- Prototype with MCP.
- Convert the workflow into a skill + scripts.
- Host as an endpoint if needed.
Plugins & marketplaces
- Claude Code has an official plugins directory and community marketplaces for MCP servers and skills.
- Quality varies—vet third-party plugins and MCPs before trusting them.
Git worktrees & parallel development
- Git worktrees provide isolated working trees sharing the same Git history—an alternative to agent teams to avoid agents stepping on the same files.
- Workflow example: create branches/worktrees (about, services, contact), assign separate agents to each worktree, then merge back into main. Reduces merge conflicts and coordination hazards.
Deployment & hosting options
Demonstrated hosting approaches:
- Netlify — static site deployment
- Modal — hosting API endpoints / serverless functions (demo: create a birthday-check endpoint and hosted URL)
- GitHub + Netlify/Modal/CI (GitHub Actions) — recommended for production
Use hosted endpoints/webhooks to expose automations or skills as services (for example, scrape-leads accessible via a small web form returning CSV).
Security and operational cautions
- Don’t expose production-grade services or payment processing via freshly generated apps without manual security review (authentication, rate limits, OAuth/token handling).
- Bypass permissions can run destructive shell commands—do not enable on untrusted machines or public repos.
- Avoid deploying public consumer services without code review and security hardening; there are many examples of cloud-based bots being exploited.
Key slash commands & quick cheat sheet
- /init — generate Claude.md for a project
- /context — inspect token usage & breakdown
- /compact — compact conversation history
- /status-line — set up terminal status line
- /permissions — manage file/tool permissions
- /model — switch models and adjust thinking tokens
- CLI: cloude / login — authenticate and run Claude from terminal
- Extensions: install Anthropic / Claude Code extension in VS Code or Anti-Gravity
Tools, platforms and libraries referenced
- Claude Code / Anthropic (models: Opus, Sonnet, Haiku)
- Visual Studio Code + Anthropic extension
- Anti-Gravity IDE
- godly.website, Dribbble, 21st.dev (design inspiration & component prompts)
- Browser DevTools (full-page screenshot workflow)
- Supabase (auth + DB), Stripe (payments)
- Netlify, Modal (hosting / webhooks / serverless), GitHub, Git worktrees
- Chrome DevTools MCP, MCP servers / MCP marketplace
- ClickUp MCP and ClickUp
- Unsplash, Instantly, make.com / Zapier / n8n
- Google Sheets API, Jupyter Notebooks (mentioned)
- Social sources: Twitter/X for Claude.md tips; Grok for searching posts
Key best practices / rules of thumb
- Spend minutes planning (Plan Mode) before building — planning saves time and tokens.
- Always include a verification loop: Task → Do → Verify (screenshot compare / automated tests).
- Keep Claude.md concise, prioritized, and prune regularly; move SOPs into skills.
- Use subagents for parallelizable, independent work; prefer Sonnet for long-context cheaper jobs.
- Prototype with MCP; convert to skills/scripts to minimize token overhead.
- Run /context often and use /compact (or auto-compaction).
- Be cautious with bypass permissions and production deployments—perform code reviews for security.
Examples & demos included in the course
- Install Claude Code via terminal and GUI
- VS Code + Anthropic extension setup
- Anti-Gravity setup and use
- Build a website via screenshot loop (godly.website reference) using three approaches (reference, voice, components)
- Create a proposal-generator full-stack app (Supabase + Stripe + Anthropic) end-to-end; deploy to Netlify
- Create skills: shop-amazon, scrape-leads (lead scraping → Google Sheets)
- Create MCP examples: Chrome DevTools MCP, ClickUp MCP
- Create a hosted API endpoint via Modal (birthday check)
- Subagent example: email labeling with many parallel classifiers
- Agent teams example: parallel website design, iterative improvement, and large-scale repo security audit using debate/repair agents
- Git worktrees: parallel page development (about/services/contact) and merging strategies
Main speaker and sources
- Primary presenter: Nick (terminal path shows Nick Sariah). He is a business owner and Claude Code power-user/teacher.
- Main technologies/sources: Anthropic (Claude Code), VS Code, Anti-Gravity, Supabase, Stripe, Netlify, Modal, Chrome DevTools MCP, Git/GitHub, design/component marketplaces, MCP server marketplace, and community sources (Twitter/X).
Optional deliverables
- One-page Claude.md starter template (global + local) with recommended rules and sample front-matter for skills/agents.
- Short checklist (commands + settings) you can paste into VS Code / Anti-Gravity to replicate the course environment.
Category
Technology
Share this summary
Is the summary off?
If you think the summary is inaccurate, you can reprocess it with the latest model.
Preparing reprocess...