updated presentation

This commit is contained in:
Shayan Rais
2026-02-12 22:02:38 +05:00
parent ef233afc7c
commit 0f3aeb4230
8 changed files with 101 additions and 41 deletions
+21 -1
View File
@@ -52,6 +52,13 @@ After changes, verify:
3. No duplicate slide numbers exist
4. The `totalSlides` JS variable matches the actual count (it's auto-computed from DOM)
5. Any `goToSlide()` calls in the TOC point to correct slide numbers
6. Weighted slide titles in `vibe-to-agentic-framework` match actual `<h1>` titles in `presentation/index.html`
7. Agent identifiers are consistent across examples (use `frontend-engineer` / `backend-engineer`; do not introduce aliases like `frontend-eng`)
8. Hook references remain canonical (`15 hook events`) in presentation-facing content
9. Do not manually insert `.weight-badge` markup in slide HTML (badges are JS-injected)
10. Settings precedence text must separate user-writable override order from enforced policy (`managed-settings.json`)
11. If slide 32 is touched, ensure skill frontmatter coverage includes `context: fork`
12. Keep the framework skill identity canonical: `presentation/vibe-to-agentic-framework` (do not rename to variants)
### Step 5: Self-Evolution (after every execution)
@@ -74,7 +81,15 @@ Update `.claude/skills/presentation/presentation-structure/SKILL.md`:
- **Weight Distribution table**: Update section slide ranges and total weights to match the current presentation.
- **Section divider examples**: If section divider format changed, update the example HTML.
#### 5c. Update This Agent (yourself)
#### 5c. Cross-Doc Consistency (when claims change)
If your slide edits change canonical claims that are also documented elsewhere, sync these files in the same execution:
- `reports/claude-settings.md` for settings precedence and hook counts
- `.claude/hooks/HOOKS-README.md` for hook-event totals and names
- `reports/claude-global-vs-project-settings.md` for settings precedence language
#### 5d. Update This Agent (yourself)
If you encountered an edge case, discovered a new pattern, or found that the workflow needed adjustment, append a brief note to the "Learnings" section below. This helps future invocations avoid the same issues.
@@ -82,6 +97,11 @@ If you encountered an edge case, discovered a new pattern, or found that the wor
_Findings from previous executions are recorded here. Add new entries as bullet points._
- Hook-event references drifted across files. Treat `15 hook events` as canonical and sync all docs in the same run.
- Do not use shorthand agent names in examples (`frontend-eng`). Keep identifiers exactly aligned with agent definitions.
- Never hardcode `.weight-badge` in slide HTML; badges are runtime-injected.
- Keep the framework skill name stable as `vibe-to-agentic-framework` to avoid broken skill references.
## Critical Requirements
1. **Sequential Numbering**: After any add/remove/reorder, renumber ALL slides sequentially
+28 -15
View File
@@ -1,17 +1,23 @@
# HOOKS-README
contains all the details, scripts, and instructions for the hooks
## Hook Events Overview - [Official 9 Hooks](https://docs.claude.com/en/docs/claude-code/hooks-guide)
## Hook Events Overview - [Official 15 Hooks](https://docs.claude.com/en/docs/claude-code/hooks-guide)
Claude Code provides several hook events that run at different points in the workflow:
1. PreToolUse: Runs before tool calls (can block them)
2. PostToolUse: Runs after tool calls complete
3. UserPromptSubmit: Runs when the user submits a prompt, before Claude processes it
4. Notification: Runs when Claude Code sends notifications
5. Stop: Runs when Claude Code finishes responding
6. SubagentStop: Runs when subagent tasks complete
7. PreCompact: Runs before Claude Code is about to run a compact operation
8. SessionStart: Runs when Claude Code starts a new session or resumes an existing session
9. SessionEnd: Runs when Claude Code session ends
1. SessionStart: Runs when Claude Code starts a new session or resumes one
2. SessionEnd: Runs when a Claude Code session ends
3. UserPromptSubmit: Runs when the user submits a prompt
4. PreToolUse: Runs before tool calls (can block them)
5. PostToolUse: Runs after tool calls complete
6. PostToolUseFailure: Runs after tool calls fail
7. PermissionRequest: Runs when Claude asks for a permission decision
8. Notification: Runs when Claude Code sends notifications
9. Stop: Runs when Claude Code finishes responding
10. SubagentStart: Runs when a subagent task begins
11. SubagentStop: Runs when a subagent task completes
12. PreCompact: Runs before Claude runs context compaction
13. Setup: Runs during setup/maintenance workflows
14. TeammateIdle: Runs when an Agent Team teammate goes idle
15. TaskCompleted: Runs when a tracked task reaches completion
## Prerequisites
@@ -62,15 +68,22 @@ Edit `.claude/hooks/config/hooks-config.json` for team-wide defaults:
```json
{
"disableSessionStartHook": false,
"disableSessionEndHook": false,
"disableUserPromptSubmitHook": false,
"disablePreToolUseHook": false,
"disablePostToolUseHook": false,
"disableUserPromptSubmitHook": false,
"disablePostToolUseFailureHook": false,
"disablePermissionRequestHook": false,
"disableNotificationHook": false,
"disableSubagentStartHook": false,
"disableStopHook": false,
"disableSubagentStopHook": false,
"disablePreCompactHook": false,
"disableSessionStartHook": false,
"disableSessionEndHook": false
"disableSetupHook": false,
"disableTeammateIdleHook": false,
"disableTaskCompletedHook": false,
"disableLogging": true
}
```
@@ -87,8 +100,8 @@ Create or edit `.claude/hooks/config/hooks-config.local.json` for personal prefe
In this example, only the PostToolUse and SessionStart hooks are overridden locally. All other hooks will use the shared configuration values.
**Note:** Individual hook toggles are checked by the hook script (`.claude/hooks/scripts/hooks.py`). Local settings override shared settings, and if a hook is disabled, the script exits silently without playing any sounds or executing hook logic.
**Note:** Individual hook toggles are checked by the hook script (`.claude/hooks/scripts/hooks.py`). Local settings override shared settings, and if a hook is disabled, the script exits silently without playing sounds or executing hook logic.
### Text to Speech (TTS)
website used to generate sounds: https://elevenlabs.io/
voice used: Samara X
voice used: Samara X
+11 -5
View File
@@ -3,7 +3,7 @@
Claude Code Hook Handler
=============================================
This script handles events from Claude Code and plays sounds for different hook events.
Supports all 9 Claude Code hooks: https://docs.claude.com/en/docs/claude-code/hooks-guide
Supports all 15 Claude Code hook event names: https://docs.claude.com/en/docs/claude-code/hooks-guide
Special handling for git commits: plays pretooluse-git-committing.mp3
"""
@@ -24,15 +24,21 @@ except ImportError:
# ===== HOOK EVENT TO SOUND FOLDER MAPPING =====
# Maps each hook event to its corresponding sound folder
HOOK_SOUND_MAP = {
"SessionStart": "sessionstart",
"SessionEnd": "sessionend",
"UserPromptSubmit": "userpromptsubmit",
"PreToolUse": "pretooluse",
"PostToolUse": "posttooluse",
"UserPromptSubmit": "userpromptsubmit",
"PostToolUseFailure": "posttoolusefailure",
"PermissionRequest": "permissionrequest",
"Notification": "notification",
"Stop": "stop",
"SubagentStart": "subagentstart",
"SubagentStop": "subagentstop",
"PreCompact": "precompact",
"SessionStart": "sessionstart",
"SessionEnd": "sessionend"
"Setup": "setup",
"TeammateIdle": "teammateidle",
"TaskCompleted": "taskcompleted",
}
# ===== BASH COMMAND PATTERNS =====
@@ -345,4 +351,4 @@ def main():
# Entry point - Python calls main() when the script runs
if __name__ == "__main__":
main()
main()
@@ -56,7 +56,7 @@ Inside `.code-block`, use these spans for syntax coloring:
### Content Slide with Two Columns (Good vs Bad)
```html
<div class="slide" data-slide="N" data-weight="5">
<h1>Title <span class="weight-badge">+5%</span></h1>
<h1>Title</h1>
<div class="two-col">
<div class="col-card bad">
<h4>Before (Vibe Coding)</h4>
@@ -70,6 +70,8 @@ Inside `.code-block`, use these spans for syntax coloring:
</div>
```
Do not hardcode `<span class="weight-badge">` in slide HTML. The presentation JavaScript injects and removes weight badges automatically.
### Content Slide with Code Example
```html
<div class="slide" data-slide="N">
@@ -23,9 +23,12 @@ Every technique is demonstrated on a realistic full-stack project:
todoapp/
├── backend/ # FastAPI (Python)
│ ├── main.py # App entry + CORS
│ ├── models.py # SQLAlchemy models
│ ├── routes/
│ │ └── todos.py # CRUD endpoints
│ │ └── users.py # Auth endpoints
│ ├── models/
│ │ ├── todo.py # SQLAlchemy Todo model
│ │ └── user.py # SQLAlchemy User model
│ └── tests/
│ └── test_todos.py
├── frontend/ # Next.js (TypeScript)
@@ -33,7 +36,10 @@ todoapp/
│ │ ├── TodoList.tsx
│ │ └── Sidebar.tsx
│ ├── pages/
└── styles/ # Tailwind tokens
│ ├── index.tsx
│ │ └── todos.tsx
│ └── lib/
│ └── api.ts # API client
└── CLAUDE.md
```
+14 -7
View File
@@ -763,8 +763,9 @@ When creating or modifying frontend components:
<div class="use-case-item"><span class="use-case-icon">&#128221;</span><div class="use-case-text"><strong>description</strong><span>When to invoke &mdash; helps Claude auto-discover the skill</span></div></div>
<div class="use-case-item"><span class="use-case-icon">&#129302;</span><div class="use-case-text"><strong>model</strong><span>Override which model runs the skill</span></div></div>
<div class="use-case-item"><span class="use-case-icon">&#128295;</span><div class="use-case-text"><strong>allowed-tools</strong><span>Restrict which tools the skill can use</span></div></div>
<div class="use-case-item"><span class="use-case-icon">&#128257;</span><div class="use-case-text"><strong>context: fork</strong><span>Run the skill in an isolated subagent context for complex workflows</span></div></div>
</div>
<h3>Three Ways to Invoke</h3>
<h3>Invocation &amp; Execution Modes</h3>
<div class="code-block"><span class="comment"># 1. Manual: slash command</span>
<span class="cmd">&gt;</span> /frontend-conventions
@@ -773,7 +774,10 @@ When creating or modifying frontend components:
<span class="comment"># 3. Preloaded: in an agent's frontmatter</span>
<span class="key">skills</span>:
- frontend-conventions</div>
- frontend-conventions
<span class="comment"># 4. Optional isolation for heavy workflows</span>
<span class="key">context</span>: <span class="string">fork</span></div>
</div>
<!-- Slide 33: Skills Summary -->
@@ -826,13 +830,13 @@ When creating or modifying frontend components:
<div class="col-card">
<h4>As Main Agent</h4>
<p>Replaces default Claude for your conversation.</p>
<div class="code-block"><span class="cmd">$</span> claude --agent frontend-eng</div>
<div class="code-block"><span class="cmd">$</span> claude --agent frontend-engineer</div>
</div>
<div class="col-card">
<h4>As Subagent</h4>
<p>Spawned in an isolated context via Task tool.</p>
<div class="code-block">Task(
subagent_type=<span class="string">"frontend-eng"</span>
subagent_type=<span class="string">"frontend-engineer"</span>
prompt=<span class="string">"Add a settings page"</span>
)</div>
</div>
@@ -1447,12 +1451,15 @@ Read(.env) <span class="comment">// Block reading secrets</span></di
<h4>Settings Hierarchy</h4>
<p>Settings cascade from most specific to least specific. Higher priority wins.</p>
</div>
<div class="code-block"><span class="comment"># Priority order (highest to lowest):</span>
<div class="code-block"><span class="comment"># User-writable override order (highest to lowest):</span>
1. Command line flags <span class="comment"># --model opus</span>
2. .claude/settings.local.json <span class="comment"># Personal, git-ignored</span>
3. .claude/settings.json <span class="comment"># Team-shared, committed</span>
4. ~/.claude/settings.json <span class="comment"># Global personal</span>
5. managed-settings.json <span class="comment"># Organization policies</span></div>
4. ~/.claude/settings.local.json <span class="comment"># Global personal override</span>
5. ~/.claude/settings.json <span class="comment"># Global personal default</span>
<span class="comment"># Policy layer:</span>
managed-settings.json <span class="comment"># Organization policy (enforced)</span></div>
</div>
<!-- Slide 66: Spinner Verbs -->
+5 -3
View File
@@ -67,17 +67,19 @@ These exist at both levels, with **project-level taking precedence** over global
## Settings Precedence
Settings apply in order from highest to lowest priority:
User-writable settings apply in this override order (highest to lowest):
| Priority | Location | Scope | Version Control | Purpose |
|----------|----------|-------|-----------------|---------|
| 1 | Managed settings | System | Read-only | Organization/admin policies |
| 1 | Command line flags | Session | N/A | Single-session overrides |
| 2 | `.claude/settings.local.json` | Project | No (git-ignored) | Personal project-specific |
| 3 | `.claude/settings.json` | Project | Yes (committed) | Team-shared settings |
| 4 | `~/.claude/settings.local.json` | User | N/A | Personal global overrides |
| 5 | `~/.claude/settings.json` | User | N/A | Global personal settings |
**Important**: `deny` rules have the highest priority and cannot be overridden by any lower-priority settings.
Policy layer: `managed-settings.json` is organization-enforced and cannot be overridden by local files.
**Important**: `deny` rules have the highest safety precedence and cannot be overridden by lower-priority allow/ask rules.
---
+11 -7
View File
@@ -28,19 +28,21 @@ A comprehensive guide to all available configuration options in Claude Code's `s
## Settings Hierarchy
Claude Code uses a 4-tier configuration hierarchy (highest to lowest priority):
Claude Code settings use a 5-level user-writable override chain plus an enforced policy layer:
| Priority | Location | Scope | Version Control | Purpose |
|----------|----------|-------|-----------------|---------|
| 1 | Command line arguments | Session | N/A | Single-session overrides |
| 2 | `.claude/settings.local.json` | Project | No (git-ignored) | Personal project-specific |
| 3 | `.claude/settings.json` | Project | Yes (committed) | Team-shared settings |
| 4 | `~/.claude/settings.json` | User | N/A | Global personal settings |
| 5 | `managed-settings.json` | System | Read-only | Organization policies |
| 4 | `~/.claude/settings.local.json` | User | N/A | Personal global overrides |
| 5 | `~/.claude/settings.json` | User | N/A | Global personal defaults |
**Important**: Later values override earlier ones EXCEPT for:
- `deny` rules (highest priority - cannot be overridden)
- Managed settings (cannot be overridden by any local settings)
**Policy layer**: `managed-settings.json` is organization-enforced and cannot be overridden by local settings.
**Important**:
- `deny` rules have highest safety precedence and cannot be overridden by lower-priority allow/ask rules.
- Managed settings may lock or override local behavior even if local files specify different values.
---
@@ -237,7 +239,7 @@ Control what tools and operations Claude can perform.
Execute custom shell commands at various points in Claude Code's lifecycle.
### Hook Events (13 total)
### Hook Events (15 total)
| Event | When Fired | Matcher Support | Common Use Cases |
|-------|------------|-----------------|------------------|
@@ -254,6 +256,8 @@ Execute custom shell commands at various points in Claude Code's lifecycle.
| `SubagentStop` | Subagent completes | Yes | Cleanup, validation |
| `PreCompact` | Before context compaction | Yes | Backup, logging |
| `Setup` | Repository init (`--init`, `--maintenance`) | Yes | One-time setup |
| `TeammateIdle` | Agent Teams teammate goes idle | Yes | Team orchestration, routing |
| `TaskCompleted` | A tracked task is completed | Yes | Progress automation, notifications |
### Hook Configuration Structure