The Complete Claude

Code Workbook
Simple Tech Skills
Beginner to Advanced

---------------------------------------------

Your hands-on guide to mastering AI-powered development

[Link]
 Simple Tech Skills | [Link]

Table of Contents
Module 0: Introduction​ 3

Module 1: Getting Started​ 5

Module 2: Integrated Development Environments (IDEs)​ 8

Module 3: The [Link] File - Your Project Brain​ 11

Module 4: Building Your First Project​ 14

Module 5: Context Management​ 18

Module 6: Slash Commands - The Complete Guide​ 22

Module 7: Permission Modes​ 26

Module 8: Plan Mode - Advanced Builds​ 29

Module 9: Subagents and Agent Teams​ 33

Module 10: Skills - Custom Automation Scripts​ 37

Module 11: Mtocol (MCP)​ 41

Module 12: Chrome DevTools Integration​ 45

Module 13: Hooks​ 48

Module 14: Scaling and model Context ProDeployment​ 51

Module 15: Advanced Workflows and Real-World Systems​ 55

Module 16: Version Control with Git and GitHub​ 63

Module 17: Building a Full-Stack SaaS App​ 67

Module 18: Content Automation and Social Media​ 72

Module 19: Claude Projects for Non-Coders​ 77

Module 20: Claude Co-Work and Desktop Automation​ 82

Module 21: Your AI Business Stack and ROI​ 87

Final: Call to Action - Join the Academy​ 92

Simple Tech Skills - The Complete Claude Code Workbook | Page 2

 Simple Tech Skills | [Link]

Module 0: Introduction

What Is Claude Code and Why It Matters

We are living through one of the most significant shifts in how software gets built. For decades,
writing code required years of formal training, memorizing syntax, and debugging cryptic error
messages. That barrier kept powerful software-building capabilities locked away from the vast
majority of people who had brilliant ideas but no technical background. Claude Code changes
that equation entirely.
Claude Code is Anthropic's official command-line interface and IDE integration for Claude - their
most capable AI model. Unlike chatting with an AI in a browser window and copy-pasting
responses, Claude Code sits directly inside your development environment. It can read your files,
write new code, run commands, browse the web, manage databases, interact with third-party
services, and orchestrate entire teams of AI agents - all from a single conversation.
The implications of this are profound. A consultant can build the client proposal tool they have
always wanted. A marketer can create a lead-generation pipeline that would have taken a
developer six weeks to build. A small business owner can deploy a customer-facing web app over
a weekend. Claude Code does not replace the need for judgment, creativity, or domain expertise
- it removes the technical bottleneck that previously stood between an idea and its execution.

KEY TAKEAWAY: Claude Code is not a coding assistant you consult - it is a development
partner that lives inside your workflow, capable of taking a vague idea all the way to a
deployed application.

What You Will Learn in This Workbook

This workbook is designed to take you from zero familiarity with Claude Code to confidently
building and deploying real-world applications and automations. You will not just learn what
each feature does - you will practice it, reflect on how it applies to your specific situation, and
leave each module with something tangible you have built.
By the time you complete this workbook you will know how to set up Claude Code in a
professional IDE, manage context windows like an expert, build multi-agent workflows, create
custom skills and MCP integrations, deploy applications to the web, and calculate the genuine
business ROI of AI-assisted development. More importantly, you will have the mental models to
figure out what to do when you encounter something new - because the tools will keep evolving
and your ability to think clearly about them is more valuable than memorizing any specific
command.

How to Use This Workbook Effectively

This workbook is intended to be active, not passive. Resist the temptation to read through it like
a novel. Instead, open Claude Code alongside this workbook and complete each exercise as you

Simple Tech Skills - The Complete Claude Code Workbook | Page 3

 Simple Tech Skills | [Link]

encounter it. The exercises are short by design - most take between 5 and 20 minutes - but the
hands-on repetition is what converts knowledge into skill.
The notes boxes throughout the workbook are not decorative. Use them. Write down what
surprised you, what did not work as expected, the specific use cases that came to mind for your
own projects. These personal annotations will make this workbook far more valuable when you
return to it weeks from now.
Each module builds on the previous one, but they are also designed to stand alone. If you
already have Claude Code installed and want to jump to context management or MCP tools, you
can. The cross-references throughout the workbook will point you back to earlier material when
it is relevant.

The Mindset Shift: AI as Your Productivity Multiplier

The most common mistake people make when they first start using Claude Code is treating it like
a search engine - asking narrow questions and expecting narrow answers. That approach
produces narrow results. The shift you need to make is from 'how do I get Claude to write this
function' to 'how do I describe the outcome I want and let Claude figure out the path to get
there.'
Think of Claude Code as an extremely capable junior developer who never gets tired, never gets
frustrated, has read every programming tutorial ever written, and only needs clear direction
from you. Your job is not to know every technical detail - your job is to have a clear picture of
what you want to build, to give feedback when the result is not quite right, and to make the
higher-level decisions that require your business judgment and domain expertise.
This mindset shift takes practice. You will catch yourself micromanaging Claude, writing overly
prescriptive prompts, or second-guessing outputs before they have had a chance to be tested.
Notice those habits and gently redirect. The more you trust the process - describe the outcome,
test the result, iterate - the faster you will move.

KEY TAKEAWAY: Your job is to be the architect with the vision. Claude Code's job is to be the
builder with the technical skills. The combination is more powerful than either one alone.

WANT TO GO FURTHER? This workbook gives you the full foundation. The Simple Tech Skills
Academy takes you further - with structured video courses, monthly skill templates, and
personal mentorship sessions where you bring your real projects and get direct feedback. Join
at [Link]/academy

Simple Tech Skills - The Complete Claude Code Workbook | Page 4

 Simple Tech Skills | [Link]

Module 1: Getting Started

Choosing the Right Claude Plan

Before you can use Claude Code, you need an Anthropic account and the appropriate
subscription tier. Anthropic offers several plans, each optimized for different usage patterns and
team sizes. Understanding the differences will save you money and frustration.
The Pro plan is the entry point for serious users. It gives you access to Claude's most powerful
models with a generous monthly token limit. For individual learners and small projects, Pro is
usually the right starting point. The Max plan - which comes in 5x and 20x variants - dramatically
increases your rate limits, which matters when you are running long agentic sessions or
processing large codebases. If you find yourself hitting usage caps regularly, upgrading to Max is
a much better investment than slowing down your work.
The Team plan adds collaborative features: shared workspaces, centralized billing, and
organizational controls. If you are building alongside colleagues or managing a small agency,
Team makes billing and access management significantly easier. Enterprise adds SSO, audit logs,
custom data retention policies, and priority support - the features large organizations require
before they will allow AI tools in their infrastructure.

RECOMMENDATION: Start with Pro. Upgrade to Max 5x when you begin running multi-agent
workflows or spending more than two hours per day in Claude Code sessions. The productivity
gains from not hitting rate limits pay for the upgrade within days.

Installing Claude Code

Claude Code is installed as a [Link] package via npm, which means the installation process is
identical across Mac, Windows, and Linux once you have [Link] available. Here is the exact
process for each platform.

Mac
Open Terminal (found in Applications > Utilities or via Spotlight search). If you do not have
[Link] installed, the easiest path is to install it via Homebrew. Run: /bin/bash -c "$(curl -fsSL
[Link] to install Homebrew.
Then run: brew install node. Once Node is installed, run: npm install -g
@anthropic-ai/claude-code. Verify the installation by running: claude --version.

Windows
Download the [Link] installer from [Link] and run it with default settings. Once installed,
open PowerShell or Windows Terminal and run: npm install -g @anthropic-ai/claude-code. If you
encounter permission errors, run PowerShell as Administrator. Verify with: claude --version.
Windows users should also consider installing Windows Subsystem for Linux (WSL2) for a more
seamless experience with shell commands.

Simple Tech Skills - The Complete Claude Code Workbook | Page 5

 Simple Tech Skills | [Link]

Linux
Use your package manager to install [Link]. On Ubuntu/Debian: sudo apt update && sudo apt
install nodejs npm. On Fedora/RHEL: sudo dnf install nodejs. Then: npm install -g
@anthropic-ai/claude-code. Verify with: claude --version.

Terminal Basics for Non-Technical Users

If you have never worked in a terminal before, the blinking cursor in a black window can feel
intimidating. It is not. The terminal is simply a text-based way of telling your computer what to
do. You type a command, press Enter, and the computer responds. That is the entire concept.
The most important commands you need for Claude Code are: cd (change directory - navigate to
a folder), ls on Mac/Linux or dir on Windows (list the contents of the current folder), pwd (print
working directory - see where you are), and mkdir (make a new folder). You will also use npm
(the Node package manager) and claude (the Claude Code command itself). That is essentially
the entire vocabulary you need to get started.

IMPORTANT: The terminal always has a current location - a folder it is working from. When
you type claude, it starts a session in whatever folder you are currently in. This matters
because Claude Code reads and writes files relative to that location.

Your First Claude Code Session

Once Claude Code is installed, open your terminal and navigate to a folder where you want to
work. Type claude and press Enter. Claude Code will prompt you to log in with your Anthropic
account on the first run. After authentication, you will see the Claude Code interface - a prompt
where you can type messages.
Your first conversation does not need to be complicated. Try typing: 'Hello! I am new to Claude
Code. Can you tell me what you can see in this folder and suggest what we could build
together?' Watch how Claude responds - it will list your files, ask clarifying questions, and start
generating ideas. That is the beginning of a working relationship you will develop throughout
this workbook.

Understanding the Interface

Claude Code runs primarily in the terminal, but it also integrates into IDEs like VS Code and
Cursor through extensions (covered in Module 2). The terminal interface gives you the most raw
control and is where advanced features like agent teams and hooks are most naturally used. The
IDE interface gives you a visual file explorer, syntax-highlighted code, and a side-by-side chat
panel - which most people find more comfortable for day-to-day work.
In the terminal interface, you will see a prompt (>) where you type your messages. Above the
prompt, Claude's responses appear. When Claude is taking an action - reading a file, running a
command, writing code - you will see status indicators showing exactly what is happening. This

Simple Tech Skills - The Complete Claude Code Workbook | Page 6

 Simple Tech Skills | [Link]

transparency is intentional: you always know what Claude is doing and can intervene at any
point.

The Status Line

The status line at the bottom of the Claude Code interface shows you at a glance everything you
need to know about your current session. From left to right, you will typically see: the current
model being used, the current permission mode (ask/auto/bypass), the approximate token
count for the current context, and the estimated cost of the session so far.
Keeping an eye on the status line becomes second nature over time. A quickly growing token
count is your cue to consider using /compact or starting a fresh session. A permission mode you
did not expect is your cue to check what changed. The status line is your dashboard - glance at it
regularly.

Permission Modes Overview

Claude Code has several permission modes that control how much autonomy it has to take
actions without asking you first. These are covered in depth in Module 7, but here is the
orientation: in Ask Before Edits mode, Claude asks for your approval before making any file
changes. In Auto mode, it proceeds with edits autonomously but still asks about potentially
dangerous operations. In Bypass/Dangerously Skip Permissions mode, it takes all actions without
asking - powerful but requires care. Start in Ask mode while you are learning.

EXERCISE: Your First Conversation with Claude

1.​ Open your terminal and navigate to a folder you want to work in (or create a new one with
mkdir my-first-project and then cd my-first-project).
2.​ Type claude and press Enter to start a session.
3.​ Introduce yourself: tell Claude what you do professionally and what you hope to build.
4.​ Ask Claude to describe what it can do for you based on your goals.
5.​ Ask Claude to create a simple text file called [Link] with three ideas for projects you could
build together.
6.​ Review the file Claude created and give feedback on one of the ideas.

Simple Tech Skills - The Complete Claude Code Workbook | Page 7

 Simple Tech Skills | [Link]

Module 2: Integrated Development Environments (IDEs)

