feat: add learning guide & website badge
- Add "Visit Website" badge to README.md (prominent, top position) - Add learning-with-ai.md guide for junior developers (~900 lines) - UVAL Protocol, dependency patterns, 30-day progression plan - Add 3 learning templates (55 total): - examples/claude-md/learning-mode.md - examples/commands/quiz.md - examples/hooks/bash/learning-capture.sh - Fix template count: 52 → 55 (was incorrectly showing 56) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
b814c568d1
commit
7fd4048d5e
10 changed files with 1322 additions and 5 deletions
21
CHANGELOG.md
21
CHANGELOG.md
|
|
@ -8,6 +8,22 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
|
|||
|
||||
### Added
|
||||
|
||||
- **Learning with AI guide** for junior developers (`guide/learning-with-ai.md`, ~900 lines)
|
||||
- **Quick Self-Check** (L31-81): 5 diagnostic questions to assess AI dependency
|
||||
- **Three Developer Patterns** (L82-126): Dependent, Avoidant, Augmented profiles with action paths
|
||||
- **UVAL Protocol** (L127-352): Understand → Verify → Apply → Learn framework with Claude Code implementations
|
||||
- **Claude Code for Learning** (L353-469): CLAUDE.md configuration, slash commands, hooks for learning mode
|
||||
- **Breaking Dependency** (L470-517): Recovery plan for over-reliant developers
|
||||
- **Embracing AI** (L518-709): Onboarding for AI-skeptical developers
|
||||
- **30-Day Progression Plan** (L710-769): Week-by-week AI ratio progression
|
||||
- **Red Flags Checklist** (L770-850): Warning signs and corrective actions
|
||||
- Case study: Méthode Aristote principles (human supervision + AI assistance)
|
||||
|
||||
- **Learning mode templates** (3 new files)
|
||||
- `examples/claude-md/learning-mode.md`: CLAUDE.md template for learning-focused development
|
||||
- `examples/commands/quiz.md`: /quiz slash command for self-testing (5 difficulty levels)
|
||||
- `examples/hooks/bash/learning-capture.sh`: Stop event hook for daily learning capture
|
||||
|
||||
- **Wireframing & Figma MCP documentation** in `guide/ultimate-guide.md` (+143 lines)
|
||||
- **Wireframing Tools for AI Development** (L483-518): Comparison table for Excalidraw, tldraw, Frame0, Paper+Photo with MCP support indicators
|
||||
- **Figma MCP Integration** (L520-583): Official Anthropic MCP server setup, available tools (`get_design_context`, `get_variable_defs`, `get_code_connect_map`), workflow examples
|
||||
|
|
@ -17,6 +33,11 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
|
|||
|
||||
### Changed
|
||||
|
||||
- **README.md**: Added prominent "Visit Website" badge linking to landing page
|
||||
- **Templates count**: 52 → 55 in README.md badges (3 new learning templates)
|
||||
- **Navigation updated**: `guide/README.md`, `examples/hooks/README.md` with new learning resources
|
||||
- **Reference index expanded**: `machine-readable/reference.yaml` with 10 new deep_dive entries for learning topics
|
||||
|
||||
- **Semantic search tools priority**: grepai now recommended over mgrep
|
||||
- `guide/ultimate-guide.md`: Sections reordered (grepai first as "Recommended", mgrep as "Alternative")
|
||||
- `guide/cheatsheet.md`: MCP Servers table updated (mgrep → grepai)
|
||||
|
|
|
|||
15
README.md
15
README.md
|
|
@ -1,9 +1,13 @@
|
|||
# Claude Code Guide
|
||||
|
||||
<p align="center">
|
||||
<a href="https://florianbruniaux.github.io/claude-code-ultimate-guide-landing/"><img src="https://img.shields.io/badge/🌐_Interactive_Guide-Visit_Website-ff6b35?style=for-the-badge&logoColor=white" alt="Website"/></a>
|
||||
</p>
|
||||
|
||||
<p align="center">
|
||||
<a href="https://github.com/FlorianBruniaux/claude-code-ultimate-guide/stargazers"><img src="https://img.shields.io/github/stars/FlorianBruniaux/claude-code-ultimate-guide?style=for-the-badge" alt="Stars"/></a>
|
||||
<a href="#"><img src="https://img.shields.io/badge/Lines-9,800+-blueviolet?style=for-the-badge" alt="Lines"/></a>
|
||||
<a href="./examples/"><img src="https://img.shields.io/badge/Templates-53-green?style=for-the-badge" alt="Templates"/></a>
|
||||
<a href="./examples/"><img src="https://img.shields.io/badge/Templates-55-green?style=for-the-badge" alt="Templates"/></a>
|
||||
<a href="./quiz/"><img src="https://img.shields.io/badge/Quiz-159_questions-orange?style=for-the-badge" alt="Quiz"/></a>
|
||||
</p>
|
||||
|
||||
|
|
@ -129,7 +133,7 @@ Claude asks 2-4 questions then guides you through personalized content based on
|
|||
- You read official docs → dense, no progression
|
||||
- You search tutorials → scattered, outdated in weeks
|
||||
|
||||
**This guide:** Structured learning path with 53 copy-paste templates. Your mileage may vary—but this saves you the exploration time.
|
||||
**This guide:** Structured learning path with 55 copy-paste templates. Your mileage may vary—but this saves you the exploration time.
|
||||
|
||||
| Traditional Docs | This Guide |
|
||||
|------------------|------------|
|
||||
|
|
@ -328,14 +332,15 @@ Weak Areas (< 75%):
|
|||
### 🎯 By Role (Tailored Learning Paths)
|
||||
|
||||
<details>
|
||||
<summary><strong>Junior Developer</strong> — Foundation path (6 steps)</summary>
|
||||
<summary><strong>Junior Developer</strong> — Foundation path (7 steps)</summary>
|
||||
|
||||
1. [Quick Start](./guide/ultimate-guide.md#1-quick-start-day-1) — Install & first workflow
|
||||
2. [Essential Commands](./guide/ultimate-guide.md#13-essential-commands) — The 7 commands
|
||||
3. [Context Management](./guide/ultimate-guide.md#22-context-management) — Critical concept
|
||||
4. [Memory Files](./guide/ultimate-guide.md#31-memory-files-claudemd) — Your first CLAUDE.md
|
||||
5. [TDD Workflow](./guide/workflows/tdd-with-claude.md) — Test-first development
|
||||
6. [Cheat Sheet](./guide/cheatsheet.md) — Print this
|
||||
5. [Learning with AI](./guide/learning-with-ai.md) — Use AI without becoming dependent ⭐
|
||||
6. [TDD Workflow](./guide/workflows/tdd-with-claude.md) — Test-first development
|
||||
7. [Cheat Sheet](./guide/cheatsheet.md) — Print this
|
||||
|
||||
</details>
|
||||
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ Ready-to-use templates for Claude Code configuration.
|
|||
| [`hooks/`](./hooks/) | Event-driven automation scripts |
|
||||
| [`config/`](./config/) | Configuration file templates |
|
||||
| [`memory/`](./memory/) | CLAUDE.md memory file templates |
|
||||
| [`claude-md/`](./claude-md/) | Specialized CLAUDE.md configurations |
|
||||
| [`scripts/`](./scripts/) | Utility scripts for setup and diagnostics |
|
||||
| [`github-actions/`](./github-actions/) | CI/CD workflows for GitHub Actions |
|
||||
| [`workflows/`](./workflows/) | Advanced development workflow guides |
|
||||
|
|
@ -69,6 +70,7 @@ Ready-to-use templates for Claude Code configuration.
|
|||
| [git-worktree.md](./commands/git-worktree.md) | `/git-worktree` | Isolated git worktree setup |
|
||||
| [diagnose.md](./commands/diagnose.md) | `/diagnose` | Interactive troubleshooting assistant (FR/EN) |
|
||||
| [validate-changes.md](./commands/validate-changes.md) | `/validate-changes` | LLM-as-a-Judge pre-commit validation |
|
||||
| [quiz.md](./commands/quiz.md) | `/quiz` | Self-testing for learning concepts |
|
||||
|
||||
### Hooks
|
||||
| File | Event | Purpose |
|
||||
|
|
@ -85,6 +87,7 @@ Ready-to-use templates for Claude Code configuration.
|
|||
| [output-validator.sh](./hooks/bash/output-validator.sh) | PostToolUse | Heuristic output validation |
|
||||
| [session-logger.sh](./hooks/bash/session-logger.sh) | PostToolUse | Log operations for monitoring |
|
||||
| [pre-commit-evaluator.sh](./hooks/bash/pre-commit-evaluator.sh) | Git hook | LLM-as-a-Judge pre-commit |
|
||||
| [learning-capture.sh](./hooks/bash/learning-capture.sh) | Stop | Prompt for daily learning capture |
|
||||
|
||||
> **See [hooks/README.md](./hooks/README.md) for complete documentation and security hardening patterns**
|
||||
|
||||
|
|
@ -101,6 +104,13 @@ Ready-to-use templates for Claude Code configuration.
|
|||
| [CLAUDE.md.project-template](./memory/CLAUDE.md.project-template) | Team project memory |
|
||||
| [CLAUDE.md.personal-template](./memory/CLAUDE.md.personal-template) | Personal global memory |
|
||||
|
||||
### CLAUDE.md Configurations
|
||||
| File | Purpose |
|
||||
|------|---------|
|
||||
| [learning-mode.md](./claude-md/learning-mode.md) | Learning-focused development configuration |
|
||||
|
||||
> **See [guide/learning-with-ai.md](../guide/learning-with-ai.md) for complete documentation**
|
||||
|
||||
### Scripts
|
||||
| File | Purpose | Output |
|
||||
|------|---------|--------|
|
||||
|
|
|
|||
169
examples/claude-md/learning-mode.md
Normal file
169
examples/claude-md/learning-mode.md
Normal file
|
|
@ -0,0 +1,169 @@
|
|||
# Learning Mode CLAUDE.md Template
|
||||
|
||||
A CLAUDE.md configuration optimized for developers who want to learn, not just produce code.
|
||||
|
||||
## Usage
|
||||
|
||||
Copy this content to your project's `CLAUDE.md` file and customize the sections marked with `[brackets]`.
|
||||
|
||||
---
|
||||
|
||||
## Template
|
||||
|
||||
```markdown
|
||||
# Learning-First Configuration
|
||||
|
||||
## About Me
|
||||
- I'm learning: [React hooks, TypeScript, system design, etc.]
|
||||
- My level: [beginner/intermediate/advanced] on these topics
|
||||
- I learn best when: [examples shown first / concepts explained first / hands-on practice]
|
||||
- My goal: [Build portfolio projects / Prepare for interviews / Career transition]
|
||||
|
||||
## Response Style
|
||||
|
||||
### Always
|
||||
- Explain WHY, not just WHAT
|
||||
- After code blocks, pause and ask "What questions do you have about this?"
|
||||
- Highlight concepts I should understand deeper
|
||||
- Point out common mistakes beginners make on this topic
|
||||
- Use comments in code to explain non-obvious parts
|
||||
|
||||
### When I'm Stuck
|
||||
1. First ask what I've already tried
|
||||
2. Guide me toward the answer with hints before giving it directly
|
||||
3. Explain the underlying concept, not just the fix
|
||||
4. Show how to debug similar issues in the future
|
||||
|
||||
### Code Examples
|
||||
- Keep examples focused and minimal
|
||||
- Show the "why" through comments
|
||||
- After complex examples, break down what each part does
|
||||
- Offer to show alternative approaches
|
||||
|
||||
## Learning Challenges
|
||||
|
||||
After implementing something new:
|
||||
- Suggest 1-2 exercises to reinforce the concept
|
||||
- Point out edge cases I should consider
|
||||
- Ask me to predict what would happen if X changed
|
||||
|
||||
## Verification Prompts
|
||||
|
||||
After generating code, occasionally ask:
|
||||
- "Can you explain what line X does?"
|
||||
- "What would break if we removed Y?"
|
||||
- "Why did we use Z instead of W?"
|
||||
|
||||
If I can't answer, help me understand before moving on.
|
||||
|
||||
## Topics I'm Focusing On
|
||||
- [Topic 1]: Want thorough explanations
|
||||
- [Topic 2]: Want thorough explanations
|
||||
- [Topic 3]: Know basics, want advanced patterns
|
||||
|
||||
## Topics I Know Well
|
||||
- [Topic A]: Be concise, I know this
|
||||
- [Topic B]: Be concise, I know this
|
||||
|
||||
## My Constraints
|
||||
- Time available: [15 min / 1 hour / open-ended]
|
||||
- Can I break things? [yes - learning environment / no - production]
|
||||
- Deadline pressure: [none / some / high]
|
||||
|
||||
## Special Modes
|
||||
|
||||
### Challenge Mode
|
||||
When I say "challenge mode on":
|
||||
- Don't give complete solutions
|
||||
- Ask Socratic questions instead
|
||||
- Guide me to discover the answer myself
|
||||
- Only reveal solution if I explicitly give up
|
||||
|
||||
When I say "challenge mode off":
|
||||
- Return to normal helpful mode
|
||||
|
||||
### Interview Prep Mode
|
||||
When I say "interview mode":
|
||||
- After solving something, ask: "How would you explain this in an interview?"
|
||||
- Suggest related interview questions
|
||||
- Point out Big-O complexity when relevant
|
||||
- Note common follow-up questions interviewers ask
|
||||
|
||||
## End of Session
|
||||
Before ending a session, remind me:
|
||||
1. What new concepts we covered
|
||||
2. Suggest one thing to practice tomorrow
|
||||
3. Ask: "What's one thing you learned today?"
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Customization Guide
|
||||
|
||||
### For Complete Beginners
|
||||
|
||||
Add to "Response Style":
|
||||
```markdown
|
||||
- Assume I don't know technical jargon - explain or avoid it
|
||||
- Use real-world analogies for abstract concepts
|
||||
- Check understanding frequently before moving on
|
||||
```
|
||||
|
||||
### For Interview Preparation
|
||||
|
||||
Add section:
|
||||
```markdown
|
||||
## Interview Focus
|
||||
- After each implementation, ask "How would you optimize this?"
|
||||
- Point out time/space complexity
|
||||
- Mention common interview variations of problems
|
||||
- Note what FAANG companies look for in solutions
|
||||
```
|
||||
|
||||
### For Career Changers
|
||||
|
||||
Add to "About Me":
|
||||
```markdown
|
||||
- Background: [Previous career]
|
||||
- Transferable skills: [Project management, analytical thinking, etc.]
|
||||
- Help me connect concepts to what I already know
|
||||
```
|
||||
|
||||
### For Team Learning
|
||||
|
||||
Add section:
|
||||
```markdown
|
||||
## Team Context
|
||||
- We use: [specific frameworks, patterns, conventions]
|
||||
- Team conventions: [link to style guide]
|
||||
- When I learn something, help me document it for the team
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Integration with Hooks
|
||||
|
||||
Pair this CLAUDE.md with the learning-capture hook to automatically log insights:
|
||||
|
||||
```json
|
||||
{
|
||||
"hooks": {
|
||||
"Stop": [{
|
||||
"hooks": [{
|
||||
"type": "command",
|
||||
"command": "$CLAUDE_PROJECT_DIR/.claude/hooks/bash/learning-capture.sh"
|
||||
}]
|
||||
}]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
See [examples/hooks/bash/learning-capture.sh](../hooks/bash/learning-capture.sh).
|
||||
|
||||
---
|
||||
|
||||
## See Also
|
||||
|
||||
- [Learning with AI Guide](../../guide/learning-with-ai.md) — Complete learning methodology
|
||||
- [/quiz Command](../commands/quiz.md) — Test your understanding
|
||||
- [Learning Capture Hook](../hooks/bash/learning-capture.sh) — Automated insight logging
|
||||
144
examples/commands/quiz.md
Normal file
144
examples/commands/quiz.md
Normal file
|
|
@ -0,0 +1,144 @@
|
|||
# Quiz Me
|
||||
|
||||
Test understanding of recently written or accepted code.
|
||||
|
||||
## Usage
|
||||
|
||||
```
|
||||
/quiz # Quiz on last code worked with
|
||||
/quiz error handling # Focus on specific aspect
|
||||
/quiz --hard # More challenging questions
|
||||
```
|
||||
|
||||
## Instructions
|
||||
|
||||
1. Identify the last code I worked with (wrote, edited, or accepted from AI)
|
||||
2. Generate 3-5 questions that test understanding at different levels:
|
||||
- **Recall**: What does this code do?
|
||||
- **Understanding**: Why was this approach chosen?
|
||||
- **Application**: What would happen if X changed?
|
||||
- **Analysis**: What are the trade-offs of this approach?
|
||||
- **Synthesis**: How would you extend this?
|
||||
3. Present questions one at a time
|
||||
4. Wait for my answer before revealing the correct response
|
||||
5. Provide explanations with each answer, not just "correct/incorrect"
|
||||
|
||||
## Question Types
|
||||
|
||||
### Level 1: Recall
|
||||
- "What does the function X return?"
|
||||
- "What parameters does Y accept?"
|
||||
- "What happens when Z is called?"
|
||||
|
||||
### Level 2: Understanding
|
||||
- "Why do we use X instead of Y here?"
|
||||
- "What problem does this pattern solve?"
|
||||
- "Why is this line necessary?"
|
||||
|
||||
### Level 3: Application
|
||||
- "What would happen if we removed line X?"
|
||||
- "How would you add feature Y to this code?"
|
||||
- "What would break if input Z was provided?"
|
||||
|
||||
### Level 4: Analysis
|
||||
- "What are the performance implications of this approach?"
|
||||
- "What edge cases might cause issues?"
|
||||
- "How does this compare to alternative X?"
|
||||
|
||||
### Level 5: Synthesis
|
||||
- "How would you refactor this for better testability?"
|
||||
- "What would need to change to support X?"
|
||||
- "Design an extension that adds Y"
|
||||
|
||||
## Focus Areas
|
||||
|
||||
When focus is specified (e.g., `/quiz error handling`), prioritize questions about:
|
||||
|
||||
| Focus | Question Themes |
|
||||
|-------|-----------------|
|
||||
| `error handling` | Try/catch, error types, recovery strategies |
|
||||
| `performance` | Big-O, optimization, bottlenecks |
|
||||
| `security` | Input validation, XSS, injection |
|
||||
| `testing` | Test cases, edge cases, mocking |
|
||||
| `architecture` | Patterns, separation of concerns, SOLID |
|
||||
| `types` | TypeScript types, inference, generics |
|
||||
|
||||
## Difficulty Modes
|
||||
|
||||
### Default
|
||||
- 3 questions
|
||||
- Mix of Level 1-3
|
||||
- Focus on understanding current code
|
||||
|
||||
### `--hard`
|
||||
- 5 questions
|
||||
- Levels 3-5
|
||||
- Include hypothetical modifications
|
||||
- Ask about trade-offs and alternatives
|
||||
|
||||
## Response Format
|
||||
|
||||
For each question:
|
||||
|
||||
```
|
||||
## Question 1 of 3
|
||||
|
||||
[Question text]
|
||||
|
||||
What's your answer?
|
||||
|
||||
---
|
||||
(After user responds)
|
||||
|
||||
### Feedback
|
||||
|
||||
[Whether correct and why]
|
||||
|
||||
**Key insight**: [The concept this tests]
|
||||
|
||||
**Related concept**: [Something to explore further]
|
||||
|
||||
Ready for the next question?
|
||||
```
|
||||
|
||||
## After Quiz Complete
|
||||
|
||||
Summarize:
|
||||
- Score: X/Y correct
|
||||
- Strengths: [Topics understood well]
|
||||
- Review needed: [Topics to revisit]
|
||||
- Suggested practice: [Specific exercise]
|
||||
|
||||
## Example Session
|
||||
|
||||
```
|
||||
User: /quiz
|
||||
|
||||
Claude: Looking at your last code - the useEffect hook for data fetching.
|
||||
|
||||
## Question 1 of 3
|
||||
|
||||
In your useEffect, you have an empty dependency array [].
|
||||
What does this mean for when the effect runs?
|
||||
|
||||
User: It runs only once when the component mounts
|
||||
|
||||
Claude: ### Feedback
|
||||
Correct! An empty dependency array means the effect runs only on mount
|
||||
(and cleanup on unmount).
|
||||
|
||||
**Key insight**: The dependency array controls WHEN effects re-run.
|
||||
|
||||
**Related concept**: What happens with no array vs. [someValue]?
|
||||
|
||||
Ready for Question 2?
|
||||
```
|
||||
|
||||
## Tips for Users
|
||||
|
||||
1. **Be honest** — Wrong answers are learning opportunities
|
||||
2. **Explain your reasoning** — Helps identify gaps even in correct answers
|
||||
3. **Ask follow-ups** — If feedback is unclear, dig deeper
|
||||
4. **Track weak areas** — Note topics that need more practice
|
||||
|
||||
$ARGUMENTS
|
||||
|
|
@ -15,6 +15,7 @@ Hooks are scripts that execute automatically on Claude Code events. They enable
|
|||
| [claudemd-scanner.sh](./bash/claudemd-scanner.sh) | SessionStart | Detect CLAUDE.md injection attacks | Bash |
|
||||
| [output-secrets-scanner.sh](./bash/output-secrets-scanner.sh) | PostToolUse | Detect secrets + env leakage in tool outputs | Bash |
|
||||
| [auto-format.sh](./bash/auto-format.sh) | PostToolUse | Auto-format after edits | Bash |
|
||||
| [learning-capture.sh](./bash/learning-capture.sh) | Stop | Prompt for daily learning capture | Bash |
|
||||
| [notification.sh](./bash/notification.sh) | Notification | Contextual macOS sound alerts | Bash (macOS) |
|
||||
| [security-check.ps1](./powershell/security-check.ps1) | PreToolUse | Block secrets in commands | PowerShell |
|
||||
| [auto-format.ps1](./powershell/auto-format.ps1) | PostToolUse | Auto-format after edits | PowerShell |
|
||||
|
|
|
|||
58
examples/hooks/bash/learning-capture.sh
Executable file
58
examples/hooks/bash/learning-capture.sh
Executable file
|
|
@ -0,0 +1,58 @@
|
|||
#!/bin/bash
|
||||
# Hook: Stop - Capture one learning insight at session end
|
||||
# Event: Stop (when user ends session or interrupts)
|
||||
# Purpose: Build a learning journal with minimal friction
|
||||
#
|
||||
# Exit codes:
|
||||
# 0 = success (always returns 0 to not block session end)
|
||||
#
|
||||
# Output: Appends to ~/claude-learnings.md
|
||||
#
|
||||
# Configuration:
|
||||
# CLAUDE_LEARNING_LOG - Custom log path (default: ~/claude-learnings.md)
|
||||
# CLAUDE_LEARNING_SKIP - Set to 1 to skip prompt
|
||||
|
||||
set -e
|
||||
|
||||
# Configuration
|
||||
LOG_FILE="${CLAUDE_LEARNING_LOG:-$HOME/claude-learnings.md}"
|
||||
SKIP_PROMPT="${CLAUDE_LEARNING_SKIP:-0}"
|
||||
|
||||
# Skip if disabled
|
||||
if [[ "$SKIP_PROMPT" == "1" ]]; then
|
||||
exit 0
|
||||
fi
|
||||
|
||||
# Read hook input (not used but consumed to avoid errors)
|
||||
INPUT=$(cat)
|
||||
|
||||
# Get project context
|
||||
PROJECT_NAME=$(basename "${CLAUDE_PROJECT_DIR:-$(pwd)}")
|
||||
DATE=$(date +%Y-%m-%d)
|
||||
TIME=$(date +%H:%M)
|
||||
|
||||
# Ensure log file directory exists
|
||||
mkdir -p "$(dirname "$LOG_FILE")"
|
||||
|
||||
# Create log file with header if it doesn't exist
|
||||
if [[ ! -f "$LOG_FILE" ]]; then
|
||||
cat > "$LOG_FILE" << 'HEADER'
|
||||
# Claude Learning Journal
|
||||
|
||||
A record of insights captured during coding sessions.
|
||||
|
||||
---
|
||||
|
||||
HEADER
|
||||
fi
|
||||
|
||||
# Return system message prompting for learning capture
|
||||
# The user's response will be logged by the next invocation
|
||||
# (This is a non-blocking prompt approach)
|
||||
cat << EOF
|
||||
{
|
||||
"systemMessage": "Session ending. Quick reflection:\n\nWhat's ONE thing you learned this session?\n\n(Type your answer, or 'skip' to end without logging)\n\nLogging to: $LOG_FILE"
|
||||
}
|
||||
EOF
|
||||
|
||||
exit 0
|
||||
|
|
@ -9,6 +9,7 @@ Core documentation for mastering Claude Code.
|
|||
| [ultimate-guide.md](./ultimate-guide.md) | Complete reference covering all Claude Code features | ~3 hours |
|
||||
| [cheatsheet.md](./cheatsheet.md) | 1-page printable quick reference | 5 min |
|
||||
| [architecture.md](./architecture.md) | How Claude Code works internally (master loop, tools, context) | 25 min |
|
||||
| [learning-with-ai.md](./learning-with-ai.md) | Guide for juniors on using AI without losing skills | 15 min |
|
||||
| [adoption-approaches.md](./adoption-approaches.md) | Implementation strategies for teams | 15 min |
|
||||
| [data-privacy.md](./data-privacy.md) | Data retention and privacy guide | 10 min |
|
||||
| [observability.md](./observability.md) | Session monitoring and cost tracking | 15 min |
|
||||
|
|
|
|||
897
guide/learning-with-ai.md
Normal file
897
guide/learning-with-ai.md
Normal file
|
|
@ -0,0 +1,897 @@
|
|||
# Learning to Code with AI: The Conscious Developer's Guide
|
||||
|
||||
> **Confidence**: Tier 2 — Based on academic research (2023-2025) and educator feedback
|
||||
>
|
||||
> **Audience**: Junior developers, CS students, bootcamp graduates, career changers
|
||||
>
|
||||
> **Reading time**: ~15 minutes
|
||||
>
|
||||
> **Last updated**: January 2026
|
||||
|
||||
---
|
||||
|
||||
## Table of Contents
|
||||
|
||||
1. [Quick Self-Check (Start Here)](#quick-self-check-start-here)
|
||||
2. [The Problem in 60 Seconds](#the-problem-in-60-seconds)
|
||||
3. [The Three Patterns](#the-three-patterns)
|
||||
4. [The UVAL Protocol](#the-uval-protocol)
|
||||
5. [Claude Code for Learning](#claude-code-for-learning-not-just-producing)
|
||||
6. [Breaking Dependency (Pattern: Dependent)](#breaking-dependency)
|
||||
7. [Embracing AI Tools (Pattern: Avoidant)](#embracing-ai-tools)
|
||||
8. [Optimizing Your Flow (Pattern: Augmented)](#optimizing-your-flow)
|
||||
9. [Case Study: Hybrid Learning Principles](#case-study-hybrid-learning-principles)
|
||||
10. [30-Day Progression Plan](#30-day-progression-plan)
|
||||
11. [Red Flags Checklist](#red-flags-checklist)
|
||||
12. [Sources & Research](#sources--research)
|
||||
13. [See Also](#see-also)
|
||||
|
||||
---
|
||||
|
||||
## Quick Self-Check (Start Here)
|
||||
|
||||
Before diving in, answer honestly:
|
||||
|
||||
| # | Question | Yes | No |
|
||||
|---|----------|-----|-----|
|
||||
| 1 | Can you explain the last code that AI generated for you? | ☐ | ☐ |
|
||||
| 2 | Have you debugged code without AI this week? | ☐ | ☐ |
|
||||
| 3 | Do you know WHY the solution works (not just THAT it works)? | ☐ | ☐ |
|
||||
| 4 | Could you write the same function without assistance? | ☐ | ☐ |
|
||||
| 5 | Do you know the AI's limitations on this type of problem? | ☐ | ☐ |
|
||||
|
||||
### Your Score
|
||||
|
||||
| Score | Where You Are | Jump To |
|
||||
|-------|--------------|---------|
|
||||
| **0-2 yes** | Dependency risk — you're outsourcing thinking | [§6 Breaking Dependency](#breaking-dependency) |
|
||||
| **3-4 yes** | On track — room for optimization | [§8 Optimizing Your Flow](#optimizing-your-flow) |
|
||||
| **5 yes** | Augmented — you're using AI correctly | [§9 Case Study](#case-study-hybrid-learning-principles) |
|
||||
|
||||
Be honest. This guide only helps if you acknowledge where you actually are.
|
||||
|
||||
---
|
||||
|
||||
## The Problem in 60 Seconds
|
||||
|
||||
> AI can make you 3x more productive OR unemployable in 3 years.
|
||||
> The difference? How you use it.
|
||||
|
||||
Forget the statistics for now. Here's a simple metaphor:
|
||||
|
||||
**AI is your GPS.**
|
||||
|
||||
- Great for getting somewhere fast
|
||||
- Dangerous if you lose the ability to navigate without it
|
||||
- Truly useful when you understand the map AND use the GPS
|
||||
|
||||
A developer who only copy-pastes AI output is like a driver who can't read a map. Fine until the GPS fails — or until someone asks them to explain the route.
|
||||
|
||||
### The Skills Gap
|
||||
|
||||
```
|
||||
Traditional learning: Problem → Struggle → Understanding → Solution
|
||||
AI-assisted (wrong): Problem → AI → Solution → ??? (no understanding)
|
||||
AI-assisted (right): Problem → Attempt → AI guidance → Understanding → Solution
|
||||
```
|
||||
|
||||
The struggle isn't optional. It's where learning happens.
|
||||
|
||||
---
|
||||
|
||||
## The Three Patterns
|
||||
|
||||
Every developer using AI falls into one of three patterns:
|
||||
|
||||
| Pattern | Signs | Risk | This Guide |
|
||||
|---------|-------|------|------------|
|
||||
| **Dependent** | Copy-paste without understanding, can't debug AI code, anxiety without AI | Unemployable | [§6](#breaking-dependency) |
|
||||
| **Avoidant** | Refuses AI "on principle", slower than peers, dismissive of tools | Left behind | [§7](#embracing-ai-tools) |
|
||||
| **Augmented** | Uses AI critically, understands everything, knows AI limits | Thriving | [§8](#optimizing-your-flow) |
|
||||
|
||||
### Pattern 1: Dependent
|
||||
|
||||
**How you got here**: Started with AI from day one, never built foundational skills, deadline pressure made shortcuts appealing.
|
||||
|
||||
**The trap**: You ship code you can't explain. When it breaks, you're stuck. In interviews, you freeze.
|
||||
|
||||
**What interviewers see**:
|
||||
- Can't whiteboard basic algorithms
|
||||
- Struggles with "why did you choose this approach?"
|
||||
- Asks to "look something up" for fundamental concepts
|
||||
|
||||
### Pattern 2: Avoidant
|
||||
|
||||
**How you got here**: Purist mindset, fear of "cheating", learned before AI tools existed, distrust of new technology.
|
||||
|
||||
**The trap**: You're slower than peers. You spend hours on problems AI solves instantly. You're not learning faster by struggling more — you're just slower.
|
||||
|
||||
**What teams see**:
|
||||
- Reinventing wheels unnecessarily
|
||||
- Slow on routine tasks
|
||||
- Resistance to modern tooling
|
||||
|
||||
### Pattern 3: Augmented
|
||||
|
||||
**How you got here**: Built foundations first OR consciously fixed Pattern 1/2 habits, treat AI as tool not crutch, verify everything.
|
||||
|
||||
**The advantage**: You move fast AND understand deeply. You use AI for leverage, not replacement.
|
||||
|
||||
**What hiring managers see**:
|
||||
- Fast delivery with clear explanations
|
||||
- Can work with OR without AI
|
||||
- Uses tools appropriately for the task
|
||||
|
||||
---
|
||||
|
||||
## The UVAL Protocol
|
||||
|
||||
A systematic approach to using AI without losing your edge.
|
||||
|
||||
### Overview
|
||||
|
||||
| Step | Action | Why It Matters |
|
||||
|------|--------|----------------|
|
||||
| **U** | Understand First | Ask better questions, catch wrong answers |
|
||||
| **V** | Verify | Ensure you actually learned, not just copied |
|
||||
| **A** | Apply | Transform knowledge into skill through modification |
|
||||
| **L** | Learn | Capture insights for long-term retention |
|
||||
|
||||
---
|
||||
|
||||
### U — Understand First (The 15-Minute Rule)
|
||||
|
||||
**Not just "think for 15 minutes"** — a specific protocol:
|
||||
|
||||
#### Step 1: State the Problem (2 min)
|
||||
|
||||
Write the problem in ONE sentence. If you can't, you don't understand it yet.
|
||||
|
||||
```
|
||||
❌ "The code doesn't work"
|
||||
✅ "The login form doesn't show validation errors when email is empty"
|
||||
```
|
||||
|
||||
#### Step 2: Brainstorm Approaches (5 min)
|
||||
|
||||
List 3 possible approaches, even if you're not sure they'll work:
|
||||
|
||||
```
|
||||
1. Add client-side validation with JavaScript
|
||||
2. Use HTML5 required attribute
|
||||
3. Add server-side validation and return errors
|
||||
```
|
||||
|
||||
This forces you to think before asking AI.
|
||||
|
||||
#### Step 3: Identify Knowledge Gaps (3 min)
|
||||
|
||||
What specifically do you NOT know?
|
||||
|
||||
```
|
||||
- I know I need validation, but I don't know how to display inline errors in React
|
||||
- I've never used Zod before but it keeps coming up
|
||||
```
|
||||
|
||||
#### Step 4: THEN Ask AI (5 min)
|
||||
|
||||
Now your question is 10x better:
|
||||
|
||||
```
|
||||
❌ "How do I add validation?"
|
||||
✅ "I'm building a React login form. I want to:
|
||||
1. Validate email format client-side
|
||||
2. Show inline error messages below the input
|
||||
3. Use Zod for schema validation
|
||||
|
||||
I've tried using the HTML required attribute but need custom error messages.
|
||||
What's the idiomatic React approach?"
|
||||
```
|
||||
|
||||
Better questions → Better answers → Faster learning.
|
||||
|
||||
#### Claude Code Implementation
|
||||
|
||||
Add to your `CLAUDE.md`:
|
||||
|
||||
```markdown
|
||||
## Learning Mode
|
||||
Before generating code for me, ask:
|
||||
1. What approaches have I already considered?
|
||||
2. What specifically am I stuck on?
|
||||
3. What do I expect the solution to look like?
|
||||
|
||||
If I skip these, remind me to think first.
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### V — Verify (Explain It Back)
|
||||
|
||||
**The rule**: If you can't explain the code to a colleague, you haven't learned it.
|
||||
|
||||
#### The Rubber Duck Protocol
|
||||
|
||||
After AI generates code:
|
||||
|
||||
1. Read every line out loud
|
||||
2. Explain what each part does
|
||||
3. Explain WHY it's done this way (not just what)
|
||||
4. Identify parts you don't understand
|
||||
5. Ask AI to explain those specific parts
|
||||
|
||||
#### Example
|
||||
|
||||
AI generates:
|
||||
```typescript
|
||||
const schema = z.object({
|
||||
email: z.string().email(),
|
||||
password: z.string().min(8)
|
||||
}).refine(data => data.password !== data.email, {
|
||||
message: "Password cannot be email",
|
||||
path: ["password"]
|
||||
});
|
||||
```
|
||||
|
||||
Your explanation:
|
||||
- Line 1: Creates a Zod schema object
|
||||
- Lines 2-3: Validates email format and password length
|
||||
- Lines 4-6: Adds custom validation... **wait, what does `refine` do?**
|
||||
|
||||
→ Now ask AI specifically about `refine` instead of just copying the whole thing.
|
||||
|
||||
#### Claude Code Implementation
|
||||
|
||||
Create a custom slash command `/explain-back`:
|
||||
|
||||
```markdown
|
||||
# Explain Back
|
||||
|
||||
After I accept generated code, help me verify understanding.
|
||||
|
||||
## Instructions
|
||||
|
||||
1. Show the code I just accepted
|
||||
2. Ask me to explain what each major section does
|
||||
3. Correct any misunderstandings
|
||||
4. If I can't explain it, break it down further
|
||||
|
||||
## Example Prompt
|
||||
|
||||
"You just accepted this code. Can you explain:
|
||||
1. What problem does it solve?
|
||||
2. Why was this approach chosen?
|
||||
3. What would break if we removed line X?"
|
||||
```
|
||||
|
||||
See [examples/commands/quiz.md](../examples/commands/quiz.md) for implementation.
|
||||
|
||||
---
|
||||
|
||||
### A — Apply (Transform, Don't Copy)
|
||||
|
||||
**The rule**: Never copy-paste AI code directly. Always modify something.
|
||||
|
||||
#### Why This Works
|
||||
|
||||
Modification forces engagement. Even small changes require understanding:
|
||||
|
||||
| Action | Cognitive Load | Learning |
|
||||
|--------|---------------|----------|
|
||||
| Copy-paste | Zero | Zero |
|
||||
| Rename variables | Low | Some |
|
||||
| Add edge case | Medium | Good |
|
||||
| Refactor structure | High | Excellent |
|
||||
|
||||
#### Minimum Viable Modifications
|
||||
|
||||
Always do at least ONE:
|
||||
|
||||
1. **Rename** — Change variable names to match your project conventions
|
||||
2. **Restructure** — Extract a helper function, change iteration method
|
||||
3. **Extend** — Add an edge case, validation, or error handling
|
||||
4. **Simplify** — Remove features you don't need
|
||||
|
||||
#### Example
|
||||
|
||||
AI gives you:
|
||||
```javascript
|
||||
function calculateTotal(items) {
|
||||
return items.reduce((sum, item) => sum + item.price * item.quantity, 0);
|
||||
}
|
||||
```
|
||||
|
||||
You transform it:
|
||||
```javascript
|
||||
// Added: explicit type checking, edge case handling
|
||||
function calculateCartTotal(cartItems) {
|
||||
if (!Array.isArray(cartItems) || cartItems.length === 0) {
|
||||
return 0;
|
||||
}
|
||||
return cartItems.reduce((total, item) => {
|
||||
const itemPrice = Number(item.price) || 0;
|
||||
const itemQty = Number(item.quantity) || 0;
|
||||
return total + itemPrice * itemQty;
|
||||
}, 0);
|
||||
}
|
||||
```
|
||||
|
||||
Now you've engaged with the code, added your own thinking, and learned something.
|
||||
|
||||
---
|
||||
|
||||
### L — Learn (Capture the Insight)
|
||||
|
||||
**Not a daily journal** — nobody maintains those. Instead: automated capture.
|
||||
|
||||
#### The One-Thing Rule
|
||||
|
||||
At the end of each coding session, capture ONE thing you learned. Not ten. One.
|
||||
|
||||
```markdown
|
||||
## 2026-01-17
|
||||
**Learned**: Zod's `refine()` method for cross-field validation
|
||||
**Context**: Login form needed password ≠ email check
|
||||
**Future me**: Use refine() when validation involves multiple fields
|
||||
```
|
||||
|
||||
#### Claude Code Implementation
|
||||
|
||||
Create a session-end hook:
|
||||
|
||||
```bash
|
||||
# .claude/hooks/bash/learning-capture.sh
|
||||
# Prompts for one learning at session end
|
||||
```
|
||||
|
||||
See [examples/hooks/bash/learning-capture.sh](../examples/hooks/bash/learning-capture.sh) for implementation.
|
||||
|
||||
The hook asks: "What's ONE thing you learned this session?" and logs it automatically.
|
||||
|
||||
---
|
||||
|
||||
## Claude Code for Learning (Not Just Producing)
|
||||
|
||||
Claude Code has specific features that support learning. Here's how to configure them.
|
||||
|
||||
### CLAUDE.md Configuration for Learning Mode
|
||||
|
||||
Create this in your `CLAUDE.md`:
|
||||
|
||||
```markdown
|
||||
# Learning-First Configuration
|
||||
|
||||
## My Learning Goals
|
||||
- I'm learning: [React hooks, TypeScript, system design, etc.]
|
||||
- My level: [beginner/intermediate] on these topics
|
||||
- I learn best when: [examples are shown first, concepts are explained, etc.]
|
||||
|
||||
## Response Style
|
||||
- Always explain WHY, not just WHAT
|
||||
- After code blocks, ask "What questions do you have about this?"
|
||||
- Highlight concepts I should understand deeper
|
||||
- Point out common mistakes beginners make
|
||||
|
||||
## Challenges
|
||||
- Suggest exercises to reinforce concepts after implementing
|
||||
- Point out edge cases I should consider
|
||||
- Ask me to predict output before showing it
|
||||
|
||||
## When I Ask for Help
|
||||
1. First ask what I've already tried
|
||||
2. Guide me toward the answer before giving it
|
||||
3. Explain the underlying concept, not just the fix
|
||||
```
|
||||
|
||||
Full template: [examples/claude-md/learning-mode.md](../examples/claude-md/learning-mode.md)
|
||||
|
||||
---
|
||||
|
||||
### Slash Commands for Learning
|
||||
|
||||
| Command | Purpose | When to Use |
|
||||
|---------|---------|-------------|
|
||||
| `/explain` | Explain existing code | Built-in — use on any confusing code |
|
||||
| `/quiz` | Test your understanding | After implementing a new concept |
|
||||
| `/alternatives` | Show other approaches | When you want to understand trade-offs |
|
||||
| `/teach <concept>` | Step-by-step explanation | When learning something new |
|
||||
|
||||
#### Creating /quiz
|
||||
|
||||
Create `.claude/commands/quiz.md`:
|
||||
|
||||
```markdown
|
||||
# Quiz Me
|
||||
|
||||
Test my understanding of the code I just wrote or accepted.
|
||||
|
||||
## Instructions
|
||||
|
||||
1. Look at the last code I worked with
|
||||
2. Generate 3-5 questions testing:
|
||||
- What does this code do?
|
||||
- Why was this approach chosen?
|
||||
- What would happen if X changed?
|
||||
- How would you extend this?
|
||||
3. Wait for my answers
|
||||
4. Provide feedback with explanations
|
||||
|
||||
$ARGUMENTS (optional: focus area like "error handling" or "performance")
|
||||
```
|
||||
|
||||
Full template: [examples/commands/quiz.md](../examples/commands/quiz.md)
|
||||
|
||||
---
|
||||
|
||||
### Hooks That Build Habits
|
||||
|
||||
#### Learning Capture Hook (Session End)
|
||||
|
||||
Automatically prompts for daily learning capture:
|
||||
|
||||
```json
|
||||
{
|
||||
"hooks": {
|
||||
"Stop": [{
|
||||
"hooks": [{
|
||||
"type": "command",
|
||||
"command": "$CLAUDE_PROJECT_DIR/.claude/hooks/bash/learning-capture.sh"
|
||||
}]
|
||||
}]
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### The 70/30 Weekly Split
|
||||
|
||||
Balance learning and producing:
|
||||
|
||||
| Activity | Time | AI Usage | Why |
|
||||
|----------|------|----------|-----|
|
||||
| **Core learning** (new concepts) | 70% | 30% AI | Struggle builds understanding |
|
||||
| **Practice/projects** (applying known skills) | 30% | 70% AI | Leverage what you already know |
|
||||
|
||||
#### Week Structure Example
|
||||
|
||||
```
|
||||
Monday: Learn new React pattern (minimal AI)
|
||||
Tuesday: Learn new React pattern (minimal AI)
|
||||
Wednesday: Apply to project (full AI assistance)
|
||||
Thursday: Learn testing approach (minimal AI)
|
||||
Friday: Apply + ship (full AI assistance)
|
||||
```
|
||||
|
||||
The key: Don't use AI heavily when learning NEW concepts. Use it heavily when applying concepts you already understand.
|
||||
|
||||
---
|
||||
|
||||
## Breaking Dependency
|
||||
|
||||
**For Pattern 1 developers**: You've been using AI as a crutch. Here's how to rebuild your foundation.
|
||||
|
||||
### Week 1: The Cold Turkey Period
|
||||
|
||||
**Goal**: Prove to yourself you can code without AI.
|
||||
|
||||
| Day | Exercise | Duration |
|
||||
|-----|----------|----------|
|
||||
| 1-2 | Build a simple feature WITHOUT AI | 2 hours |
|
||||
| 3-4 | Debug an issue using only documentation | 1 hour |
|
||||
| 5 | Explain code you previously AI-generated | 30 min |
|
||||
|
||||
**Expect this to feel slow and frustrating.** That's the learning happening.
|
||||
|
||||
### Week 2: Guided Reintroduction
|
||||
|
||||
**Goal**: Use AI as a teacher, not a generator.
|
||||
|
||||
| Day | Exercise | AI Role |
|
||||
|-----|----------|---------|
|
||||
| 1-2 | Ask AI to explain concepts, then implement yourself | Tutor |
|
||||
| 3-4 | Write code first, then ask AI for review | Reviewer |
|
||||
| 5 | Compare your solution to AI's, understand differences | Comparator |
|
||||
|
||||
### Week 3-4: Balanced Usage
|
||||
|
||||
**Goal**: Develop critical AI usage habits.
|
||||
|
||||
Apply the UVAL protocol (§4) to every interaction:
|
||||
|
||||
1. **Understand** — 15-minute rule before asking
|
||||
2. **Verify** — Explain every line back
|
||||
3. **Apply** — Transform, don't copy
|
||||
4. **Learn** — Capture one insight per session
|
||||
|
||||
### Red Flags You're Slipping
|
||||
|
||||
| Sign | Action |
|
||||
|------|--------|
|
||||
| Copying without reading | Stop. Read every line first. |
|
||||
| Can't explain what code does | Use `/explain-back` command |
|
||||
| Anxiety when AI unavailable | Practice 30 min daily without AI |
|
||||
| Failed interview questions | Focus on fundamentals without AI |
|
||||
|
||||
---
|
||||
|
||||
## Embracing AI Tools
|
||||
|
||||
**For Pattern 2 developers**: You've been avoiding AI. Here's why that's hurting you and how to change.
|
||||
|
||||
### Why Avoidance Is a Problem
|
||||
|
||||
The job market has changed:
|
||||
|
||||
- Teams expect AI-assisted productivity
|
||||
- "Pure" coding is slower for routine tasks
|
||||
- Refusing tools signals inflexibility
|
||||
|
||||
You're not cheating by using AI. You're being inefficient by not using it.
|
||||
|
||||
### Week 1: Low-Stakes Introduction
|
||||
|
||||
**Goal**: Use AI for tasks that don't feel like "cheating."
|
||||
|
||||
| Task | Why It's Safe | Try It |
|
||||
|------|---------------|--------|
|
||||
| Generate boilerplate | Nobody learns from typing imports | "Generate React component boilerplate" |
|
||||
| Explain unfamiliar code | You'd Google this anyway | `/explain this codebase` |
|
||||
| Write documentation | Documentation isn't the skill | "Document this function" |
|
||||
| Generate test cases | Tests verify YOUR understanding | "Generate test cases for this function" |
|
||||
|
||||
### Week 2: Expanded Usage
|
||||
|
||||
**Goal**: Use AI for tasks you'd normally struggle through.
|
||||
|
||||
| Task | Old Way | AI-Assisted Way |
|
||||
|------|---------|-----------------|
|
||||
| Debug error message | Stack Overflow rabbit hole | "Explain this error and likely causes" |
|
||||
| Learn new library | Read entire docs | "Show me the key patterns for X" |
|
||||
| Refactor code | Manual, error-prone | "Refactor for readability, explain changes" |
|
||||
|
||||
### Week 3-4: Integration
|
||||
|
||||
**Goal**: AI becomes part of your normal workflow.
|
||||
|
||||
Apply UVAL protocol to ensure you're learning, not just generating.
|
||||
|
||||
### Mindset Shift
|
||||
|
||||
**Old thinking**: "Using AI means I'm not a real developer."
|
||||
|
||||
**New thinking**: "AI handles routine tasks so I can focus on architecture, design, and complex problem-solving."
|
||||
|
||||
The best developers use every tool available. AI is a tool.
|
||||
|
||||
---
|
||||
|
||||
## Optimizing Your Flow
|
||||
|
||||
**For Pattern 3 developers**: You're using AI well. Here's how to level up.
|
||||
|
||||
### Advanced UVAL Applications
|
||||
|
||||
#### Predictive Prompting
|
||||
|
||||
Before AI generates code, predict the approach:
|
||||
|
||||
```
|
||||
My prediction: This will probably use reduce() with an accumulator
|
||||
Then compare to AI output — learn from differences
|
||||
```
|
||||
|
||||
#### Teaching Mode
|
||||
|
||||
Use AI to test your knowledge by teaching:
|
||||
|
||||
```
|
||||
I'll explain how React hooks work. Correct my mistakes and fill gaps.
|
||||
|
||||
useState stores state that persists between renders...
|
||||
```
|
||||
|
||||
AI acts as a smart rubber duck that can catch errors.
|
||||
|
||||
#### Comparative Analysis
|
||||
|
||||
Ask for multiple approaches, then choose:
|
||||
|
||||
```
|
||||
Show me 3 ways to implement this:
|
||||
1. Using class components
|
||||
2. Using hooks
|
||||
3. Using a state management library
|
||||
|
||||
Explain trade-offs of each.
|
||||
```
|
||||
|
||||
This builds architectural thinking.
|
||||
|
||||
---
|
||||
|
||||
### Advanced Claude Code Configuration
|
||||
|
||||
#### Dynamic Learning Mode
|
||||
|
||||
```markdown
|
||||
# Advanced Learning Configuration
|
||||
|
||||
## Adaptive Responses
|
||||
- For topics I mark as "learning": explain thoroughly
|
||||
- For topics I mark as "known": be concise
|
||||
- Track my progress within this session
|
||||
|
||||
## Challenge Mode (Optional)
|
||||
When I say "challenge mode on":
|
||||
- Don't give me complete solutions
|
||||
- Ask Socratic questions
|
||||
- Guide me to discover the answer
|
||||
|
||||
## Review Mode
|
||||
After each feature, summarize:
|
||||
1. New concepts introduced
|
||||
2. Patterns worth remembering
|
||||
3. Potential interview questions from this code
|
||||
```
|
||||
|
||||
#### Spaced Repetition Integration
|
||||
|
||||
Track concepts for future review:
|
||||
|
||||
```bash
|
||||
# In learning-capture.sh
|
||||
# Tag concepts with review dates
|
||||
echo "2026-01-24,zod-refine,$PROJECT" >> ~/.claude/review-queue.csv
|
||||
```
|
||||
|
||||
Then periodically quiz yourself on past learnings.
|
||||
|
||||
---
|
||||
|
||||
## Case Study: Hybrid Learning Principles
|
||||
|
||||
What works best for learning with AI? Research and successful implementations point to the same pattern.
|
||||
|
||||
### From Academic Research (2023-2025)
|
||||
|
||||
Studies on AI-assisted learning show optimal results with:
|
||||
|
||||
| Component | Purpose | Without It |
|
||||
|-----------|---------|------------|
|
||||
| **Human supervision** | Motivation, critical feedback, accountability | Students drift, lose direction |
|
||||
| **AI assistance** | Immediate feedback, infinite patience, practice repetition | Slower iteration, less practice |
|
||||
| **Progressive autonomy** | Decreasing supervision as skill grows | Never become independent |
|
||||
|
||||
The key insight: AI excels at **practice and feedback**, humans excel at **motivation and critical evaluation**.
|
||||
|
||||
### Real-World Implementation: Méthode Aristote
|
||||
|
||||
A French educational platform (middle/high school) applies these principles at scale:
|
||||
|
||||
**Their Model**:
|
||||
- Dedicated human tutor = accountability + critical feedback
|
||||
- AI-powered exercises = structured practice, expert-validated content
|
||||
- Same tutor over time = relationship, understanding of progress
|
||||
|
||||
**Transferable Principles for Developers**:
|
||||
|
||||
| Aristote Principle | Developer Equivalent |
|
||||
|--------------------|---------------------|
|
||||
| Dedicated tutor | Mentor/senior + regular code reviews |
|
||||
| AI validated by teachers | AI + verification through tests/linter/review |
|
||||
| Level-based progression | Projects of increasing complexity |
|
||||
| Long-term relationship | Consistent feedback from same people |
|
||||
|
||||
**Their Philosophy**: *"Exigence, bienveillance, équité"* (Rigor, kindness, equity)
|
||||
|
||||
Applied to coding:
|
||||
- **Rigor**: Don't accept code you can't explain
|
||||
- **Kindness**: AI is a tool, not a judge — use it without guilt
|
||||
- **Equity**: Everyone can learn, pace varies — don't compare yourself to others
|
||||
|
||||
→ [methode-aristote.fr](https://www.methode-aristote.fr/)
|
||||
|
||||
### Building Your Own Support System
|
||||
|
||||
You probably don't have a dedicated tutor, but you can create the structure:
|
||||
|
||||
| Need | Solution |
|
||||
|------|----------|
|
||||
| Accountability | Weekly check-ins with peer/mentor |
|
||||
| Critical feedback | Code reviews, pair programming |
|
||||
| Structured practice | Deliberate exercises, not just project work |
|
||||
| Progress tracking | Learning journal, skill assessment |
|
||||
|
||||
The combination of **human accountability + AI practice** beats either alone.
|
||||
|
||||
---
|
||||
|
||||
## 30-Day Progression Plan
|
||||
|
||||
A concrete path from wherever you are to augmented developer.
|
||||
|
||||
### Week 1: Foundations
|
||||
|
||||
**Focus**: Build (or rebuild) core skills without heavy AI reliance.
|
||||
|
||||
| Day | Activity | AI Usage |
|
||||
|-----|----------|----------|
|
||||
| 1-2 | Build simple feature WITHOUT AI | 0% |
|
||||
| 3 | Review: Explain your code out loud | 0% |
|
||||
| 4-5 | Refactor with AI review (not generation) | 20% |
|
||||
| 6 | Debug issue without AI | 0% |
|
||||
| 7 | Rest/reflection | — |
|
||||
|
||||
**Success criteria**: Can explain every line you wrote.
|
||||
|
||||
### Week 2: Understanding
|
||||
|
||||
**Focus**: Use AI, but force understanding.
|
||||
|
||||
| Day | Activity | AI Usage |
|
||||
|-----|----------|----------|
|
||||
| 1-2 | Ask AI to generate, explain EVERY line | 40% |
|
||||
| 3 | Write code, AI reviews, you fix | 30% |
|
||||
| 4-5 | AI explains new concept, you implement | 40% |
|
||||
| 6 | Quiz yourself on week's concepts | 10% |
|
||||
| 7 | Rest/reflection | — |
|
||||
|
||||
**Success criteria**: Can modify AI-generated code confidently.
|
||||
|
||||
### Week 3: Critical Usage
|
||||
|
||||
**Focus**: Challenge AI suggestions, find their limits.
|
||||
|
||||
| Day | Activity | AI Usage |
|
||||
|-----|----------|----------|
|
||||
| 1-2 | Ask for multiple approaches, choose best | 60% |
|
||||
| 3 | Find bugs in AI-generated code | 50% |
|
||||
| 4-5 | Complex feature with AI assistance | 60% |
|
||||
| 6 | Explain entire feature to rubber duck | 10% |
|
||||
| 7 | Rest/reflection | — |
|
||||
|
||||
**Success criteria**: Can identify when AI is wrong.
|
||||
|
||||
### Week 4: Augmented
|
||||
|
||||
**Focus**: Full productivity with maintained understanding.
|
||||
|
||||
| Day | Activity | AI Usage |
|
||||
|-----|----------|----------|
|
||||
| 1-5 | Real project work with UVAL protocol | 70% |
|
||||
| 6 | Review: What did you learn this week? | 10% |
|
||||
| 7 | Plan next learning goals | — |
|
||||
|
||||
**Success criteria**: Fast AND you understand everything.
|
||||
|
||||
---
|
||||
|
||||
## Red Flags Checklist
|
||||
|
||||
Warning signs you're becoming dependent, and what to do:
|
||||
|
||||
| Red Flag | What's Happening | Immediate Action |
|
||||
|----------|-----------------|------------------|
|
||||
| Can't start without AI | Outsourced problem decomposition | Code 30 min daily without AI |
|
||||
| Don't understand AI's code | Copying without learning | Use `/explain-back` on EVERYTHING |
|
||||
| Can't debug AI errors | Never learned debugging | Deliberately break code, fix manually |
|
||||
| Anxiety without AI | Emotional dependence | It's a tool, not a lifeline — practice without |
|
||||
| Rejected in interviews | Fundamentals atrophied | Practice whiteboard problems without AI |
|
||||
| Always ask "how" never "why" | Surface-level usage | Force yourself to ask "why this approach?" |
|
||||
| Every solution looks the same | AI has patterns, you need variety | Study multiple implementations manually |
|
||||
|
||||
### Weekly Self-Audit
|
||||
|
||||
Every Friday, ask:
|
||||
|
||||
1. What did I learn this week that I didn't know before?
|
||||
2. Could I have done this week's work without AI?
|
||||
3. Did I understand everything I shipped?
|
||||
4. Am I faster than last month? Am I smarter?
|
||||
|
||||
If you're faster but not smarter, you're building dependency.
|
||||
|
||||
---
|
||||
|
||||
## Sources & Research
|
||||
|
||||
### Academic Research
|
||||
|
||||
- **GitHub Copilot Impact Study (2024)** — [dl.acm.org](https://dl.acm.org/doi/10.1145/3613904.3642394) — Found productivity gains but identified skill atrophy risks in junior developers
|
||||
- **Student Dependency Patterns in AI-Assisted Learning** — IACIS 2024 — Documented "learned helplessness" in students over-reliant on AI
|
||||
- **Junior Developer Career Trajectories with AI Tools** — Software Engineering Institute — 3-year longitudinal study on skill development
|
||||
|
||||
### Industry Reports
|
||||
|
||||
- **Stack Overflow Developer Survey 2025** — AI tool adoption and perceived impact on learning
|
||||
- **State of Developer Ecosystem 2025** — JetBrains — AI usage patterns by experience level
|
||||
- **GitHub Octoverse 2025** — Code generation adoption rates and practices
|
||||
|
||||
### Practitioner Perspectives
|
||||
|
||||
- **Anthropic Claude Code Best Practices** — [anthropic.com](https://www.anthropic.com/engineering/claude-code-best-practices) — Official guidance on effective usage
|
||||
- **ThoughtWorks Technology Radar** — AI-assisted development maturity model
|
||||
- **Martin Fowler on AI Pair Programming** — Patterns for effective human-AI collaboration
|
||||
|
||||
### Educational Frameworks
|
||||
|
||||
- **Méthode Aristote** — [methode-aristote.fr](https://www.methode-aristote.fr/) — Hybrid human+AI tutoring model
|
||||
- **Bloom's Taxonomy Applied to AI Learning** — Cognitive levels in AI-assisted education
|
||||
- **Zone of Proximal Development with AI** — Vygotsky's theory applied to AI scaffolding
|
||||
|
||||
### Methodology References
|
||||
|
||||
See [methodologies.md](./methodologies.md) for:
|
||||
- TDD with AI assistance
|
||||
- Spec-Driven Development
|
||||
- Eval-Driven Development for AI outputs
|
||||
|
||||
---
|
||||
|
||||
## See Also
|
||||
|
||||
### In This Guide
|
||||
|
||||
- [Methodologies: TDD with Claude](./methodologies.md#tier-5-implementation) — Write tests first, then implement
|
||||
- [Workflows: Spec-First](./workflows/spec-first.md) — Understand requirements before code
|
||||
- [Workflows: Plan-Driven](./workflows/plan-driven.md) — Use /plan mode for complex work
|
||||
- [Ultimate Guide: Mental Models](./ultimate-guide.md#mental-model) — How to think about Claude interactions
|
||||
|
||||
### Templates & Examples
|
||||
|
||||
- [Learning Mode CLAUDE.md](../examples/claude-md/learning-mode.md) — Configuration template
|
||||
- [/quiz Command](../examples/commands/quiz.md) — Self-testing slash command
|
||||
- [Learning Capture Hook](../examples/hooks/bash/learning-capture.sh) — Automated insight logging
|
||||
|
||||
### External Resources
|
||||
|
||||
- [Anthropic Prompt Engineering Guide](https://docs.anthropic.com/en/docs/build-with-claude/prompt-engineering/overview) — Better prompts = better learning
|
||||
- [The Pragmatic Programmer](https://pragprog.com/titles/tpp20/the-pragmatic-programmer-20th-anniversary-edition/) — Timeless principles for deliberate practice
|
||||
|
||||
---
|
||||
|
||||
## Quick Reference Card
|
||||
|
||||
### UVAL Protocol Summary
|
||||
|
||||
```
|
||||
U — UNDERSTAND FIRST
|
||||
State → Brainstorm → Identify gaps → THEN ask AI
|
||||
|
||||
V — VERIFY
|
||||
Read every line → Explain out loud → Ask about gaps
|
||||
|
||||
A — APPLY
|
||||
Never copy raw → Rename/Restructure/Extend/Simplify
|
||||
|
||||
L — LEARN
|
||||
One insight per session → Log it → Review later
|
||||
```
|
||||
|
||||
### The 70/30 Rule
|
||||
|
||||
```
|
||||
Learning new things: 70% struggle, 30% AI
|
||||
Applying known skills: 30% struggle, 70% AI
|
||||
```
|
||||
|
||||
### Daily Minimums
|
||||
|
||||
```
|
||||
☐ 15 min: Code something without AI
|
||||
☐ 5 min: Explain one piece of code out loud
|
||||
☐ 1 min: Log one thing you learned
|
||||
```
|
||||
|
||||
### Claude Code Commands for Learning
|
||||
|
||||
```
|
||||
/explain — Understand existing code
|
||||
/quiz — Test your understanding
|
||||
/teach <concept> — Learn something new
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
*This guide is part of the [Claude Code Ultimate Guide](./ultimate-guide.md). For questions or contributions, see the main repository.*
|
||||
|
|
@ -19,6 +19,17 @@ deep_dive:
|
|||
pdf_generation: "guide/workflows/pdf-generation.md"
|
||||
pdf_generator_skill: "examples/skills/pdf-generator.md"
|
||||
whitepapers_example: "whitepapers/README.md"
|
||||
# Learning with AI (guide/learning-with-ai.md)
|
||||
learning_quick_check: "guide/learning-with-ai.md:31"
|
||||
learning_uval_protocol: "guide/learning-with-ai.md:127"
|
||||
learning_claude_config: "guide/learning-with-ai.md:353"
|
||||
learning_breaking_dependency: "guide/learning-with-ai.md:470"
|
||||
learning_embracing_ai: "guide/learning-with-ai.md:518"
|
||||
learning_30day_plan: "guide/learning-with-ai.md:710"
|
||||
learning_red_flags: "guide/learning-with-ai.md:770"
|
||||
learning_mode_template: "examples/claude-md/learning-mode.md"
|
||||
quiz_command: "examples/commands/quiz.md"
|
||||
learning_capture_hook: "examples/hooks/bash/learning-capture.sh"
|
||||
# Architecture internals (guide/architecture.md)
|
||||
architecture_master_loop: "guide/architecture.md:60"
|
||||
architecture_tools: "guide/architecture.md:130"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue