Example Projects and Demos Available for learn-claude-code: A Complete Guide

Yes, the shareAI-lab/learn-claude-code repository ships with twelve progressive Python agent scripts, a full-stack capstone demo, and an interactive Next.js web interface that visualizes every session.

The learn-claude-code project provides a hands-on curriculum for building AI agents using Claude Code architecture. To accelerate learning, the repository includes self-contained example projects ranging from minimal agent loops to advanced work-tree isolation, plus a browser-based demo that renders real-time visualizations of each execution step.

Runnable Agent Examples in the Repository

The agents/ directory contains the core example projects. These are fully executable Python programs—not code snippets—that implement each session's concepts.

Session-by-Session Agent Scripts

Each script corresponds to a specific learning module, building complexity incrementally without modifying the underlying loop logic:

• agents/s01_agent_loop.py – Implements the minimal agent loop described in the curriculum. It executes a single turn, processes the LLM response, and terminates when no tool_use stop reason is detected.
• agents/s02_tool_use.py – Adds a tool dispatch map to the base loop, demonstrating dynamic tool registration and invocation.
• agents/s03_task_graph.py through agents/s12_worktree_task_isolation.py – Progressively introduce task graphs, background workers, team coordination mechanisms, and Git work-tree isolation for concurrent task execution.

Execute any session independently:

python agents/s01_agent_loop.py

The Full-Stack Capstone Demo

The agents/s_full.py script serves as the comprehensive capstone. It imports and wires together all twelve session modules (s01_agent_loop through s12_worktree_task_isolation) into a single cohesive agent.

This demo illustrates how the architecture layers features—tool use, task graphs, work-tree isolation—without altering the core loop logic established in session one. Run the complete demonstration with:

python agents/s_full.py

Interactive Web Demo and Visualizations

Beyond the Python scripts, the repository includes a Next.js web application located in the web/ directory. This interactive demo provides browser-based visualizations for each learning session.

Running the Web Interface Locally

To launch the web demo on your machine:

cd web
npm install
npm run dev

The development server starts at http://localhost:3000. The interface includes step-through controls, source-code viewers, and real-time message flow inspectors.

Visualization Components

The web demo uses React components to render each session's architecture:

• web/src/components/visualizations/s01-agent-loop.tsx – Renders the Agent Loop diagram for session one, showing the message flow between the user, LLM, and tool executor.
• Similar components exist for sessions two through twelve, each visualizing the specific mechanisms introduced in that module (tool dispatch maps, task graphs, work-tree isolation, etc.).

How to Set Up and Run the Examples

Before executing any demo, configure your environment:

1. Clone the repository and install Python dependencies:

git clone https://github.com/shareAI-lab/learn-claude-code
cd learn-claude-code
pip install -r requirements.txt

2. Configure your API key. The agent scripts require an Anthropic API key:

cp .env.example .env

# Edit .env and add your ANTHROPIC_API_KEY

3. Run individual sessions or the full capstone as shown in the previous sections.

Summary

• The shareAI-lab/learn-claude-code repository provides twelve progressive Python agent scripts (agents/s01_agent_loop.py through agents/s12_worktree_task_isolation.py) demonstrating the complete agent architecture from basic loops to advanced isolation.
• The agents/s_full.py capstone demo composes all sessions into a single runnable example that layers features without modifying core loop logic.
• An interactive Next.js web demo in the web/ directory offers browser-based visualizations and step-through controls for every session via React components like s01-agent-loop.tsx.
• All examples are self-contained, require only an Anthropic API key, and can be executed locally using standard Python and Node.js tooling.

Frequently Asked Questions

How do I run the first example project in learn-claude-code?

Execute python agents/s01_agent_loop.py from the repository root after installing dependencies via pip install -r requirements.txt and setting your ANTHROPIC_API_KEY in the .env file. This script runs the minimal agent loop and terminates after the first non-tool LLM response, demonstrating the core interaction pattern described in the curriculum.

What is the difference between the individual session scripts and the full demo?

The individual scripts (s01 through s12) isolate each learning concept—such as tool dispatch, task graphs, or work-tree isolation—into standalone runnable examples for focused study. The agents/s_full.py script imports all twelve modules and wires them together into a single cohesive agent that demonstrates how the architecture layers advanced features without modifying the underlying loop logic established in session one.

Is there a web interface to visualize the agent behavior?

Yes. The web/ directory contains a Next.js application with React visualization components such as web/src/components/visualizations/s01-agent-loop.tsx that render interactive diagrams of each session's message flow. After running npm install and npm run dev in the web folder, you can explore step-through visualizations, source-code viewers, and real-time execution inspectors at localhost:3000.

Do the example projects require external API keys or services?

The Python agent scripts require an Anthropic API key set via the ANTHROPIC_API_KEY environment variable, typically configured by copying .env.example to .env and adding your key. The web visualization demo runs entirely in the browser and does not require API keys to view the interface, though it requires Node.js and npm to build and serve the application locally.

{
  "mcpServers": {
    "instagit": {
      "command": "npx",
      "args": ["-y", "instagit@latest"]
    }
  }
}