What Is an IDE?
An Integrated Development Environment - IDE for short - is a software application that combines
everything you need for software development into a single interface. Think of it as a specialized
workspace that brings together a file explorer (so you can see and navigate your project's files), a
text editor (with features like syntax highlighting and auto-completion that make code easier to
read and write), a terminal panel (so you can run commands without switching windows), and
now - increasingly - an AI chat panel.
You do not need to be a programmer to benefit from an IDE. Many non-technical users are
discovering that IDEs are the best place to work with Claude Code because they provide a visual
context for what Claude is doing. When Claude edits a file, you can see the changes highlighted
in the editor. When it suggests a new file structure, you can see it materialize in the file explorer.
The visual feedback loop makes the whole experience more intuitive.

KEY TAKEAWAY: An IDE is not just for developers. It is the best interface for working with
Claude Code on any project that involves files - websites, documents, data pipelines,
automation scripts, or full-stack applications.

VS Code: Installation and Setup

Visual Studio Code (VS Code) is Microsoft's free, open-source code editor. It is the most widely
used IDE in the world, with an enormous ecosystem of extensions and excellent documentation.
For Claude Code users, VS Code is the safer, more stable choice - particularly if you are new to
IDEs.
To install VS Code: visit [Link] and download the installer for your operating
system. Run the installer with default settings. On Mac, drag the VS Code app to your
Applications folder. On Windows, the installer handles everything automatically. Once installed,
open VS Code and take a moment to familiarize yourself with the layout: the Activity Bar on the
far left (icons for file explorer, search, source control, extensions), the Side Bar that opens when
you click those icons, the Editor Area in the center, and the Terminal Panel at the bottom.

Cursor: Installation and Setup

Cursor is an AI-native IDE built on top of VS Code. It includes built-in AI features and is
increasingly popular among Claude Code power users because it was designed from the ground
up with AI-assisted development in mind. If VS Code is the reliable workhorse, Cursor is the
purpose-built AI development machine.
To install Cursor: visit [Link] and download the installer. Cursor looks and feels almost
identical to VS Code - the same keyboard shortcuts, the same file explorer, the same terminal
panel - with additional AI features layered on top. If you already know VS Code, you will feel at

Simple Tech Skills - The Complete Claude Code Workbook | Page 8

 Simple Tech Skills | [Link]

home in Cursor immediately. Cursor has its own AI features that work alongside Claude Code,
giving you multiple layers of AI assistance.

Installing the Claude Code Extension

Both VS Code and Cursor support the Claude Code extension, which embeds a Claude Code chat
panel directly inside the IDE. To install it: open VS Code or Cursor, click the Extensions icon in the
Activity Bar (or press Ctrl+Shift+X on Windows or Cmd+Shift+X on Mac), search for 'Claude
Code', and click Install. Once installed, you will see a new Claude icon in the Activity Bar.
Click the Claude icon to open the chat panel. If you are already authenticated from your terminal
session, the extension will use the same credentials automatically. If not, it will prompt you to
log in. Once authenticated, you have a fully functional Claude Code session living inside your IDE
- you can chat with Claude while looking at your code, and Claude can see and edit the files you
have open.

Navigating the IDE Interface

The most important keyboard shortcuts to learn immediately are: Ctrl+` or Cmd+` on Mac to
toggle the terminal panel, Ctrl+Shift+E or Cmd+Shift+E to open the file explorer, Ctrl+P or Cmd+P
to quickly open any file by name, and Ctrl+Shift+P or Cmd+Shift+P to open the Command Palette
- a search bar for every VS Code command.
When Claude Code is running in the IDE and makes changes to files, the modified files appear
with a dot indicator in the file explorer and the changed lines are highlighted in the editor with
colored gutters (green for additions, red for deletions, yellow for modifications). This visual diff
makes it very easy to review what Claude has done before you accept the changes.

When to Use Terminal vs IDE

The honest answer is: use whichever you are more comfortable with, because Claude Code
works identically in both environments. That said, there are scenarios where one is clearly better
than the other.
Use the terminal when you are running advanced agentic workflows, using hooks (Module 13),
managing subagents (Module 9), or doing anything that requires precise control over the Claude
process itself. The terminal gives you full access to all Claude Code features with no abstraction
layer between you and the tool.
Use the IDE when you are actively editing code, building visual interfaces, working on a codebase
with many files, or when you want the visual feedback of seeing file changes in real time. The
IDE is also better for onboarding new team members who may be less comfortable with
terminal-only workflows.

EXERCISE: Open a Project Folder and Chat with Claude in Your IDE

7.​ Install VS Code or Cursor if you have not already.

8.​ Install the Claude Code extension from the Extensions marketplace.

Simple Tech Skills - The Complete Claude Code Workbook | Page 9

 Simple Tech Skills | [Link]

9.​ Open a folder using File > Open Folder. If you do not have a project folder yet, create a new
empty folder and open it.
10.​Open the Claude Code panel and type: 'I have just opened this folder. Please analyze what is
here and give me a brief overview of what this project contains or suggest what we could
create here.'
11.​Ask Claude to create a simple [Link] file with a heading and a paragraph.
12.​Watch the file appear in the file explorer and open it in the editor. Review the diff
highlighting.

Simple Tech Skills - The Complete Claude Code Workbook | Page 10

 Simple Tech Skills | [Link]

Module 3: The [Link] File - Your Project Brain

What Is the [Link] File?

One of the most powerful and underused features of Claude Code is the [Link] file. At its
core, it is a plain text file written in Markdown format that Claude Code automatically reads at
the start of every session in that directory. Think of it as a persistent briefing document - a set of
standing instructions that you never have to repeat because they are always there when Claude
needs them.
Without a [Link] file, every new Claude Code session starts from zero. Claude does not
know what your project is trying to accomplish, what coding conventions you prefer, what
technologies are already in use, or what decisions you have already made. You end up spending
the first several minutes of every session re-establishing context. With a well-written
[Link], Claude walks into every session fully briefed.

KEY TAKEAWAY: The [Link] file is the single highest-leverage thing you can do to
improve the quality and consistency of Claude's output on any project. Invest time in writing it
well.

How It Acts as a System Prompt

Technically, the [Link] file is injected into the system prompt before every conversation.
This means it occupies token space in your context window (see Module 5), so you want it to be
dense with useful information rather than padded with unnecessary prose. But it also means
that everything you put in [Link] is treated with the same authority as direct instructions -
Claude will consistently follow it unless you explicitly override it in conversation.
This mechanism is how experienced Claude Code users achieve remarkably consistent results
across long projects. They write their [Link] at the start of a project to capture all the key
decisions, and then they update it as the project evolves. The file becomes a living record of the
project's architecture, conventions, and ongoing context.

Global vs Local [Link]

Claude Code supports two types of [Link] files. A local [Link] lives inside your project
folder and contains project-specific instructions. A global [Link] lives in your home
directory (~/.claude/[Link]) and is injected into every Claude Code session regardless of
which project you are in.
Use the global [Link] for your personal preferences that apply everywhere: your name,
your communication style preferences, your general coding conventions, the programming
languages you use most often, and any standing instructions you always want Claude to follow.
Use the local [Link] for everything project-specific: the tech stack, the project goals, the
file structure, any APIs or services in use, and the current state of the project.

Simple Tech Skills - The Complete Claude Code Workbook | Page 11

 Simple Tech Skills | [Link]

What to Include in Your [Link]

A high-quality [Link] typically includes several categories of information. First, project
identity: what is this project, who is it for, and what problem does it solve? This one paragraph of
context transforms Claude's ability to make sensible decisions about edge cases. Second, the
tech stack: every technology, framework, and library in use. Third, conventions: how files should
be named, how functions should be documented, what style guide to follow.
Fourth, current status: where is the project in its development, what was just completed, what is
being worked on now, what is blocked? This is the section you update most frequently. Fifth,
known constraints: things Claude should not change (a legacy API format that cannot be broken,
a library version that cannot be upgraded due to compatibility, a design decision that was made
deliberately). Sixth, commands: the specific terminal commands needed to run, test, or build the
project.

PRO TIP: Keep your [Link] under 500 lines. Beyond that, you are burning context tokens
on content that may not be relevant to the current task. Use clear headings so Claude can find
the relevant section quickly, and ruthlessly remove information that is no longer accurate.

The Ship-Steering Metaphor

A useful way to think about the [Link] file is as a ship's navigation chart. When a ship
leaves port, the captain does not re-explain the destination at every decision point. The
destination is charted, the route is plotted, and the crew makes every micro-decision in the
context of that larger plan. The [Link] is your navigation chart - it keeps every conversation
pointed toward the same destination without requiring you to re-establish direction constantly.
When Claude starts drifting - making suggestions that contradict your architecture, proposing
solutions in the wrong technology, or losing track of the project's core constraints - the answer is
almost always to update the [Link]. Add a new section clarifying the decision that keeps
getting missed. The file steers the ship.

[Link] and Its Role

In addition to [Link], some workflows use a [Link] file (or similarly named file) as a
running log of important context. While [Link] captures stable project information,
[Link] captures ephemeral context: decisions made in recent sessions, temporary
constraints, work-in-progress notes that are not yet stable enough to bake into the main project
documentation.
The /memory command in Claude Code allows you to instruct Claude to save important
information from a conversation to a memory file automatically. This creates a feedback loop
where valuable insights from your work sessions are preserved and made available to future
sessions, gradually building up a richer and more useful context base.

EXERCISE: Create Your First [Link] for a Project

Simple Tech Skills - The Complete Claude Code Workbook | Page 12

 Simple Tech Skills | [Link]

13.​Navigate to a project folder you are actively working on (or create a new one for a project
you have in mind).
14.​Start a Claude Code session and type: 'Help me create a [Link] file for this project. I will
describe what we are building and you draft the file.'
15.​Describe your project: what it does, who it is for, what technologies you are using or want to
use.
16.​Review the [Link] Claude drafts and refine it - add sections Claude missed, remove
anything that is not accurate.
17.​Start a new Claude Code session in the same folder and notice how Claude already knows
your project context.
18.​Write in the notes box below: what three pieces of information will always be in your
[Link] for every project?

Simple Tech Skills - The Complete Claude Code Workbook | Page 13

 Simple Tech Skills | [Link]

Module 4: Building Your First Project

The Three Approaches to Web Design with Claude Code

When you ask Claude Code to build a website or web application, there are three distinct
approaches you can take. Each has its own strengths and is best suited to different situations.
Understanding these approaches before you start will save you significant time and produce
better results.

Approach 1: Screenshot Comparison Iteration

The screenshot approach starts with a visual reference - a website or design that captures the
look and feel you want. You take a screenshot of the reference, share it with Claude (by dragging
it into the chat or referencing the file path), and ask Claude to build something that matches or is
inspired by it. Claude analyzes the visual design and generates the code to replicate it.
After Claude generates the initial version, you open it in a browser, take a screenshot of your
version, and share both screenshots with Claude - the original reference and your current
version. Ask Claude to identify the differences and fix them. This iterative visual comparison loop
is remarkably effective because it gives Claude a precise, visual specification of what done looks
like rather than trying to describe it in words.

Approach 2: Prompt-Only Generation

The prompt-only approach describes what you want entirely in text. This works best when you
have a clear functional specification but are flexible about the visual design, or when you are
building something functional (a form, a data table, an API endpoint) where visual design is
secondary to behavior.
For effective prompt-only generation, be specific about the user experience you want: what the
user sees first, what they click on, what happens after each action. Describe the data involved -
what information is being captured, displayed, or processed. Describe any constraints: it needs
to work on mobile, it needs to match these brand colors, it should not require a backend.

Approach 3: Hybrid Approach

The hybrid approach combines a visual reference with detailed functional requirements. This is
the most powerful approach for building complete, production-ready applications. You provide
the visual target (via screenshot or URL reference), describe the specific functionality you need,
and let Claude synthesize both into a working application.
In practice, the hybrid approach looks like this: 'Here is a screenshot of the design style I want.
Build a lead capture page with this visual style that collects name, email, company, and a
message. When submitted, it should send an email notification and display a thank-you
message. It should be fully responsive and load in under 2 seconds.'

KEY TAKEAWAY: The screenshot iteration approach is the fastest path from zero to a visually
polished result. The hybrid approach produces the most complete, production-ready output.
Start with screenshots and add functional requirements as you go.

Simple Tech Skills - The Complete Claude Code Workbook | Page 14

 Simple Tech Skills | [Link]

Using an Inspiration Website as Reference

Finding inspiration websites is easy - they are everywhere. Product Hunt, Dribbble, and
Awwwards all showcase excellent web design. When you find a design you like, you do not copy
it - you use it as a visual starting point for your own work. Claude will use the design language
(spacing, typography, color relationships, layout patterns) as a template while filling in your
content and branding.
The most effective way to use an inspiration website: take a full-page screenshot using a browser
extension like GoFullPage, identify the specific elements you want to replicate (the hero section,
the pricing table, the navigation style), and tell Claude specifically what to take from it and what
to do differently.

Iterating with Screenshots

The iteration loop with screenshots is: build, screenshot, compare, refine. Here is how to make it
fast and effective. Open your generated HTML file in a browser, take a screenshot using your
operating system's built-in screenshot tool or a browser extension, drag the screenshot into your
Claude Code chat, and type 'Compare what I have now [screenshot] to the target [reference
screenshot]. List the top 3 visual differences and fix them.'
Usually 3-5 iteration rounds is enough to get from a rough first draft to something that closely
matches your reference. After that, you switch to functional refinement: making buttons work,
connecting form submissions, adding animations, ensuring mobile responsiveness.

Deploying to Netlify
Netlify is the fastest, most beginner-friendly way to get a website live on the internet. The
process for a simple HTML/CSS/JS site is genuinely one of the simplest technical tasks you can
do: drag your project folder onto the Netlify deploy page and your site is live at a Netlify URL in
under 60 seconds.
To deploy to Netlify: visit [Link] and create a free account. Once logged in, navigate to Sites
and look for the drag-and-drop deploy area. Open your project folder in Finder or File Explorer
and drag the entire folder onto the Netlify page. Netlify uploads your files, assigns a random
URL, and your site is live. You can connect a custom domain from the Netlify dashboard.

PRO TIP: For projects that will grow over time, connect Netlify to a GitHub repository instead
of using drag-and-drop. Then every time you push code to GitHub, Netlify automatically
rebuilds and redeploys your site. Claude Code can help you set up this pipeline.

Environment Variables and .env Files

Many applications need secret values - API keys, database passwords, authentication secrets -
that should not be hardcoded in your source code. Environment variables are the standard way

Simple Tech Skills - The Complete Claude Code Workbook | Page 15

 Simple Tech Skills | [Link]

to handle these secrets. A .env file is a simple text file that stores these key-value pairs:
API_KEY=your-secret-key-here.
Claude Code can create and manage .env files for you, and it understands the pattern of reading
environment variables in code ([Link].API_KEY in JavaScript, [Link]['API_KEY'] in
Python). When you ask Claude to integrate an external API, tell it you will be using a .env file for
the credentials and it will automatically write the code to read from environment variables
rather than hardcoding values.

Security Considerations for Public-Facing Apps

When building apps that will be publicly accessible on the internet, there are several security
principles Claude Code can help you implement. Input validation ensures that data submitted by
users is in the expected format before processing it. Rate limiting prevents a single user from
making thousands of requests per minute. HTTPS ensures data is encrypted in transit (Netlify
handles this automatically). Authentication verifies who a user is before giving them access to
protected resources.
For any app that handles user data or makes API calls with your credentials, always ask Claude:
'Review this code for security vulnerabilities before we deploy.' Claude will identify issues like
exposed API keys, unvalidated inputs, or missing authentication checks.

EXERCISE: Build and Deploy a Simple Web Page

19.​Find a website whose design you admire. Take a screenshot of its hero section (the top
portion of the page).
20.​Start a Claude Code session and share the screenshot: 'I want to build a landing page for
[your project]. Here is the design style I like. Build me a single-page HTML site in this visual
style with [your content].'
21.​Review the output in a browser. Take a screenshot and share it with Claude. Ask Claude to fix
the top 3 differences from your reference.
22.​Add at least one functional element: a contact form, an email capture, or a button that links
somewhere.
23.​Deploy the finished page to Netlify using the drag-and-drop method.
24.​Write the URL of your deployed page here and note what you would improve in the next
iteration.

Simple Tech Skills - The Complete Claude Code Workbook | Page 16

 Simple Tech Skills | [Link]

Module 5: Context Management

What Is a Context Window?

The context window is one of the most important concepts to understand about working with
any large language model, including Claude. Every AI conversation has a finite amount of
working memory - the total amount of text the model can hold in mind at once. When the
conversation exceeds this limit, the model can no longer access the earliest parts of the
conversation. This is the context window.
For Claude Code specifically, the context window is filled not just by your messages and Claude's
responses, but by the system prompt (including your [Link] file), the tools Claude has
access to, any files Claude has read during the session, and the running transcript of the entire
conversation. Understanding how these pieces fit together - and how to manage them - is the
difference between sessions that stay sharp and productive versus sessions that gradually
degrade in quality as the context fills up.

Understanding Tokens vs Words

AI models do not process text the way humans read it. Instead, text is broken into tokens -
roughly equivalent to syllables or short words. As a rule of thumb, one token is approximately
0.75 words, or conversely, 100 words is approximately 133 tokens. A typical English sentence of
15 words is about 20 tokens. A 1,000-line source code file might be 3,000-5,000 tokens
depending on how verbose the code is.
Claude's context window is measured in tokens. Claude 3.5 Sonnet and Claude 3 Opus both have
a 200,000-token context window, which is enormous by historical standards. But even a
200,000-token window fills up faster than you might expect when you factor in system tools
(which can use 17,000 tokens by default), MCP tools, memory files, and a long working session.

KEY TAKEAWAY: Think of your context window as a whiteboard. You can write a lot on it, but
eventually it fills up. /compact erases and summarizes the old content. /clear wipes it
completely. Managing this whiteboard proactively keeps your sessions sharp.

The /context Slash Command Breakdown

Running /context in your Claude Code session gives you a detailed breakdown of exactly how
your context window tokens are being used. This is the single best diagnostic tool for
understanding and optimizing your sessions. Here is what each category means:

System Prompt Tokens

This is the base cost of every session - the instructions that tell Claude how to behave as Claude
Code, plus your [Link] file content. You cannot eliminate the base system prompt, but you
can control the size of your [Link]. A well-optimized [Link] of 200 lines might use
800-1,200 tokens. A sprawling [Link] of 1,000 lines might use 4,000-6,000 tokens. Be
intentional about what you include.

Simple Tech Skills - The Complete Claude Code Workbook | Page 17

 Simple Tech Skills | [Link]

System Tools (Default ~17,000 tokens)

Claude Code ships with a set of built-in tools - file reading, file writing, terminal commands, web
search, and others. These tools are defined in a schema that takes up approximately 17,000
tokens in your context. This is a fixed cost you pay in every session. It is why /context often
shows a surprisingly large token count even in a brand-new session with no conversation history
yet.

MCP Tools
Each MCP server you have installed adds its own tool definitions to the context. A single MCP
server might add 2,000-8,000 tokens worth of tool definitions. If you have five MCP servers
installed, you might be adding 20,000+ tokens before the conversation even begins. This is why
Module 10 covers converting MCP workflows into lightweight skills - a key optimization for
managing context costs.

Memory Files
Any memory files (like [Link] or [Link]) that Claude loads at session start consume
tokens proportional to their length. A 5,000-word [Link] uses roughly 6,500 tokens.
Multiple memory files multiply this cost.

Messages
The conversation history itself accumulates tokens with every exchange. In a long working
session, the message history can easily reach 50,000-100,000 tokens. This is the most dynamic
part of your context - it grows with every message - and it is the primary target for /compact and
/clear operations.

The Auto-Compact Buffer

Claude Code has a built-in auto-compact feature that triggers when the context window reaches
approximately 90-95% capacity. When auto-compact triggers, Claude automatically summarizes
the conversation history, replacing the detailed transcript with a compressed summary that
preserves the key decisions and context while dramatically reducing the token count. The
summary is then used as the starting point for the next exchange.
Auto-compact is helpful because it prevents your session from dying abruptly when the context
fills up. However, it can sometimes compress away context you still needed. Developing the
habit of running /compact manually before auto-compact triggers - when you can see in the
status line that the context is getting large - gives you more control over what gets preserved.

The /compact Command

The /compact command manually triggers a context compression. Claude summarizes the
conversation so far, condenses it, and continues the session from the summary. Unlike /clear,
which wipes the slate completely, /compact tries to preserve the essential context while
reducing token usage.

Simple Tech Skills - The Complete Claude Code Workbook | Page 18

 Simple Tech Skills | [Link]

Use /compact when: you have completed a major phase of work and are moving to a new one,
the status line shows you are at 60%+ context usage, or you notice Claude starting to lose track
of earlier decisions. A good mental model: /compact is like filing away your notes at the end of a
work session and starting the next session with a clean desk but the same project folder.

Strategies for Efficient Prompting

High information density language means packing the maximum amount of useful instruction
into the minimum number of words. Instead of 'Can you please look at the login form and make
it so that when someone submits it with an email that already exists in the database, they see a
helpful error message?' write: 'Add duplicate-email validation to the login form: show an inline
error if the submitted email already exists in users table.'
Voice transcript optimization matters if you dictate messages. Spoken language is naturally low
information density - we use filler words, repeat ourselves, and speak in full sentences. If you
dictate to Claude, consider using a post-processing step to compress your transcript before
sending, or train yourself to speak in dense, directive phrases rather than conversational
sentences.

PRO TIP: Keep a context hygiene practice: at the start of each session, run /context to see
your baseline usage. At the 50% mark, run /compact. Never let auto-compact trigger if you can
avoid it - manual /compact at 60-70% gives you much better control over what gets preserved.

EXERCISE: Run /context and Audit Your Token Usage

25.​Start a Claude Code session in a project that has a [Link] file (if you created one in
Module 3, use that project).
26.​Before saying anything, run /context and record the baseline token usage in the notes box
below.
27.​Have a 10-message conversation about the project - ask questions, make changes, review
results.
28.​Run /context again and record the new token usage. Calculate how many tokens each
exchange cost on average.
29.​Run /compact and then run /context again. Note how much the token count decreased.
30.​Identify which category (system tools, messages, memory files) is using the most tokens in
your session.

Simple Tech Skills - The Complete Claude Code Workbook | Page 19

 Simple Tech Skills | [Link]

Module 6: Slash Commands - The Complete Guide

Slash commands are Claude Code's built-in power-user tools. They are invoked by typing a
forward slash followed by the command name at the Claude Code prompt. Unlike conversational
messages, slash commands are direct instructions to the Claude Code system itself - they change
how it behaves, what it displays, or what state it is in. Mastering slash commands is one of the
fastest ways to level up your Claude Code productivity.

/context - Audit Your Token Usage

The /context command displays a detailed breakdown of your current context window usage. It
shows you the total token count, how many tokens are used by the system prompt, tool
definitions, memory files, and conversation history. Use /context at the start of sessions to
establish your baseline and periodically during long sessions to monitor growth.
Reading the /context output trains you to recognize patterns: which MCPs are most
token-expensive, how quickly your conversation history grows, how much your [Link] is
costing you. Over time, this knowledge guides smart decisions about when to compact, when to
clear, and which tools to disable when you are not using them.

/compact - Manually Compress Conversation History

The /compact command summarizes your conversation history, replacing the detailed transcript
with a compressed version that preserves essential context. The compression ratio is typically
5:1 to 10:1 - a 50,000-token conversation might compress to 5,000-10,000 tokens. The quality of
the compressed summary depends on how clearly the conversation was structured, which is
another reason to use clear, specific language in your messages.
You can customize what /compact preserves by adding context after the command: '/compact
focus on the database schema decisions and the API design - we will keep working on those.'
This tells Claude what to prioritize when generating the summary.

/clear - Start a Fresh Session

The /clear command wipes the conversation history completely and starts fresh. Unlike
/compact, there is no summary - the slate is completely clean. Use /clear when you have
genuinely finished one task and are starting something entirely unrelated, when a session has
gone sideways and you want to reset without any accumulated confusion, or when you want to
test something from scratch without prior context influencing the result.
Important: /clear does not affect your files, your [Link], or anything outside the
conversation. It only clears the in-memory conversation history. Your project files remain exactly
as they were.

/model - Switch Between Models

The /model command lets you switch between available Claude models mid-session. This is
useful because different tasks benefit from different models. Claude Opus is the most capable
but most expensive model - best for complex reasoning, architecture decisions, and nuanced

Simple Tech Skills - The Complete Claude Code Workbook | Page 20

 Simple Tech Skills | [Link]

writing. Claude Sonnet is the balanced option - fast, capable, and cost-effective for most
development tasks. Claude Haiku is the fastest and cheapest - appropriate for simple, repetitive
tasks where speed matters more than depth.
Run /model to see a list of available models and select one. You can switch freely during a
session - use Opus for the hard architectural decisions and switch back to Sonnet for the
implementation work.

/thinking - Toggle Extended Thinking

Extended thinking is a special mode where Claude takes more time to reason through a problem
before responding. When enabled, Claude works through the problem step by step internally
before giving you its final answer. The result is typically more careful, more thorough, and more
reliable - especially for complex problems that require multi-step reasoning.
Use /thinking for: system architecture decisions, debugging complex bugs with multiple potential
causes, evaluating tradeoffs between technical approaches, security reviews, and any situation
where you want Claude's most careful analysis rather than its fastest response.

/fast - Toggle Fast Mode

Fast mode uses a faster version of the current model, typically delivering responses at roughly
2.5x the normal speed. The tradeoff is that fast mode may be slightly less thorough than
standard mode on complex reasoning tasks. For routine implementation tasks - adding a feature,
fixing a bug, refactoring code - fast mode is excellent. For architectural decisions and nuanced
analysis, standard mode is worth the extra seconds.

/cost - View Current Session Costs

The /cost command shows you the accumulated cost of the current session in USD. This is
helpful for building intuition about how much different types of work cost, and for identifying
unusually expensive operations (a poorly optimized prompt that re-reads large files repeatedly,
for example, will show up clearly in the cost breakdown).

/usage - View Account Usage Stats

The /usage command shows your broader account-level usage statistics - total tokens used in the
current billing period, how much of your plan's allowance you have consumed, and a breakdown
by model. Use this to track whether you are approaching your plan's limits and to decide
whether to upgrade your subscription.

/debug - Debugging Tools

The /debug command activates verbose logging mode, showing detailed information about
every action Claude takes - file reads, command executions, API calls, tool invocations. This is
primarily useful when something is not working as expected and you need to understand exactly
what Claude is doing at each step.

Simple Tech Skills - The Complete Claude Code Workbook | Page 21

 Simple Tech Skills | [Link]

/init - Initialize a New Project

The /init command sets up a new Claude Code project in the current directory. It creates a
[Link] template, analyzes any existing files in the directory, and helps you establish the
initial project context. Running /init at the start of a new project is a good habit - it forces you to
think through the project's purpose and constraints before diving into building.

/login and /logout - Authentication

The /login command opens the browser-based authentication flow to connect your Anthropic
account to Claude Code. The /logout command clears your credentials. You typically only use
these once (at initial setup and when switching accounts), but they are useful to know when
troubleshooting authentication issues.

EXERCISE: Try Each Slash Command and Note What It Does

31.​Start a Claude Code session and run /context. Write the baseline token count in your notes.
32.​Have a 5-message conversation about any topic.
33.​Run /cost. Note the session cost so far.
34.​Run /compact. Then run /context again. Note the new token count.
35.​Run /model and switch to a different model. Send one message and note whether you
notice a difference in response style.
36.​Run /thinking and ask a complex question. Compare the response to one without extended
thinking.
37.​Run /clear. Verify the conversation history is empty.

Simple Tech Skills - The Complete Claude Code Workbook | Page 22

 Simple Tech Skills | [Link]

Module 7: Permission Modes

Understanding the Permission System

One of the most thoughtfully designed aspects of Claude Code is its permission system. Every
action that Claude takes in the real world - reading a file, writing a file, running a terminal
command, making a network request - requires permission from you. The permission modes
control how granular that permission-asking is. Understanding each mode and when to use it is
essential for working efficiently and safely.

Ask Before Edits (Safe Mode)

In Ask Before Edits mode, Claude asks your explicit approval before making any change to any
file. It will show you exactly what it plans to do - which file it will modify, what the change will
look like - and wait for you to approve or decline before proceeding. This is the safest and most
controlled mode, ideal for beginners, for working on production systems where mistakes are
costly, and for any time you want to understand exactly what Claude is doing at each step.
The tradeoff is speed. On complex builds that require hundreds of file operations, asking before
each edit makes the session painstakingly slow. Use Ask Before Edits when you are learning,
when the stakes are high, or when you want to study the specific changes Claude is making.

Edit Automatically (Balanced Mode)

In Edit Automatically mode, Claude proceeds with file edits without asking, but still asks for
approval before running terminal commands and network requests that could have broader
effects. This is the mode most experienced users spend the majority of their time in - it gives
Claude the autonomy to move quickly while retaining a check on the higher-risk operations.
Edit Automatically is the right choice for most development work: building features, refactoring
code, writing tests, updating documentation. The implicit contract is that you trust Claude's file
editing decisions and only need explicit confirmation for actions that touch systems outside your
project directory.

Bypass Permissions / Dangerously Skip Permissions

Dangerously Skip Permissions mode (sometimes called bypass mode) removes all permission
checks. Claude takes any action required to complete the task without asking at any point. This is
the most powerful mode - and the one that requires the most care.
This mode is appropriate in two scenarios: fully automated pipelines where no human is in the
loop to respond to permission requests (a nightly automation script, a CI/CD integration), and
expert users who have complete confidence in what they have asked Claude to do and want
maximum speed. It is never appropriate for beginners, for production systems without a review
step, or for anything where an unexpected action could cause irreversible damage.

WARNING: Dangerously Skip Permissions means Claude will execute commands, delete files,
and make network requests without any confirmation. Use it only in controlled environments

Simple Tech Skills - The Complete Claude Code Workbook | Page 23

 Simple Tech Skills | [Link]

with code you have reviewed, and always have version control (git) active so you can roll back
if needed.

Plan Mode
Plan Mode is a special permission mode where Claude creates a detailed plan of everything it
intends to do before doing anything. You review the plan, can edit it, add steps, remove steps, or
redirect the approach entirely - and only when you approve does Claude begin execution. Plan
Mode is covered in depth in Module 8, but in the context of permissions, it sits between Ask
Before Edits and Auto: it asks once (for the plan) rather than asking before each individual
action.

When to Use Each Mode

Use Ask Before Edits when you are learning Claude Code, working on a codebase you are
unfamiliar with, making changes to a production system, or debugging a specific issue where you
want to see exactly what Claude proposes at each step.
Use Edit Automatically for the majority of your development work. It is the balanced mode that
experienced users default to.
Use Plan Mode for complex, multi-step builds where you want to review the complete strategy
before any code is written. It is particularly valuable for new features that will require changes
across many files.
Use Dangerously Skip Permissions only in automated pipelines and only after thorough review of
what you are asking Claude to do.

Safety Practices
Regardless of permission mode, certain safety practices should always be in place. Keep your
project in a git repository and commit frequently. Before any large autonomous operation,
commit your current state so you have a rollback point. Never run Claude Code with Dangerously
Skip Permissions on a directory that contains credentials, financial data, or anything you could
not recover from if accidentally deleted.
For web applications and APIs, always review Claude's authentication and authorization logic
before deploying. Claude is excellent at implementing security patterns but benefits enormously
from an explicit security review prompt: 'Before we deploy this, review the authentication
system for any vulnerabilities and fix them.'

PRO TIP: Create a test-project folder that is completely separate from your real projects. Use
it for experimenting with aggressive permission modes, testing destructive operations, and
trying things you would not want to run near real data. This sandbox approach gives you
freedom to explore without risk.

Simple Tech Skills - The Complete Claude Code Workbook | Page 24

 Simple Tech Skills | [Link]

EXERCISE: Practice Switching Between Modes on a Test Project

38.​Create a new empty folder called permission-test.

39.​Start a Claude Code session in Ask Before Edits mode. Ask Claude to create a basic 3-page
HTML website. Note how many permission prompts you receive.
40.​Switch to Edit Automatically mode. Ask Claude to add a navigation menu to all three pages.
Note the difference in how the session flows.
41.​Look at the git diff to see all changes Claude made. Do they all look correct?
42.​Commit the working code. Then switch to Plan Mode and ask Claude to add a contact form.
Review the plan before approving.

Simple Tech Skills - The Complete Claude Code Workbook | Page 25

 Simple Tech Skills | [Link]

Module 8: Plan Mode - Advanced Builds

What Is Plan Mode?

Plan Mode is one of the most powerful features in Claude Code for managing complex,
multi-step builds. When you activate Plan Mode (or when Claude auto-initiates it for sufficiently
complex tasks), Claude does not immediately start writing code. Instead, it analyzes the entire
task, thinks through the components, dependencies, and steps required, and produces a
detailed numbered plan of everything it will do - before touching a single file.
This might sound like a small difference from just asking Claude to build something, but in
practice it changes the dynamic of the session fundamentally. You become a collaborator in the
architecture rather than a passive recipient of whatever Claude decides to build. You can catch
architectural mistakes before they are baked into dozens of files. You can redirect the approach
before it is too late to change course cheaply.

KEY TAKEAWAY: Plan Mode shifts Claude from a code-execution engine to a thought partner.
Use it for anything that touches more than 5 files or involves decisions you want to be part of
before implementation begins.

How Claude Auto-Initiates Plan Mode

Claude Code recognizes certain types of requests as sufficiently complex that they warrant
planning before acting. If you ask Claude to build a full authentication system with JWT tokens,
password reset, and role-based access control, Claude will almost certainly enter Plan Mode
automatically before writing any code. This is the expected behavior and a sign that Claude is
handling the task appropriately.
The threshold for auto-initiated Plan Mode is roughly: tasks requiring changes to more than 5
files, tasks involving database schema changes, tasks that require setting up new external service
integrations, or tasks that the Claude Code system classifies as architecturally significant. You can
always ask Claude explicitly to enter Plan Mode for any task: 'Before you start, create a plan and
wait for my approval.'

Reading and Editing Plans Before Execution

When Claude presents a plan, read it carefully. Look for these things: completeness (has Claude
identified all the components the task requires?), correct sequencing (will the steps happen in
the right order - database schema before API endpoints before frontend?), missing
dependencies (is Claude planning to use a library that is not yet installed?), and potential
conflicts (will step 4 break something created in step 2?).
You can edit the plan freely before approving. Type back to Claude with your modifications:
'Before step 3, add a step to create the database migration file. And in step 6, use PostgreSQL
not SQLite.' Claude will revise the plan and present it again for your approval. Only once the plan
reflects exactly what you want should you say proceed or approved.

Simple Tech Skills - The Complete Claude Code Workbook | Page 26

 Simple Tech Skills | [Link]

The Pause Button During Execution

Once you approve a plan and Claude begins execution, you can pause at any point by pressing
Escape or typing a message. This is important to know - you are not locked in to the full plan
once you approve it. If Claude completes step 3 and you realize step 4 is about to make a
mistake, you can pause, redirect, and either continue or revise the remaining steps.
Some developers use Plan Mode in a hybrid approach: approve the full plan but plan to pause at
specific checkpoints. For example, 'Proceed with steps 1-4 and then pause so I can review the
database schema before you build the API layer.' This gives you the benefit of autonomous
execution for the parts you are confident about, and review gates for the parts you want to
check.

Multi-Step Project Builds

For projects with many components - a full-stack web application, an end-to-end automation
pipeline, a multi-service architecture - Plan Mode paired with good [Link] setup creates a
systematic build process. The pattern is: establish context in [Link], enter Plan Mode for
the overall architecture, approve the architecture plan, then execute one phase at a time with
Plan Mode prompts for each phase.
This phased approach also makes it easier to resume work across sessions. When you return to a
project after a break, the [Link] tells Claude the current state, and you can ask Claude to
create a plan for the next phase with full context of what came before.

Using Thinking Mode Alongside Plan Mode

Combining /thinking with Plan Mode produces the highest-quality plans. When extended
thinking is active, Claude reasons through the problem more deeply before generating the plan -
catching edge cases, identifying dependencies, and anticipating issues that standard mode might
miss. The combination is slower (extended thinking + plan generation takes more time), but for
complex, high-stakes builds the quality improvement is significant.
A recommended workflow for major new features: activate /thinking, ask Claude to produce a
plan for the feature, review the plan carefully, turn off /thinking, then execute with standard
mode. The deep thinking happens once at the planning stage, and the faster standard mode
handles the more mechanical execution work.

Code Review with Sub-Agents

One of the most powerful patterns in Claude Code is using a separate sub-agent (covered in
depth in Module 9) to review code that the main agent has written. The reviewer sub-agent has
no context about why the code was written a certain way - it only sees the code itself. This
zero-context review catches issues that the primary agent might miss because it is anchored to
its own decisions.

Simple Tech Skills - The Complete Claude Code Workbook | Page 27

 Simple Tech Skills | [Link]

In the context of Plan Mode, you can add a code review step to every plan: 'After completing
each major component, spawn a reviewer agent to audit the code before proceeding to the next
component.' This builds quality checks directly into your build process.

EXERCISE: Use Plan Mode to Build Something with 5+ Components

43.​Choose a project to build: a simple task management app, a portfolio website with 4
sections, a data dashboard, or any project that has at least 5 distinct components.
44.​Activate Plan Mode: 'Before writing any code, create a detailed plan for building [your
project]. List every file you will create, every component you will build, and the order you
will build them in.'
45.​Review the plan. Identify at least two things you would change and request those changes.
46.​Approve the revised plan and let Claude execute steps 1-3 autonomously.
47.​Review the output of steps 1-3. Is it what you expected? Note any surprises.
48.​Continue through the full plan. At the end, review the complete project and note what the
plan got right and what it got wrong.

WANT TO GO FURTHER? You are halfway through the workbook and building real skills. The
Academy offers live Q&A sessions where you can bring your projects, ask questions, and get
direct coaching - plus a private community of builders at every level. Join at
[Link]/academy

Simple Tech Skills - The Complete Claude Code Workbook | Page 28

 Simple Tech Skills | [Link]

Module 9: Subagents and Agent Teams

What Are Subagents?

Subagents are one of the most sophisticated features in the Claude Code ecosystem - and one of
the most misunderstood. A subagent is simply another Claude instance that your primary Claude
session can spawn to work on a specific task in parallel. While your main session continues
working, the subagent works independently on its assigned task, and when it completes, it
reports back with the results.
The key insight that makes subagents powerful is parallelism. Human developers work
sequentially: finish task A, start task B. Subagent-powered workflows can run tasks A, B, C, and D
simultaneously, with each agent reporting back when done. For a task that would normally take
an hour of sequential AI work, four parallel subagents can reduce that to 15 minutes of
wall-clock time.

KEY TAKEAWAY: Subagents turn Claude Code from a single assistant into a coordinated team.
The primary agent is the project manager; the subagents are the specialists. Use them for any
workflow that has independent parallel workstreams.

Task Tool - Spawning Parallel Agents

The Task tool is the mechanism by which the primary Claude agent spawns subagents. When
Claude Code is in an agentic workflow, it can call the Task tool with a description of what the
subagent should do and any context it needs. The subagent runs in a separate session with its
own context window, works on its assigned task, and returns its output to the primary agent.
The Task tool takes several parameters: the task description (what the subagent should do), any
initial context (files to read, information to start with), and tool permissions (which tools the
subagent is allowed to use). Scoping the subagent's tool access is a good security practice - a
subagent that only needs to read files should not have permission to run arbitrary shell
commands.

TaskOutput - Retrieving Subagent Results

TaskOutput is the mechanism for retrieving the results from a completed subagent task. Once a
subagent finishes its work, it sends its output back through TaskOutput, and the primary agent
can then use that output to inform its next steps. This creates a structured data flow: primary
agent defines tasks, subagents execute them, primary agent synthesizes the results.
The output from a subagent can be structured (a JSON object, a formatted report) or
unstructured (natural language output). For reliable parallel workflows, it is worth instructing
your subagents to return their results in a consistent format so the primary agent can process
multiple subagent outputs predictably.

Simple Tech Skills - The Complete Claude Code Workbook | Page 29

 Simple Tech Skills | [Link]

The Reviewer Pattern

The reviewer pattern is one of the most immediately useful subagent workflows. It works like
this: the primary agent writes code to implement a feature, then spawns a fresh subagent that
has never seen the feature request or the implementation decisions. The reviewer subagent
receives only the code itself and is asked to review it for bugs, security vulnerabilities, style
issues, and logical errors.
The zero-context review is valuable precisely because the reviewer is not anchored to the
implementation decisions. It evaluates the code on its merits rather than in the context of why it
was written that way. Issues that the builder overlooked because they were obvious from
context get caught by the reviewer who has no context.

PRO TIP: Instruction for the reviewer subagent: 'You are a senior code reviewer. You will
receive code to review. You have no context about why the code was written. Review it as if
seeing it for the first time in a code review. Look for: logical bugs, security vulnerabilities, edge
cases not handled, code that does not match its documentation, and violations of common
best practices. Be specific and actionable in your feedback.'

QA and Testing Subagent Pattern

Similar to the reviewer pattern, the QA subagent pattern spawns a dedicated testing agent after
the primary agent completes a feature. The QA agent's job is to write and run tests for the new
functionality, document what it tested, and report back on whether everything passes.
Separating the building and testing into different agents produces more thorough test coverage.
The builder agent thinks about tests from the perspective of what it built; the QA agent thinks
about tests from the perspective of what might break. These two perspectives are
complementary and together produce better test suites than either agent alone.

The Agent Teams Feature

Agent Teams is a higher-level orchestration layer that allows you to define a team of specialized
agents, each with a specific role and tool set, that work together on complex projects. Unlike
ad-hoc subagent spawning, Agent Teams creates persistent agent roles that can be reused across
sessions and projects.
Common agent team configurations include: a researcher agent (web search and document
reading tools only), a builder agent (file editing and terminal tools), a reviewer agent (read-only
file access, no editing tools), and a deployer agent (deployment tools and environment
configuration). Each agent does its job well because its tool access is precisely calibrated to its
role.

Worktrees and Session Mobility

Git worktrees allow you to have multiple working copies of a git repository checked out
simultaneously at different branches. Combined with Claude Code subagents, this enables a

Simple Tech Skills - The Complete Claude Code Workbook | Page 30

 Simple Tech Skills | [Link]

powerful workflow: multiple agents working on different branches of the same project in
parallel, each in its own worktree, without conflicts.
This is particularly valuable for large refactoring projects or when running multiple experiments
in parallel. Agent 1 works on the authentication refactor in worktree A. Agent 2 works on the API
redesign in worktree B. Agent 3 works on the frontend redesign in worktree C. All three run
simultaneously, and you review their work when each completes.

EXERCISE: Create a 2-Agent Workflow (Builder + Reviewer)

49.​Choose a simple feature to build: a contact form, a data table component, or a utility
function with clear requirements.
50.​Ask Claude (the builder agent) to implement the feature: 'Build [feature] with these
requirements: [list requirements]. When done, present the complete code for review.'
51.​Once the builder completes its work, manually act as the reviewer by opening a new Claude
Code session (or use /clear) and paste the code with this prompt: 'Review this code. You
have no context about why it was written. Find bugs, security issues, and improvement
opportunities.'
52.​Return to the builder session and share the reviewer feedback: 'The code review found these
issues: [issues]. Fix them.'
53.​Compare the final code to the initial version. What did the review process improve?

Simple Tech Skills - The Complete Claude Code Workbook | Page 31

 Simple Tech Skills | [Link]

Module 10: Skills - Custom Automation Scripts

What Are Skills?

Skills are one of the most elegant features in Claude Code - and one that most users discover
only after they have already been frustrated by the token cost of MCP tools. A skill is a plain text
file that contains a description of a task and instructions for how Claude should complete it.
Skills are loaded into Claude's context only when they are relevant to what you are doing, which
makes them dramatically more token-efficient than MCP tool definitions that are always loaded.
Think of a skill as a saved workflow. If you find yourself giving Claude the same multi-step
instructions every time you want to do a particular type of task - scraping a website for leads,
generating a certain type of document, deploying to a specific environment - a skill codifies
those instructions so you never have to repeat them. One mention of the skill name is enough.

KEY TAKEAWAY: Skills are saved, reusable workflows that load into context on demand. They
are the right tool for any repetitive multi-step process you want Claude to be able to execute
reliably and consistently.

Skills vs MCP Tools: Token Efficiency Comparison

The fundamental difference between skills and MCP tools is when their definitions are loaded
into context. MCP tool definitions are loaded at the start of every session regardless of whether
you use them. A single MCP server with 20 tools might add 5,000-10,000 tokens to every
session. Five MCP servers add 25,000-50,000 tokens - before you have said a single word.
Skills, by contrast, are loaded lazily - only when Claude determines they are relevant to the
current task. A library of 50 skills might only load 2-3 skills per session, each adding 200-500
tokens. The total context cost of a rich skill library can be less than 1,000 tokens in a typical
session, versus 25,000+ tokens for an equivalent MCP toolkit. This difference compounds
significantly over long working sessions.

The Skill File Structure

A skill file is a Markdown file with YAML front matter followed by the skill instructions. The front
matter uses specific fields that Claude Code reads to understand when and how to use the skill.
A minimal skill file looks like this:

SKILL FILE FORMAT: ---​

name: web-scraper​
description: Scrape a list of URLs and extract structured data​
triggers:​
- "scrape this website"​
- "extract data from"​
- "get leads from"​
---​
​

Simple Tech Skills - The Complete Claude Code Workbook | Page 32

 Simple Tech Skills | [Link]

## Instructions​
1. Navigate to the provided URL using the browser tool​
2. Identify the data structure you want to extract​
3. Extract the data and format it as JSON​
4. Save the results to a CSV file named [domain]-[Link]

How Skills Are Lazily Loaded

When you start a Claude Code session, the skills framework scans your skills directory and loads
the front matter (just the name, description, and triggers) of each skill into a lightweight index.
This index uses very few tokens - essentially just one line per skill. When you make a request that
matches one of the trigger phrases, the full skill file is loaded into context for that conversation.
This lazy loading mechanism is what makes skills so efficient. The full instructions for your web
scraper skill are not consuming context tokens during a session where you are building a login
form. They are available if you need them, but invisible if you do not.

Example Skills

Web Scraper Skill

A web scraper skill defines the standard workflow for extracting structured data from a website:
navigate to the URL, identify the data patterns, extract the data, clean and structure it, and save
it to a file. A good scraper skill also includes error handling instructions - what to do if the page
requires login, what to do if the data is paginated, how to handle JavaScript-rendered content.

Lead Generation Skill

A lead generation skill combines web research with structured output. It might instruct Claude
to: search for companies matching certain criteria, visit each company's website, extract contact
information and key business details, score each lead against qualification criteria, and save the
results to a formatted spreadsheet. Codifying this as a skill means you can launch the entire
workflow with a single natural language request.

Website Generator Skill

A website generator skill captures your preferred website-building workflow: check [Link]
for brand guidelines, use the screenshot comparison approach with a specified template,
implement the required sections in a specified order, test on mobile viewport, and run a final
quality check. The skill ensures every website you build with Claude follows the same quality
process.

Converting MCP Workflows into Skills

The recommended workflow for developing new automations is: sketch and test the workflow
using MCP tools (which give you rich, interactive capabilities for exploration), then once the
workflow is proven, convert it to a skill that can execute the same workflow without the token

Simple Tech Skills - The Complete Claude Code Workbook | Page 33

 Simple Tech Skills | [Link]

overhead. The skill calls the same tools and executes the same steps, but the instruction set lives
efficiently in the skills library rather than loading expensive MCP definitions into every session.

PRO TIP: Create a skill for every workflow you run more than three times. The time
investment in writing the skill (usually 15-30 minutes) pays back immediately in faster
execution, better consistency, and lower token costs. A library of 20 well-written skills is one of
the highest-value assets you can build as a Claude Code power user.

EXERCISE: Build a Skill That Automates a Repetitive Task

54.​Identify a repetitive task you do regularly that you could offload to Claude: generating a
weekly report, formatting data from a CSV, creating boilerplate code for a new component,
or any other routine workflow.
55.​Write out the steps for this task manually, in order, as if explaining it to a new employee.
56.​Create a new file in your skills directory called [task-name].md with the appropriate front
matter and your step-by-step instructions.
57.​Test the skill by starting a new Claude Code session and triggering it with one of your trigger
phrases.
58.​Iterate on the skill based on what worked and what did not. Add error handling for the edge
cases you encounter.

Simple Tech Skills - The Complete Claude Code Workbook | Page 34

 Simple Tech Skills | [Link]

Module 11: Model Context Protocol (MCP)

What Is MCP?
The Model Context Protocol (MCP) is an open standard developed by Anthropic that defines how
AI models can connect to external tools, services, and data sources. Think of MCP as a universal
connector - a standardized way for Claude to reach out to the world beyond the files in your
project directory. With MCP, Claude can interact with your browser, your email, your project
management tools, your database, external APIs, and much more.
MCP works through a server/client architecture. An MCP server is a piece of software that wraps
a tool or service in the MCP protocol, exposing it as a set of typed functions that Claude can call.
When you install an MCP server, you are giving Claude a new capability - a new set of hands that
can reach into that specific system.

KEY TAKEAWAY: MCP transforms Claude from a code-editing tool into a general-purpose AI
agent that can interact with any digital system that has an MCP server. The ecosystem of
available MCP servers is growing rapidly.

Skills vs MCP: When to Use Each

The practical decision framework between skills and MCP: use MCP when you need real-time
interaction with an external service (reading live email, creating tasks in your project
management tool, browsing a dynamic website). Use skills when you have a proven workflow
that you want to execute repeatedly and efficiently without paying the token cost of MCP tool
definitions.
Many power users use both: MCP for interactive exploration and real-time integrations, skills for
codified workflows that run the same way every time. The two complement each other rather
than compete.

Finding MCP Servers

The primary directories for finding MCP servers are [Link] and the MCP market on [Link].
Both directories list hundreds of community-contributed and officially supported MCP servers.
You can search by category (browser automation, productivity tools, development tools, data
tools) or by the specific service you want to integrate.
Anthropic also maintains an official list of supported MCP servers in their documentation. For
production use, prefer officially supported or widely-used community servers over obscure ones
- the same way you would with any third-party software.

Installing an MCP Server

MCP server installation is handled through the Claude Code configuration file ([Link] or
.claude/[Link], depending on your version). The installation process typically involves

Simple Tech Skills - The Complete Claude Code Workbook | Page 35

 Simple Tech Skills | [Link]

adding the server's connection configuration to your Claude settings. Most MCP servers provide
an install command in their documentation that automatically adds the configuration.
After installation, you need to restart Claude Code for the new MCP server to load. Once loaded,
you will see the new tools available in your /context output under the MCP tools section. The
increase in token count from the new server's tool definitions will be visible immediately.

The Chrome DevTools MCP (Most Recommended)

If you install only one MCP server, make it the Chrome DevTools MCP. It gives Claude the ability
to control your Chrome browser - navigating to URLs, taking screenshots, clicking elements,
filling forms, reading page content, and executing JavaScript. This single integration unlocks an
enormous range of use cases: web research, competitor analysis, form automation, scraping
dynamic websites, and visual QA testing.
The Chrome DevTools MCP works by connecting to Chrome's built-in DevTools Protocol (CDP).
You install the Claude Code browser extension, which opens a CDP connection that Claude can
use. The connection is local - no external service is involved - making it both fast and secure.

ClickUp MCP - Project Management Integration

The ClickUp MCP connects Claude to your ClickUp workspace, allowing Claude to read and
create tasks, update task status, add comments, and manage projects directly from your Claude
Code session. This enables powerful workflows: automatically creating tasks from code review
findings, updating task status as code gets merged, generating sprint summaries from completed
tasks.
Similar MCP servers exist for other project management tools including Linear, Jira, Notion, and
Asana. The pattern is the same: install the MCP, authenticate with your account, and Claude
gains read/write access to your project management data.

Gmail MCP - Email Labeling and Organization

The Gmail MCP allows Claude to read, label, archive, and organize your email. The most
powerful initial use case is building an automated email labeling system: Claude reads new
emails, categorizes them based on their content, and applies appropriate labels. Once trained on
your labeling preferences, this can process hundreds of emails with a single command.
The Gmail MCP workflow pairs naturally with skills: build and test your labeling logic using the
interactive MCP, then codify the proven labeling rules into a skill that can run on a schedule.

MCP Token Costs and How to Audit Them

Every MCP server you install adds to your baseline context cost. To understand exactly what each
server is costing you: run /context with all your MCP servers active and note the total MCP token
count. Then disable each server one at a time and re-run /context to see how much each one
costs. This audit often reveals MCP servers you installed and forgot about that are costing
significant tokens every session.

Simple Tech Skills - The Complete Claude Code Workbook | Page 36

 Simple Tech Skills | [Link]

A good practice: keep only the MCP servers you actively use enabled. Create separate Claude
Code profiles for different types of work - a web development profile with browser MCP
enabled, a data analysis profile with database MCPs enabled - so you never pay for MCP tools
you are not using.

EXERCISE: Install One MCP and Complete a Task With It

59.​Visit [Link] or [Link]/mcp-market and browse the available MCP servers. Choose one
that is relevant to your work.
60.​Follow the installation instructions for your chosen MCP server.
61.​Start a Claude Code session and run /context. Note the new MCP tool definitions and their
token cost.
62.​Complete a real task using the new MCP - research a topic, create a project task, organize
some emails, or whatever the MCP enables.
63.​Reflect: was the result worth the token cost? Would this be better as a skill once the
workflow is proven?

Simple Tech Skills - The Complete Claude Code Workbook | Page 37

 Simple Tech Skills | [Link]

Module 12: Chrome DevTools Integration

What the Chrome DevTools MCP Enables

The Chrome DevTools MCP is the gateway to one of the most compelling Claude Code
capabilities: AI-driven browser automation. When this MCP is active, Claude can control Chrome
as if it had its own hands on the keyboard and mouse. It can navigate to any URL, interact with
page elements, extract information from any website, fill and submit forms, take screenshots for
visual analysis, and execute JavaScript in the browser context.
This capability fundamentally changes what is possible with Claude Code. Tasks that previously
required expensive RPA tools, custom Selenium scripts, or manual copy-paste work can now be
described in plain language and executed automatically. Market research, competitive
intelligence, lead generation, content auditing, UI testing - all become simple Claude Code
conversations.

Installing and Activating the Extension

The Chrome DevTools MCP requires two components: the Claude Code browser extension
(installed from the Chrome Web Store) and the MCP server configuration in your Claude settings.
Install the Chrome extension first by searching for 'Claude Code' in the Chrome Web Store. Once
installed, you will see the Claude Code icon in your browser toolbar.
After installing the extension, add the Chrome DevTools MCP to your Claude configuration file.
The exact configuration syntax is in the Claude Code documentation, but it typically involves
adding a chrome-devtools entry to your MCP servers list with the appropriate connection
parameters. Restart Claude Code after making the configuration change.
To activate the connection: open Chrome, click the Claude Code browser extension icon, and
ensure it shows Connected. Then start a Claude Code session - you should see the browser tools
available in your /context output.

Navigating to URLs via Claude

Once connected, asking Claude to navigate to a URL is as simple as: 'Navigate to [Link]
and tell me what you see.' Claude will open the URL in Chrome (or the active Chrome tab), read
the page content, and report back. The experience feels remarkably natural - as if Claude has
opened a browser window alongside you.
Navigation instructions can be chained: 'Go to [URL], click on the first result, scroll to the reviews
section, and extract the top 5 customer complaints.' Claude follows these instructions in
sequence, performing each action and moving to the next, returning a report when it reaches
the end of the instruction chain.

Taking Screenshots for Visual Analysis

The screenshot capability is particularly powerful for visual QA and design iteration. After
navigating to a page, Claude can take a screenshot and analyze the visual layout, identify design

Simple Tech Skills - The Complete Claude Code Workbook | Page 38

 Simple Tech Skills | [Link]

inconsistencies, compare the current state to a reference design, or document the current state
of a page for records.
A powerful workflow: 'Navigate to our staging site, take a screenshot of the checkout flow at
each step, and compare each step to these reference screenshots. Report any visual differences.'
This creates an automated visual regression test that would take hours to set up with traditional
testing tools.

Form Automation and Clicking

Claude can interact with web page elements: filling in form fields, clicking buttons, selecting
dropdown options, checking checkboxes. This enables automation of web-based workflows that
do not have APIs - submitting a form to a system that only has a web interface, for example, or
navigating a multi-step web process.
Important caveat: use form automation only on systems you own or have explicit permission to
automate. Many websites prohibit automated interactions in their terms of service. Always
verify you have appropriate authorization before automating interactions with a third-party
website.

Use Cases
Amazon product research: navigate to Amazon, search for products in your category, extract
pricing, ratings, review counts, and key features for the top 20 results, and save the data to a
spreadsheet. Competitor analysis: visit each competitor's website, extract their pricing page
content, feature list, and key marketing messages, and generate a comparison table. Lead
scraping from industry directories: navigate to a directory, extract company names, contact
information, and business descriptions, and save to a CRM-compatible format.

PRO TIP: Combine the Chrome DevTools MCP with a skill for powerful repeatable research
workflows. Test and refine your research process interactively with the MCP, then write a skill
that codifies the proven process so future research sessions can be launched with a single
trigger phrase.

EXERCISE: Use Chrome DevTools MCP to Research 3 Products on Amazon

64.​Ensure the Chrome DevTools MCP is installed and connected.

65.​Start a Claude Code session and type: 'Navigate to Amazon and search for [product category
relevant to your work or interest]. For the top 3 results, extract: product name, price, rating,
number of reviews, and the first 3 bullet points from the product description. Format the
results as a comparison table.'
66.​Review the output. Ask Claude to identify which product has the best value-to-rating ratio.
67.​Ask Claude to navigate to the highest-rated product and take a screenshot of the customer
reviews section.
68.​Ask Claude to summarize the 3 most common complaints from the reviews.

Simple Tech Skills - The Complete Claude Code Workbook | Page 39

 Simple Tech Skills | [Link]

69.​Reflect: how long would this research have taken you manually? How could you use this
capability in your actual work?

Simple Tech Skills - The Complete Claude Code Workbook | Page 40

 Simple Tech Skills | [Link]

Module 13: Hooks

What Are Hooks?

Hooks are one of the more advanced Claude Code features, and one that opens up a category of
meta-automation that most users never discover. A hook is a script that runs automatically
before or after every tool call that Claude makes. Whenever Claude reads a file, writes a file,
runs a command, or calls an API - a hook can execute a script in response to that event.
The power of hooks is that they let you automate things that happen around Claude's actions,
not just within them. Log every file Claude edits. Run tests automatically after every code
change. Back up files before Claude overwrites them. Send a notification when a long-running
task completes. These meta-layer automations transform Claude Code from a conversational
tool into an integrated part of your development infrastructure.

KEY TAKEAWAY: Hooks are scripts that run around Claude's actions. Pre-tool hooks run before
an action; post-tool hooks run after. Use them to add automated logging, testing, backups,
and notifications to every Claude Code session.

Pre-Tool and Post-Tool Hooks

Pre-tool hooks execute before Claude performs a tool call. They receive information about what
Claude is about to do - which tool, what parameters, what file is about to be edited - and can log
that information, check conditions, or even modify the parameters before the tool executes.
Post-tool hooks execute after Claude performs a tool call. They receive both what Claude did and
the result of the action.
The most common use case for pre-tool hooks is auditing: log what Claude is about to do before
it does it. The most common use case for post-tool hooks is validation: check that the action
produced the expected result, run tests to verify the changed code still works, or trigger a
downstream process based on what just happened.

Writing a Hook Script

Hook scripts are written in any language your system can execute - shell scripts, Python, [Link],
etc. They receive context about the current tool call through environment variables or stdin,
depending on the hook type. A basic pre-tool hook that logs every file edit looks like this:

EXAMPLE HOOK SCRIPT (shell): #!/bin/bash​

# [Link] - logs every file edit​
TOOL_NAME="$CLAUDE_TOOL_NAME"​
FILE_PATH="$CLAUDE_TOOL_FILE"​
TIMESTAMP=$(date +"%Y-%m-%d %H:%M:%S")​
echo "[$TIMESTAMP] $TOOL_NAME: $FILE_PATH" >> ~/.claude/[Link]

Simple Tech Skills - The Complete Claude Code Workbook | Page 41

 Simple Tech Skills | [Link]

To register a hook, you add it to your Claude configuration file under the hooks section,
specifying whether it is a pre or post hook and which tool(s) it applies to. You can apply a hook to
all tools (using a wildcard) or only to specific ones (file writes, command executions, etc.).

Use Cases for Hooks

Auto-logging is the most universal use case: keep a running log of everything Claude does in
every session, stored in a file you can review later. This creates an audit trail and also helps you
identify patterns in how you use Claude Code that can inform process improvements.
Auto-backup creates a copy of every file before Claude overwrites it. This is a safety net that
goes beyond git - a timestamped backup directory where you can find any version of any file
from any point in the current session.
Auto-testing runs your test suite after every file edit, surfacing broken tests immediately rather
than discovering them later. The hook checks if the changed file has corresponding tests, runs
those tests, and appends the results to the session log.
Auto-notification sends a message (via email, SMS, or Slack) when long-running tasks complete.
If you ask Claude to process a large dataset, the post-tool hook can notify you when the
processing is done so you do not have to monitor the session.

EXERCISE: Write a Simple Pre-Tool Hook That Logs Every File Edit

70.​Create a new file at ~/.claude/hooks/[Link] (or a .py file if you prefer Python).
71.​Write a script that: captures the tool name and file path from environment variables,
formats a log entry with a timestamp, and appends the entry to a log file at
~/.claude/[Link].
72.​Register the hook in your Claude configuration file as a pre-tool hook for file write
operations.
73.​Start a Claude Code session and make a few file edits.
74.​Open ~/.claude/[Link] and verify that the edits were logged correctly.
75.​Extend the hook to also log the first 5 lines of any file Claude creates for the first time.

Simple Tech Skills - The Complete Claude Code Workbook | Page 42

 Simple Tech Skills | [Link]

Module 14: Scaling and Deployment

From Local to Production

Building something on your laptop is very different from running it reliably for real users or
automating it to run on a schedule without your involvement. The gap between it works on my
machine and it runs reliably in production is where many projects stall. Claude Code can help
you bridge that gap - not just by writing deployment code, but by guiding you through the
architecture decisions that make a local project production-ready.
The key questions to answer before moving from local to production: Where will the code run?
(A server, a cloud function, a scheduled job, a CI/CD pipeline?) Who or what will trigger it? (A
user visiting a URL, a webhook from another service, a cron schedule, a manual run?) What
dependencies does it have that need to be available in the production environment? What
happens when something goes wrong?

Hosting Options

Netlify
Netlify is the fastest path to deploying static websites and serverless functions. For
frontend-heavy projects - marketing sites, landing pages, documentation sites, simple web apps
with JavaScript frontends - Netlify is the gold standard for ease of use. Git-connected
deployments mean every push automatically rebuilds and redeploys. The free tier is generous
for personal and small commercial projects.

Vercel
Vercel is Netlify's primary competitor and is particularly optimized for [Link] and other
React-based frameworks. If you are building React applications, Vercel's deep [Link] integration
makes deployment and configuration significantly easier than alternatives. Like Netlify, Vercel
connects to GitHub and redeploys on every push.

Modal
Modal is the hosting platform of choice for Python-based AI workloads and automations. If you
are running Claude Code-generated Python scripts - data processing pipelines, AI model
inference, scheduled automations - Modal provides a serverless Python environment that scales
automatically and is significantly easier to configure than AWS Lambda or Google Cloud
Functions.
Modal's killer feature for Claude Code users is its cron scheduling: you can deploy a Python
function and schedule it to run every hour, day, or week with a single decorator. Combined with
Claude Code-generated automation scripts, Modal enables a workflow where Claude writes the
automation and Modal runs it on schedule without any server management on your part.

Simple Tech Skills - The Complete Claude Code Workbook | Page 43

 Simple Tech Skills | [Link]

GitHub Actions Integration

GitHub Actions is a CI/CD platform built into GitHub that runs automated workflows whenever
you push code. It is the industry standard for automating testing, building, and deploying code.
Claude Code can write GitHub Actions workflow files (YAML files in .github/workflows/) that
define exactly what should happen whenever you push to your repository.
Common GitHub Actions workflows Claude can help you build: run your test suite on every pull
request, build and deploy your application when code is merged to main, run code quality
checks (linting, type checking) on every commit, generate and publish documentation
automatically, and notify your team in Slack when deployments succeed or fail.

Webhooks for Automation

A webhook is an HTTP endpoint that receives data from an external service when something
happens. When a new customer signs up in Stripe, Stripe sends a POST request to your webhook
URL. When a form is submitted on your website, the form processor sends the data to your
webhook. When a GitHub pull request is opened, GitHub sends event data to your configured
webhook URL.
Claude Code can build webhook handlers that receive these events and take appropriate actions:
send a welcome email when a new customer signs up, create a task in ClickUp when a bug is
reported, post a message in Slack when a deployment finishes. Webhooks are the connective
tissue of modern SaaS automation, and Claude Code makes building them straightforward.

Claude Code on the Web

Anthropic's API allows you to run Claude programmatically, which means you can build
applications that use Claude's capabilities as a backend service. A web app where users submit
text and Claude analyzes it, a chatbot that answers questions about your product, a content
generation pipeline that produces social posts on demand - all of these are Claude-powered web
applications that Claude Code can help you build and deploy.
The API pricing model (pay per token) is important to understand before building user-facing
Claude-powered applications. A high-traffic application could generate significant API costs.
Design your application to be token-efficient: cache responses where appropriate, use lighter
models for simple tasks, and implement rate limiting to prevent abuse.

Cost Management at Scale

As Claude Code becomes more central to your workflow, the costs can grow. The key levers for
managing costs: model selection (Sonnet costs roughly 5x less than Opus for most tasks), prompt
optimization (high information density language reduces the tokens needed to convey
instructions), caching (Claude's prompt caching feature can dramatically reduce costs for
repeated system prompts), and architecture design (batch processing instead of one-at-a-time
processing, asynchronous workflows instead of synchronous ones).

Simple Tech Skills - The Complete Claude Code Workbook | Page 44

 Simple Tech Skills | [Link]

PRO TIP: Set up cost alerts in your Anthropic console. Define a daily budget limit and
configure an email notification if you exceed it. This prevents surprise bills from runaway
automated processes and keeps you informed about your usage trends.

EXERCISE: Deploy an Automation to Run on a Schedule

76.​Choose a simple automation: a daily news summary, a weekly expense report, a nightly data
backup, or any process that makes sense to run on a schedule.
77.​Build the automation script with Claude Code: 'Build a Python script that [does your
automation]. It should be designed to run as a scheduled job with no human interaction
required.'
78.​Create a Modal account (free tier) and ask Claude to write the Modal deployment
configuration for the script.
79.​Deploy the script to Modal and trigger it manually to verify it works.
80.​Configure the schedule so it runs automatically (daily, weekly, or at whatever interval makes
sense).
81.​Monitor the first three automated runs. Note any issues and iterate on the script.

Simple Tech Skills - The Complete Claude Code Workbook | Page 45

 Simple Tech Skills | [Link]

Module 15: Advanced Workflows and Real-World Systems

The Proposal Generator Example

One of the most compelling demonstrations of what Claude Code can build is a full-stack
proposal generation application. The workflow: a user fills in a form with client name, project
type, timeline, and budget parameters. The backend sends this information to Claude via the
Anthropic API. Claude generates a customized, professionally written proposal. The proposal is
formatted as a PDF and emailed to both the user and the client.
Building this with Claude Code typically takes one focused working session of 2-3 hours. The
components: a React frontend with the input form, a [Link] or Python backend that handles
form submissions and Claude API calls, a PDF generation library (like pdfkit or puppeteer), an
email service integration (SendGrid or Resend), and deployment configuration for a platform like
Vercel or Railway. Each component is built and tested individually, then integrated into the
complete system.

KEY TAKEAWAY: Complex full-stack applications that would take a traditional development
team days or weeks to build can be completed by a single person using Claude Code in a
matter of hours. The key is breaking the work into clear components and building them
systematically.

The Email Labeling System

The email labeling system is a real-world automation that demonstrates the power of MCP
integrations in a production workflow. Using the Gmail MCP, Claude reads new emails from your
inbox, analyzes their content and sender, applies appropriate labels (client emails, vendor
communications, newsletters, urgent items, action required, etc.), and archives processed emails
to keep your inbox clean.
What makes this system particularly powerful is that the labeling logic improves over time. As
you give Claude feedback on mislabeled emails and add new categories, you can update the skill
or prompt that drives the labeling, and the improved logic is applied to all future emails. Over
several weeks of iteration, the system reaches a level of accuracy where it requires minimal
supervision.

The Lead Generation and Website Personalizer

The lead generation and website personalizer is a more complex system that combines web
scraping, AI analysis, and dynamic content generation. The workflow: collect a list of prospect
companies (from a conference attendee list or a curated database), use the Chrome DevTools
MCP to visit each company's website and extract key information about their business, use
Claude to analyze that information and identify how your product or service solves their specific
problems, generate a personalized version of your landing page for each prospect that speaks
directly to their situation, and send the personalized link to each prospect.

Simple Tech Skills - The Complete Claude Code Workbook | Page 46

 Simple Tech Skills | [Link]

This level of personalization would be prohibitively expensive and time-consuming to do

manually at scale. With Claude Code, it can be automated to run for hundreds of prospects with
minimal human intervention.

Building Internal Tools vs Public-Facing Apps

Claude Code is excellent at both internal tools (used only by you and your team) and
public-facing applications (used by external users). The development and deployment
considerations differ significantly between the two, and understanding those differences will
help you prioritize where to start.
Internal tools can be built and deployed faster because the security and reliability requirements
are lower. If an internal tool goes down, the impact is limited to your team. If a public-facing
application goes down, it affects your customers and your reputation. Start with internal tools to
build your skills and confidence, then apply what you learn to public-facing applications.

When NOT to Use Claude Code

As powerful as Claude Code is, there are situations where it is not the right tool.
Ultra-high-security applications - systems that handle financial transactions, medical records, or
classified information - require the kind of expert security review that goes beyond what Claude
Code can reliably provide independently. These applications need professional security audits,
penetration testing, and compliance verification.
Extremely performance-critical systems where every millisecond matters may need fine-tuned
optimization by specialists. Real-time systems (trading platforms, control systems for physical
infrastructure) where bugs could have immediate catastrophic consequences require more
rigorous development and testing processes than a Claude Code-driven workflow typically
provides.
The principle: use Claude Code where the cost of mistakes is recoverable. Use expert human
judgment where the cost of mistakes is not. Claude Code dramatically lowers the cost and time
of building most things; it does not eliminate the need for expert review in high-stakes domains.

The Business Case: ROI Calculation

Calculating the genuine ROI of Claude Code is straightforward. Identify a project you have been
putting off because you did not have developer resources. Estimate what it would cost to hire a
freelancer or agency to build it. Estimate how long it would take you to build it with Claude Code
(typically 10-20% of the traditional development time). Compare the cost of your time (even at a
generous hourly rate) plus Claude Code subscription costs to the freelancer/agency quote.
In most cases, the math is overwhelming: a project that would cost $5,000-$15,000 in
development services can be built with Claude Code for $50-$200 in API/subscription costs plus
20-40 hours of your time. Even valuing your time at $150/hour, that is a $3,000-$6,000
investment versus $15,000 - a 60-80% cost reduction. And because you built it yourself, you
understand it completely and can maintain and improve it going forward.

Simple Tech Skills - The Complete Claude Code Workbook | Page 47

 Simple Tech Skills | [Link]

Parallel Execution Patterns

The most advanced Claude Code workflows use parallel execution - running 10 or more Claude
agents simultaneously on different parts of a large task. This requires careful orchestration: the
primary agent divides the work into independent subtasks, spawns a subagent for each subtask,
monitors their progress, and synthesizes their results.
Parallel execution is appropriate when the task can be genuinely divided into independent
workstreams (tasks that do not depend on each other's output). Content generation at scale is a
perfect example: generating 50 product descriptions simultaneously, researching 20 companies
in parallel, or processing 100 documents concurrently. Tasks that are inherently sequential -
where step B depends on the output of step A - cannot be meaningfully parallelized.

PRO TIP: When running parallel executions, use a consistent output format for all subagents
so the primary agent can process the results programmatically. A subagent that returns
structured JSON is far easier to synthesize than one that returns flowing prose. Define the
output schema explicitly in your Task tool instructions.

WANT TO GO FURTHER? You have completed the core Claude Code curriculum. Modules
16-21 cover Git, full SaaS apps, content automation, Claude Projects, Co-Work, and building
your complete AI business stack. The Academy pairs all of this with structured courses and
mentorship to help you implement faster. Join at [Link]/academy

Simple Tech Skills - The Complete Claude Code Workbook | Page 48

 Simple Tech Skills | [Link]

Module 16: Version Control with Git and GitHub

Why Every Builder Needs Version Control

Version control is the safety net that makes bold experimentation possible. When you are
building with Claude Code, things move fast - Claude might make dozens of file changes in a
single session. Without version control, a single wrong move can erase hours of work with no
way to recover. Git is the industry-standard version control system that records every change you
make to your project, lets you roll back to any previous state, and keeps a complete history of
what changed and when.
GitHub is the cloud storage platform that hosts your git repository online. Think of git as your
project's detailed change log running locally on your machine, and GitHub as the secure cloud
backup that ensures your work is never lost even if your laptop dies. The combination is so
fundamental to modern software development that Claude Code assumes you are using it - and
often initializes a git repository automatically when you start a new project.

KEY TAKEAWAY: Commit your code to git before any major Claude Code session. If something
goes wrong, you can always roll back to the last commit. This safety net is what allows you to
let Claude work autonomously without fear.

The Essential Git Vocabulary

Repository (repo): your project folder with git tracking enabled. Commit: a saved snapshot of
your project at a specific point in time - like pressing Save on your entire project. Branch: a
parallel copy of your project for experimenting without affecting the main version. Push: sending
your local commits up to GitHub. Pull: getting the latest changes from GitHub down to your local
machine.
Stage: preparing files to be included in a commit. Before you commit, you choose which files to
include in the snapshot. Remote: the GitHub copy of your repository. Your local machine has one
copy; GitHub has another. They stay in sync through push and pull. Claude Code is git-aware and
will suggest commit points, reference history when debugging, and often auto-initialize
repositories for new projects.

Installing Git and Creating Your First Repository

Git comes pre-installed on most Mac and Linux systems. On Windows, download from
[Link] and run the installer. Verify installation: open your terminal and type git --version. If
you see a version number, you are ready. Create a GitHub account at [Link] if you do not
have one. On GitHub, click the plus icon, select New Repository, give it a name, set it to Private,
and click Create Repository.
In your terminal, navigate to your project folder and run: git init. This starts tracking that folder.
Then connect to GitHub: git remote add origin [the URL GitHub shows you on the repository

Simple Tech Skills - The Complete Claude Code Workbook | Page 49

 Simple Tech Skills | [Link]

page]. GitHub provides the exact commands you need to copy and paste - you do not need to
memorize them.

The Daily Commit Workflow

Three commands you will use constantly: git add -A (stage all changed files), git commit -m 'your
message here' (create a snapshot with a description), git push (send it to GitHub). Run them in
sequence after every meaningful chunk of work. The shorthand version: git add -A && git
commit -m 'description' && git push. This entire sequence takes about 10 seconds.
Write commit messages that describe what changed and why, not just what. 'Fix bug' is useless
in six months. 'Fix login validation - emails with plus signs were being incorrectly rejected' is
searchable and informative. Commit after every major Claude Code session so you always have a
recent restore point.

PRO TIP: Commit before every major autonomous Claude Code task. The sequence: git add -A
&& git commit -m 'pre-session backup' takes 10 seconds. Then if something goes wrong, git
restore . brings every file back to the last committed state instantly. This 10-second habit has
saved countless hours of rebuilding.

Rolling Back When Things Go Wrong

The most valuable recovery commands: git diff shows you what changed since the last commit.
git restore . discards ALL uncommitted changes and returns every file to its last committed state.
git log shows your commit history with hashes - find the commit you want. git checkout
[commit-hash] takes you to that exact point in history.
A practical safety rule: if you are about to let Claude make large autonomous changes, always
commit first. After the session, if the output looks wrong, git restore . is your reset button. You
lose the bad changes and keep all previous work intact. This is the superpower that makes
aggressive autonomous use of Claude Code safe.

EXERCISE: Set Up Git and Push Your First Project to GitHub

82.​Verify git is installed: open your terminal and type git --version. Install from [Link] if
needed. Create a GitHub account if you do not have one.
83.​Navigate to a project folder from an earlier module exercise. Run git init to start tracking it.
84.​Create a new private repository on GitHub. Copy the repository URL it provides.
85.​Connect your local repo to GitHub: git remote add origin [URL]. Verify: git remote -v.
86.​Make your first commit and push: git add -A && git commit -m "Initial commit" && git push
-u origin main.
87.​Refresh your GitHub repository page - your files should appear. Write the URL here and note:
how will having this backup change how you work with Claude Code?

Simple Tech Skills - The Complete Claude Code Workbook | Page 50

 Simple Tech Skills | [Link]

Module 17: Building a Full-Stack SaaS App

The 5-Question SaaS Planning Framework

Before writing a single line of code, answer five questions that define your entire product. This
exercise takes 15-30 minutes but saves days of rebuilding features that do not fit together.
Claude Code builds exactly what you specify - the quality of your plan directly determines the
quality of what gets built. Skipping this step is the single most common reason non-technical
builders end up with apps that do not quite do what they wanted.
Question 1: Who is it for? Be specific - not 'small business owners' but 'freelance graphic
designers who manage 5-15 clients simultaneously.' Question 2: What specific problem does it
solve? Name the exact pain point. Question 3: What are the 3-5 core MVP features? Keep it
ruthlessly small. Question 4: What is the pricing model? Monthly subscription is easiest to start -
avoid annual plans until you have validated monthly works. Question 5: What is it called? The
name affects domain availability, SEO, and user recall.

PRICING PRINCIPLE: Start with monthly-only pricing. Annual subscriptions create long-term
commitment risk if you need to pivot. Monthly is easier for both you and your customers to
walk away from - which counterintuitively builds more trust in your product.

Choosing Your Tech Stack

Tech stack selection is one of the most important decisions in app development, and where
non-technical builders often feel most lost. The decision framework: choose technologies that AI
has the most training data on. Claude Code builds faster and makes fewer mistakes with
widely-documented tools than with obscure ones. This is why [Link] is preferred over newer
frameworks - not because it is objectively better, but because AI knows it far more deeply.
The recommended starter stack: [Link] with React for the frontend (most widely used React
framework, excellent AI compatibility), Tailwind CSS for styling (utility-first, fast, AI-friendly),
Supabase or Convex for backend and database (easy dashboard visibility, real-time features,
great documentation), Clerk for authentication (scales to thousands of users, handles email
verification and OAuth automatically), Polar for international payments (handles taxes in 100+
countries as a merchant of record), Stripe for US-focused payments (maximum flexibility and
integrations), Vercel for deployment (built for [Link], auto-deploys from GitHub).

Writing the Perfect First Prompt

The first prompt you give Claude Code for a new app determines the architectural quality of
everything that follows. A well-structured first prompt produces code that is consistent
throughout. A poorly structured one produces code you will spend hours refactoring. Invest 30
minutes in the first prompt and save days of cleanup.
An effective first prompt includes: the exact tech stack (name every library), a one-paragraph
app description with who it is for and what problem it solves, the navigation structure and page

Simple Tech Skills - The Complete Claude Code Workbook | Page 51

 Simple Tech Skills | [Link]

layout, a list of each page and what it does, the user journey from signup through the core
action, feature descriptions in enough detail to implement, any API integrations needed, design
direction (minimal, clean, specific colors or fonts), and one critical addition: ask Claude to create
a [Link] file with the full implementation broken into phases.

PRO TIP: Always end your first prompt with: 'Before building anything, create a
[Link] file in the repository with the complete implementation plan. List every file
you will create, every database table, every API endpoint, and every environment variable
needed.' This document saves thousands of tokens in every future session by giving Claude
immediate project context.

Authentication, Database, and Payments Setup

Authentication with Clerk: create a Clerk account, create a new application, choose email and
password authentication to start (add Google OAuth later), copy the API keys into your .[Link]
file, and let Claude add the Clerk middleware to your app. The most common authentication bug
in production is the webhook URL not matching what Clerk expects - always check whether your
production URL uses www or not, and ensure your webhook URL matches exactly.
Database setup with Supabase: create a project, copy the URL and anon key into your
environment variables, and let Claude write the database schema and API code. Convex is the
alternative: also easy to set up, with real-time built in. For payments: Polar handles international
tax automatically (choose if selling globally), Stripe offers maximum flexibility and the best
developer experience (choose if primarily US/EU and comfortable with tax compliance).

Testing, Debugging, and Security Review

A systematic debugging approach saves hours. When something does not work: check the
browser console first (F12, look at Console tab for error messages), then check your service
dashboards (Clerk dashboard for auth issues, Supabase or Convex dashboard for database
issues, Vercel logs for deployment issues). Then give Claude the exact error message with
context: 'When [specific action], I get [exact error message] in [specific file/line]. Investigate and
fix this.'
Before deploying to production, always ask Claude to run a security review: 'Review this
codebase for security vulnerabilities before we deploy. Look for: authorization issues in API
endpoints, unvalidated user inputs, exposed API keys, missing rate limiting, and any OWASP top
10 concerns.' Claude will identify and fix issues you would not know to look for. This is
non-negotiable for any app that handles user data or payments.

Production Deployment Checklist

Before going live: all environment variables added to Vercel (or your hosting platform) - not just
local .[Link]. Clerk webhook URL updated to production URL (not localhost). Polar or Stripe
switched from sandbox to production mode. Database connection pointing to production

Simple Tech Skills - The Complete Claude Code Workbook | Page 52

 Simple Tech Skills | [Link]

instance. Security review complete. GitHub repository up to date with final code. Custom
domain connected if applicable.
After deploying: test the entire user journey in an incognito window. Sign up with a real email.
Verify the user appears in your Clerk dashboard and database. Test the payment flow with a real
card (or sandbox card in test mode). Check that all webhooks are firing by reviewing your service
dashboards. Deployment bugs are normal - budget time for them. The most common: wrong
environment variables, webhook URL mismatches, and CSP (Content Security Policy) blocking
third-party services.

EXERCISE: Plan Your SaaS App with the 5-Question Framework

88.​Answer the 5 planning questions for an app you have been thinking about building. Write
your answers specifically - avoid vague descriptions. Use the notes box below.
89.​Open Claude Code and share your 5-question answers as context. Ask: 'Based on this app
concept, recommend a tech stack and explain why each component fits this specific use
case.'
90.​Ask Claude to write a first prompt template for your app that includes all the components
covered in this module - tech stack, app description, page list, user journey, design direction,
and a request for [Link].
91.​Review the generated first prompt. Add details Claude missed about your specific features
and edge cases.
92.​Optional: start a new Claude Code session with your polished first prompt in Plan Mode
(Shift+Tab before submitting). Review the complete plan Claude generates. Count how many
files and tables it plans to create.

Simple Tech Skills - The Complete Claude Code Workbook | Page 53

 Simple Tech Skills | [Link]

Module 18: Content Automation and Social Media

The Content Machine Concept

The most time-consuming part of content marketing is not the ideas - it is the execution. Writing
platform-specific posts, adjusting tone for each audience, generating visuals, scheduling at
optimal times, and tracking what works. The content machine concept replaces manual
execution with a system: you provide the input (a topic, a YouTube URL, an article), and Claude
handles everything else - researching, writing platform-adapted copy, generating visuals, and
scheduling.
What makes this different from just asking an AI to write posts is the structure. A well-built
content machine has brand voice baked in (so it sounds like you), quality gates that catch errors
before publishing, platform-specific formatting built into the workflow, and parallel publishing
that posts to multiple platforms simultaneously. Building this system takes a few hours; the
return compounds every week for as long as you use it.

KEY TAKEAWAY: One input. Multiple platforms. Consistent brand voice. Automatic quality
checks. This is what separates a content machine from a manual posting workflow. Build it
once with skills and hooks, then let it run.

Building Your First Posting Skill

A posting skill is a Claude Code skill file that encapsulates your entire content creation and
publishing workflow. When you trigger the skill, Claude researches the topic, generates
platform-adapted posts, creates a visual if needed, and publishes - all from a single command.
The skill file specifies: what inputs it accepts (topic, URL, draft text), what platforms to post to,
which API to use for publishing (tools like Blotato, Buffer, or Later), authentication details (stored
in [Link] - never hardcoded), and scheduling options (publish now, specific time, or
next available slot).
Start minimal: one platform, text only, publish immediately. Get that working and tested before
adding visuals, multiple platforms, and scheduling. Each addition is a new layer on a working
foundation. Always end your skill prompts with: 'Ask me clarifying questions one at a time until
you are 95% confident you have everything you need.' This forces Claude to surface the blind
spots you did not know to address.

Adding Brand Voice with Writing Samples

Generic AI writing is immediately recognizable: the same structure, the same cautious hedging,
the same transition phrases. Brand voice training replaces these patterns with your specific style.
The most effective method: provide actual writing samples - posts you have written that
performed well, or posts from creators whose style resonates with you.
In your skill file, add a brand voice section with three to five example posts per platform. For
LinkedIn, Justin Welsh's format (educational, narrative, personal lesson) is widely admired. For

Simple Tech Skills - The Complete Claude Code Workbook | Page 54

 Simple Tech Skills | [Link]

Twitter/X, short punchy posts backed by data or contrarian takes perform consistently. For
Instagram, problem/solution or lifestyle formats tend to work well. Include both what to do AND
what to avoid: list the AI writing cliches to eliminate (starting with 'Absolutely', excessive em
dashes, fake enthusiasm, generic conclusions).

PRO TIP: Your own best-performing posts produce dramatically better results than any
influencer's samples. If you have 10 posts that got strong engagement, paste them as
examples in your skill file. Claude will match your specific word choices, sentence rhythm, and
topic angles - creating output that sounds authentically like you, not like an AI impression of
someone else.

Quality Gates with Hooks

Quality gates are automated checks that run before any post is published. Implemented as
pre-tool hooks (covered in Module 13), they run automatically without requiring you to think
about them. The hook script checks a list of rules and blocks the publish action if any rule fails,
returning a clear explanation of what needs to change.
Essential quality gates: Twitter/X character limit check (280 characters maximum - block anything
over), platform media requirements (Instagram requires an image or video), banned phrase
detection (your list of AI cliches to eliminate), em dash removal or replacement (a strong AI
writing signal - replace with commas or restructure), and URL validation (confirm links resolve
before publishing). Advanced quality gates: an LLM scoring step that rates the post for likely
engagement and rewrites automatically if below your threshold (e.g., below 7 out of 10 score).
Adding a new rule to a quality gate hook takes about two minutes.

Multi-Platform Publishing with Sub-Agents

Publishing to multiple platforms simultaneously requires adapting content for each platform's
requirements and audience expectations. What works as a LinkedIn post (long-form, narrative,
800-1200 words) needs complete rewriting for Twitter (punchy, under 280 characters) and
Instagram (visual-focused, conversational, hashtag-friendly). Same core idea, multiple formats.
Sub-agents make this parallel. Update your skill to spawn one sub-agent per platform when the
'all platforms' option is selected. Each sub-agent receives the core content plus platform-specific
formatting instructions, adapts the copy, runs quality gates, and publishes independently. All
platforms go live within seconds of each other. For a weekly content plan with five posts across
six platforms, this reduces publishing time from hours to minutes.

Planning a Full Week of Content

A weekly planning skill takes one input (a topic, a YouTube URL, or a key theme) and outputs a
complete week of content ready for review. The workflow: Claude extracts themes from the
input, generates ten angles on the topic, selects five for weekdays, writes platform-specific posts
for each angle, generates visuals for each day, compiles everything into a [Link] file for
your review, waits for your approval, then schedules using your platform's pre-set time slots.

Simple Tech Skills - The Complete Claude Code Workbook | Page 55

 Simple Tech Skills | [Link]

The human review step is non-negotiable. Always review [Link] in your IDE before
anything is scheduled. Edit directly in the file, or ask Claude to revise specific days. A practical tip
from experienced content operators: the review session is also where you should be thinking
about what angle to amplify next week - the planning skill generates raw material, you add
strategic judgment.

EXERCISE: Build a Social Media Post Skill

93.​Choose one platform to start with (LinkedIn or Twitter/X recommended for beginners).
94.​Create a new skill file at .claude/skills/post/[Link]. Write the front matter (name,
description, triggers) and include: what inputs the skill accepts, your platform choice, and
three example posts that represent the style you want.
95.​Start a new Claude Code session and trigger the skill: 'I need to post about [a topic relevant
to your work]. Use the post skill.' Review the output.
96.​Give specific feedback on what matched your voice and what did not. Ask Claude to revise
with the corrections.
97.​Add one quality gate: ask Claude to add a check that blocks publishing if the post contains
any of three AI cliche phrases you identify (e.g., "Absolutely!", "Let's dive in", excessive em
dashes).
98.​Write in your notes: what would your content output look like if this skill ran every weekday
for a month? What would you do with the time saved?

Simple Tech Skills - The Complete Claude Code Workbook | Page 56

 Simple Tech Skills | [Link]

Module 19: Claude Projects for Non-Coders

What Claude Projects Are

Claude Projects (available in the Claude web interface and desktop app) are persistent custom AI
assistants that you configure once and return to repeatedly. Unlike a standard Claude
conversation that starts fresh every time, a Project remembers your preferences, maintains
context about your work, and comes pre-loaded with the files and instructions you configured.
Think of a Project as a specialized AI team member who never forgets your briefing.
Projects are distinct from Claude Code skills. Skills are automation scripts that execute multi-step
workflows inside a Claude Code session. Projects are persistent, conversational assistants you
open and chat with - best for tasks that require judgment, iteration, and creative collaboration
rather than automated execution. The right mental model: use Projects for thinking-partner
work (writing, strategy, analysis, research); use Claude Code skills for execution work (building,
publishing, processing data).

KEY TAKEAWAY: Claude Projects are your specialized AI team members. A project for drafting
LinkedIn posts. A project for researching competitors. A project for writing client proposals.
Each pre-loaded with the context, examples, and instructions for its specific role - no
re-briefing required.

The Three Components of Every Project

Memory: Claude automatically updates a memory summary after each conversation, preserving
preferences, decisions, and context across sessions. You can also tell Claude to remember
specific things mid-conversation: 'Remember that I always use the Oxford comma and never use
passive voice.' Instructions: standing instructions for this project - what it should do, how it
should communicate, what its job is. Equivalent to a system prompt for this specific assistant.
Files: documents you want Claude to always reference - brand guidelines, past work examples,
company information, style guides, knowledge bases. Files can come from Google Drive, GitHub
repositories, or direct uploads.
The power of this combination: a Client Proposal Project might have instructions to write in your
specific business style, files containing your pricing structure and past successful proposals, and
memory that tracks each client's unique requirements across conversations. When you open the
project and say 'Write a proposal for Acme Corp,' it has everything it needs without you having
to brief it again.

High-Value Projects to Build

Content Creator Project: instructions with your brand voice and content pillars, files with your 10
best-performing posts as style examples, memory for platform preferences and posting cadence.
When you open this project and say 'Write five LinkedIn posts about productivity,' it writes in
your voice using your proven formats. Research Assistant Project: instructions for researching
and summarizing in your preferred format, files with your area-specific knowledge base,

Simple Tech Skills - The Complete Claude Code Workbook | Page 57

 Simple Tech Skills | [Link]

memory for sources you trust and topics to avoid. Proposal Writer Project: instructions for your
proposal structure and pricing philosophy, files with your service offerings and past successful
proposals, memory for each client's situation and history.
Email Drafting Project: instructions for your professional communication style, files with email
templates for common situations, memory for relationships and ongoing conversations. Meeting
Notes Project: instructions for converting rough notes into action items and decisions, files with
your meeting agenda templates, memory for recurring meeting participants and their roles.
Daily Planning Project: instructions for your planning philosophy and work structure, files with
your goal framework, memory for ongoing projects and priorities.

The Project Factory Concept

A Project Factory is a meta-project that creates other projects. You describe what you want to
automate and the factory generates a complete project specification: the instructions, file
structure, and initial setup prompts. This accelerates building a library of specialized assistants
without having to design each one from scratch.
Example prompt for a Project Factory: 'I need a project that helps me write cold email outreach
for my consulting business. I target mid-market B2B companies in the SaaS space. My average
deal size is $15,000 and I close about 20% of conversations I start. Generate the complete
instructions, recommended files to upload, and memory items to set for this project.' The
factory outputs a ready-to-configure project specification.

Skills Inside Claude Projects

Both Claude Projects and Claude Code support skills, but they work slightly differently. In the
Claude web interface, skills appear in Settings under Capabilities. A skill here is a set of standing
instructions that activate automatically when you describe a certain type of task in any
conversation. The most valuable first skill to create: a Skill Creator Skill whose job is to generate
new skill specifications for you on demand.
With the Skill Creator Skill: describe what you want automated, Claude generates the full skill
configuration, you download and upload it to settings, and that capability is permanently
available in every future conversation. This creates a self-reinforcing loop where your AI
capability grows automatically as you identify recurring tasks worth automating.

Organizing and Maintaining Your Projects

As your project library grows, organization matters. Practical tips: bookmark each Project URL in
your browser with a descriptive name that starts with the job (not the content): 'LinkedIn Writer'
not 'Social Media', 'Prospect Research' not 'Research'. Name consistently so autocomplete in
your bookmark bar surfaces the right project fast.
Review your projects monthly. Delete ones unused in 30 days - they add cognitive overhead
without value. Update instructions in heavily-used projects when output starts drifting from
what you want. Share your best project configurations with your team by exporting the
instructions - the fastest way to give team members access to your optimized workflows.

Simple Tech Skills - The Complete Claude Code Workbook | Page 58

 Simple Tech Skills | [Link]

EXERCISE: Build Your First Specialized Claude Project

99.​Identify the single most repetitive knowledge task in your work - drafting a specific
document type, researching a specific topic, or analyzing a specific type of data.
100.​ Open [Link] and create a new Project. Name it after the job it does (not the content
it handles).
101.​ Write the Project instructions: describe exactly what it does, the output format you
want, tone and style requirements, and anything it should never do.
102.​ Upload two to five example documents or outputs that represent excellent results for
this task - this is the most important training signal.
103.​ Run the project on a real task from this week. Give it detailed, specific feedback on what
was right and what needed changing. Note what memory items you told it to remember.
104.​ Bookmark the Project URL. Write: what would it mean for your weekly capacity if this
project handled this task reliably on its own?

Simple Tech Skills - The Complete Claude Code Workbook | Page 59

 Simple Tech Skills | [Link]

Module 20: Claude Co-Work and Desktop Automation

What Claude Co-Work Is

Claude Co-Work (available in the Claude Desktop app on the Max plan) is a desktop AI agent that
can see and control your computer. While Claude Code reads and writes files inside a project
directory, Co-Work operates at the level of your entire computer: it can open applications,
browse websites, create and organize files anywhere on your system, fill out forms, navigate
complex multi-step workflows across multiple apps, and complete tasks that previously required
manual clicking through a long process.
The mental model: Co-Work is Claude Code's less technical sibling. Claude Code is designed for
developers working in code repositories. Co-Work is designed for knowledge workers who want
to automate office tasks without any technical setup. You describe what you want in plain
English. Co-Work builds a checklist of subtasks, executes each step, checks its own work, fixes
mistakes, and shows you what it accomplished. No code required.

KEY TAKEAWAY: Co-Work is your AI office assistant for tasks that live outside a code project -
organizing files, creating documents, researching across websites, filling forms, managing data.
If you can do it on your computer, Co-Work can learn to do it for you.

Setting Up and Testing Co-Work

Requirements: the Max Plan (5x or 20x usage limits) and the Claude Desktop app (downloadable
from [Link]). Inside the desktop app, switch from Chat to the Co-Work tab at the top. On first
launch, Co-Work asks you to select a working folder - choose a dedicated folder separate from
any code repositories. Co-Work creates and modifies files here by default.
Before giving Co-Work significant tasks, spend 15 minutes testing on low-stakes work: organize a
small folder of files, create a simple spreadsheet, draft a short document. This builds your
intuition for how to phrase requests and what to expect. Co-Work is powerful but not perfect -
understanding its capabilities and limits before relying on it for important work prevents
surprises and frustration.

High-Value Use Cases

File and folder organization: 'Organize my Downloads folder. Group files by type (images,
documents, videos, applications) and within each type sort by date. Create a table of everything
you organized and save it as [Link].' Co-Work reads the folder, creates the
structure, moves the files, and generates the inventory - a task that typically takes 30-60 minutes
done manually.
Document synthesis from raw material: give Co-Work a folder of meeting notes, research docs,
and rough drafts: 'Write a comprehensive report from all the files in this folder. Organize by
theme, highlight key decisions, and list action items at the end.' Co-Work reads everything,
synthesizes it, and produces a professional document without manual copy-pasting. Research

Simple Tech Skills - The Complete Claude Code Workbook | Page 60

 Simple Tech Skills | [Link]

and content creation: 'Research the top five competitors in my industry. For each, note their
pricing, key features, and main marketing messages. Create a comparison table in Google
Sheets.' Co-Work opens Chrome, visits each site, extracts information, and builds the
spreadsheet.

Pairing Co-Work with Claude Code

Co-Work and Claude Code complement each other. Co-Work excels at broad computer control -
navigating apps, managing files across your system, browser automation. Claude Code excels at
deep technical work - writing code, managing git repositories, running tests, building
applications. The powerful combination: use Claude Code to build and Co-Work to handle the
surrounding workflow.
Example combined workflow: Claude Code builds a web app. Co-Work picks up from there -
opens the HTML files in Chrome for visual review, takes screenshots for documentation, creates
a testing checklist, and uploads the project files to a shared folder for stakeholder review. Or:
Co-Work researches 20 competitors and organizes findings into a structured document, Claude
Code builds a data analysis tool to process that document, and Co-Work publishes the results to
your team's Google Drive.

Multi-Agent Task Management with Vibe Kanban

Vibe Kanban is a visual approach to managing multiple Claude Code agents working in parallel.
Create a simple kanban board - in Trello, Notion, a spreadsheet, or even a text file - with columns
for To Do, In Progress, Review, and Done. Each card is a task for a specific agent: Build landing
page copy, Write email welcome sequence, Create member dashboard.
Launch one Claude Code instance per task, each working independently on its assigned work.
While one agent builds the landing page, another writes the email sequence, a third builds the
dashboard. When each agent finishes, it moves to the Review column. You review each output in
sequence - approve or send back for revision. While you review one task, the sent-back agent is
already revising. This is how you go from solo builder to managing an AI development team that
runs in parallel.

Understanding Co-Work Limitations

Co-Work produces output that is approximately 90% complete - fast, thorough, and mostly
accurate. The remaining 10% often needs your review and minor corrections. This is still a
dramatic time saving over doing the task manually. The right mindset: Co-Work is a capable
assistant who does most of the work and needs occasional specific correction, not a fully
autonomous agent that never makes mistakes.
Current limitations to know: presentation and slide creation is weak (create slides in PowerPoint
or Keynote directly). Complex spreadsheet formatting often needs correction. Websites with
heavy anti-bot security may fail. Deploying code via browser automation is unreliable - use
proper deployment tools for that. Anything requiring nuanced judgment or strategic decisions
still needs human oversight.

Simple Tech Skills - The Complete Claude Code Workbook | Page 61

 Simple Tech Skills | [Link]

PRO TIP: When Co-Work gets something wrong, give specific correction instructions rather
than re-running the same command. 'The spreadsheet put headers in row 3 instead of row 1.
Move everything up so headers are in row 1 and data starts in row 2.' Specificity in corrections
produces specificity in fixes - vague corrections produce vague results.

EXERCISE: Use Co-Work to Automate a Real Office Task

105.​ Open the Claude Desktop app, switch to the Co-Work tab, and select a working folder.
106.​ Choose a real task from your work this week: organizing a messy folder, creating a report
from rough notes, researching a topic and summarizing findings, or creating a structured
spreadsheet from scattered data.
107.​ Describe the task to Co-Work in plain English. Be specific about the output format you
want - a table, a document, a specific folder structure.
108.​ Watch Co-Work work through its checklist. Take notes on where it succeeded and where
it needed correction.
109.​ Give Co-Work specific correction instructions for anything that was not right. Note how
precisely you needed to describe the correction to get accurate results.
110.​ Calculate the time saving: how long would this task have taken manually? How long with
Co-Work including correction time? What is the net saving?

Simple Tech Skills - The Complete Claude Code Workbook | Page 62

 Simple Tech Skills | [Link]

Module 21: Your AI Business Stack and ROI

The Complete AI Stack

Most professionals who get serious about AI productivity end up with a complementary stack of
tools, each covering different types of work. Understanding how these tools fit together - and
which ones you actually need - is more valuable than knowing every feature of any single tool.
The complete stack for a solopreneur or small business: Claude Projects for recurring knowledge
work (writing, research, strategy), Claude Code for building tools, apps, and automations, Claude
Co-Work for computer control and office task automation, MCP servers for real-time integrations
with external services, and Skills for codified workflows that run reliably at scale.
The key principle: start with one tool and add others only when you have a clear use case for the
addition. Trying to implement the entire stack at once creates overwhelm and nothing gets
implemented well. The most common starting points: Claude Projects if your biggest time drain
is writing and research. Claude Code if your biggest time drain is building and automating.
Co-Work if your biggest time drain is office tasks and file management. Pick the one that
addresses your most pressing bottleneck and master it before adding the next.

KEY TAKEAWAY: The value of AI tools compounds. Each automation you build saves time that
gets reinvested in building the next automation. After six months of consistent
implementation, a typical user has 10-15 hours per week of previously manual work running
on autopilot.

Calculating Your Real ROI

ROI calculation for AI tools is straightforward. Step 1: estimate how long the target task takes you
manually per week. Step 2: estimate how long it will take to build the automation (a few hours
for simple skills, a day for complex ones). Step 3: calculate break-even - how many weeks until
time saved exceeds time invested. Step 4: project the annual value at your hourly rate.
Example: you spend 4 hours per week writing social media content. An AI content skill takes 8
hours to build and refine. Break-even: 2 weeks. Annual savings: 4 hours x 48 working weeks =
192 hours. At $100/hour of your time, that is $19,200 of recovered capacity annually - from an
8-hour investment. Most well-chosen automations break even in 2-4 weeks. The ones that do
not (break-even over 12 weeks) are usually automating tasks that are too infrequent or too
variable to be worth structuring as repeatable workflows.

ROI FORMULA: Weekly hours saved / Hours to build = Weeks to break even. If break-even is
less than 8 weeks, build it immediately. 8-12 weeks: probably worth it. Over 12 weeks:
reconsider whether this task is really repeatable enough to automate.

Simple Tech Skills - The Complete Claude Code Workbook | Page 63

 Simple Tech Skills | [Link]

Time Tracking to Find Your 80/20

The 80/20 principle applied to AI implementation: 80% of your potential productivity gains come
from automating 20% of your tasks. The challenge is identifying which 20%. Time tracking for
one week reveals the answer. Most knowledge workers discover they spend far more time on
low-skill, repetitive tasks than they thought. This is not a character flaw - it is the natural result of
doing most things manually without ever examining the aggregate cost.
A simple time tracking system: a spreadsheet with columns for Date, Task, Category, and Minutes
Spent. Log every task throughout the day - honestly. At the end of the week, sort by total time
per category. The highest-time-cost categories are your automation priorities. For each: could
Claude do this reliably? If yes, how long to build? The tasks with high time cost and low build
complexity are your immediate wins. Build those first, recover the time, then reinvest it in the
next automation.

Solopreneur and Small Business Use Cases

For consultants and freelancers: proposal generation (client requirements in, customized
proposal out), project status reports (from project data and meeting notes), invoice creation
(from logged time and project details), and client communication drafts (from rough notes to
polished client-facing documents). A proposal generator alone typically saves 2-4 hours per
proposal for consultants who write multiple proposals per week - often paying for itself in the
first week.
For content creators: the full content machine (one input, multiple platforms, scheduled
automatically), competitor research (regular analysis running on autopilot), email newsletter
drafts (from topic to formatted newsletter), and performance analysis (insights from
engagement data without manual data pulling). For e-commerce: product description generation
at scale, customer inquiry response drafts, inventory management reports, and supplier
communication templates.
For office managers and operations professionals: meeting notes to action items (paste rough
notes, get structured follow-ups), process documentation (interview yourself about a process
and Claude writes the SOP), onboarding materials (generate role-specific guides from your
documentation), vendor comparison reports, and compliance documentation drafts. The
universal pattern: any task you do repeatedly, that follows a consistent structure, and that
primarily involves writing or research is a strong automation candidate.

Building Your Skills Library as a Business Asset

Your skills library - the collection of Claude Code skills, Claude Projects, and hooks you build over
time - is a genuine business asset. It represents codified knowledge about how your business
works, your quality standards, and your communication style. Unlike employees who leave and
take institutional knowledge with them, your skills library is yours permanently and grows more
valuable over time.

Simple Tech Skills - The Complete Claude Code Workbook | Page 64

 Simple Tech Skills | [Link]

Treat it like the asset it is: document each skill with what it does, when to use it, what inputs it
needs, and any known limitations. Review and prune quarterly - delete unused skills, update
ones where your process has changed, add new skills as new recurring tasks emerge. Share skills
with team members through your shared git repository. The most productive Claude Code users
have libraries of 20-50 specialized skills representing months of workflow optimization - a
competitive advantage that compounds daily.

Progressive Automation: The 90-Day Roadmap

Start messy and improve daily. The perfect automation you never build is worth less than the
imperfect automation you build and use today. Month one: set up Claude Code, build one skill
for your most repetitive writing or research task, deploy one internal tool or simple web app.
Month two: add MCP integrations for your most-used external services, build two more skills,
experiment with multi-agent workflows for a complex recurring task. Month three: implement
parallel execution patterns for your highest-volume work, build a weekly content system if
applicable, and audit your entire stack for efficiency - context management, token costs,
redundant workflows.
By month three, most consistent implementers have 8-12 hours per week running on autopilot
and are experiencing the compounding effect: time freed by early automations gets reinvested
in building more sophisticated ones. The gap between practitioners and observers widens every
month. Start now, start imperfectly, improve continuously.

PRO TIP: The single most valuable habit for long-term success: when you find yourself doing
any task manually for the third time, stop and ask whether you should build a skill for it. This
reflexive automation habit is what separates users who plateau at basic use from users who
build genuinely transformative systems. Three times manually, then automate - make that
your rule.

EXERCISE: Build Your Personal AI Automation Roadmap

111.​ Track your time honestly for one full workday. Log every task with minutes spent and a
category label (writing, research, communication, admin, building, meetings).
112.​ Identify your top 3 highest-time-cost categories. For each, answer: could Claude do this
reliably? How long would it take to build the automation?
113.​ Calculate the ROI for your highest-priority automation: (weekly hours saved x hourly rate
x 48 weeks) / hours to build = annual ROI multiple. Any result over 10x is exceptional.
114.​ Write your 30-day implementation plan: what will you automate first (this week), what
by day 14, and what by day 30? Be specific about the exact skill or tool you will build for
each.
115.​ Start building the first item on your roadmap right now. Open Claude Code and describe
the automation you want. A rough 80% solution built today beats a perfect plan never
executed.

Simple Tech Skills - The Complete Claude Code Workbook | Page 65

 Simple Tech Skills | [Link]

116.​ Write: what will you do with the first 5 hours per week you recover from automation?
This is your real motivation - the answer to this question should drive your implementation
urgency.

Simple Tech Skills - The Complete Claude Code Workbook | Page 66

 Simple Tech Skills | [Link]

What You Have Accomplished

If you have worked through this entire workbook - completing the exercises, filling in the notes
boxes, building real things along the way - you have accomplished something genuinely
significant. You have gone from first principles (what is a terminal, what is an IDE) to advanced
workflows (multi-agent parallel execution, MCP integrations, production deployments). That is
not a small journey.
More importantly, you have built something with each module. You have a deployed web page.
You have a [Link] workflow. You have at least one skill in your library. You have run
/context and understand your token economics. You have practiced with Plan Mode and
subagents. These are not theoretical capabilities - they are practical skills you can deploy in your
work tomorrow.
The most valuable thing you have built, though, is the mental model. You now understand how
Claude Code thinks, how context management works, how the permission system is designed,
and why the tool is architected the way it is. That understanding will serve you as Claude Code
continues to evolve - and it will evolve rapidly. The specific commands and features will change;
the mental model you have built will remain useful.

Your Next Steps

The most important next step is to pick one real project from your work and build it. Not a
practice project, not a tutorial example - something you actually need. The commitment of
building something real forces you to solve real problems and learn things no workbook can
anticipate. You will encounter edge cases, unexpected errors, and design decisions that require
your judgment. Working through those challenges is where expertise is forged.
Share what you build. The Claude Code community is generous with knowledge - people share
their [Link] templates, their skills libraries, their deployment configurations, their
workflow patterns. Contributing to that community, even just by describing what you built and
what you learned, creates a virtuous cycle that benefits everyone.
Continue learning. The Claude Code roadmap includes features that will further transform what
is possible: better long-context management, improved multi-agent coordination, more
powerful skill frameworks, tighter IDE integrations. The learners who stay current with the tool's
evolution will maintain a significant advantage.

Simple Tech Skills - The Complete Claude Code Workbook | Page 67

 Simple Tech Skills | [Link]

Ready to Go Further?

Join the Simple Tech Skills Academy

----------------------------------------

>> Structured courses that walk through every module in this workbook step by step

>> Personal mentorship sessions where you bring your real projects and get direct
feedback

>> Live Q&A coaching calls with real project walkthroughs and troubleshooting

>> Private community of builders applying Claude Code in their businesses daily

>> New skill templates, [Link] blueprints, and prompt libraries added monthly

>> Advanced courses on MCP integrations, SaaS deployment, and content automation

>> Early access to new course content as Claude Code evolves

[Link]/academy

Courses. Mentorship. Community. Everything you need to implement - not just

learn.

Simple Tech Skills - The Complete Claude Code Workbook | Page 68