From 09518901b18b69be2e8bd5327d0be34226f88b67 Mon Sep 17 00:00:00 2001 From: Shayan Rais Date: Thu, 12 Feb 2026 17:41:02 +0500 Subject: [PATCH] upadted presentation --- .claude/hooks/config/hooks-config.json | 15 +- presentation/index.html | 426 +++++++++++++++---------- 2 files changed, 264 insertions(+), 177 deletions(-) diff --git a/.claude/hooks/config/hooks-config.json b/.claude/hooks/config/hooks-config.json index 3832cda..79ef816 100644 --- a/.claude/hooks/config/hooks-config.json +++ b/.claude/hooks/config/hooks-config.json @@ -1,11 +1,18 @@ { + "disableSessionStartHook": false, + "disableUserPromptSubmitHook": false, "disablePreToolUseHook": false, "disablePostToolUseHook": false, - "disableUserPromptSubmitHook": false, + "disablePostToolUseFailureHook": false, + "disablePermissionRequestHook": false, "disableNotificationHook": false, - "disableStopHook": false, + "disableSubagentStartHook": false, "disableSubagentStopHook": false, + "disableStopHook": false, "disablePreCompactHook": false, - "disableSessionStartHook": false, - "disableSessionEndHook": false + "disableSessionEndHook": false, + "disableSetupHook": false, + "disableTeammateIdleHook": false, + "disableTaskCompletedHook": false, + "disableLogging": true } diff --git a/presentation/index.html b/presentation/index.html index 7406767..590593c 100644 --- a/presentation/index.html +++ b/presentation/index.html @@ -126,31 +126,111 @@

Run /doctor anytime to check your installation health.

- +
-

Login Options

-

Two ways to authenticate with Claude Code:

-
-
-

Option A: Subscription (claude.ai)

-

Use your Claude Pro/Team/Enterprise subscription.

-
claude +

Login Option A: Subscription

+

Use your Claude Pro or Max subscription via OAuth login:

+
claude # Select "Claude.ai" at the login prompt # Opens browser for OAuth
-

Best for: Individual developers, teams with existing subscriptions

-
-
-

Option B: API Key

-

Use an Anthropic API key (pay per token).

-
export ANTHROPIC_API_KEY=sk-ant-... -claude
-

Best for: CI/CD, automation, pay-as-you-go usage

-
-
+

Subscription Tiers

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PlanPriceWeekly LimitSonnet 4.5Opus 4.6
Pro$20/moBase limit✓✗
Max 5x$100/mo5× Pro limit✓✓
Max 20x$200/mo20× Pro limit✓✓
+

Weekly limits reset every 7 days. Usage is shared across Claude web, desktop, and Claude Code. Opus 4.6 requires a Max plan.

+

Best for: Individual developers, teams with existing subscriptions

- +
+

Login Option B: API Key

+

Pay per token with an Anthropic API key — no weekly caps:

+

Token Pricing (per million tokens)

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ModelInputOutputContext Window
Opus 4.6$5 / MTok$25 / MTok200K (1M beta)
Sonnet 4.5$3 / MTok$15 / MTok200K (1M beta)
Haiku 4.5$1 / MTok$5 / MTok200K
+

Setup

+
+
+

Quick: Environment Variable

+
export ANTHROPIC_API_KEY=sk-ant-... +claude
+
+
+

Recommended: apiKeyHelper

+
# ~/.claude/settings.json +{ "apiKeyHelper": "~/.claude/anthropic_key.sh" } + +# ~/.claude/anthropic_key.sh +echo "sk-ant-........." + +# Make it executable +chmod +x ~/.claude/anthropic_key.sh
+
+
+

Best for: CI/CD, automation, variable usage, full model access without subscription

+
+ + +

Your First Session

Start Claude Code

@@ -166,8 +246,8 @@

Claude Code is project-aware. Always run it from your project's root directory so it understands your codebase.

- -
+ +

The Interface

╭──────────────────────────────────────╮ │ Claude Code v2.1.33 @@ -185,15 +265,15 @@
- -
+ +

Beyond Vibe Coding

Effective prompting that produces real, production-quality results — not AI slop.

- -
+ +

Your First Prompt

Try This

@@ -209,8 +289,8 @@
- -
+ +

Good vs Bad Prompts

The difference between vibe coding and professional usage:

@@ -231,8 +311,8 @@
- -
+ +

Providing Context

Key Rule

@@ -251,8 +331,8 @@
- -
+ +

How Claude Uses Tools

Claude Code doesn't just generate text — it takes actions using tools:

@@ -279,8 +359,8 @@
- -
+ +

File Operations

Reading Files

> Read the package.json file
@@ -294,8 +374,8 @@
- -
+ +

Bash Commands & Search

Running Commands

> Run the test suite: npm test @@ -311,8 +391,8 @@
- -
+ +

Understanding the Context Window

Key Concept

@@ -331,8 +411,8 @@
- -
+ +

Prompting Best Practices

🎯
Be specific about files"In src/api/users.ts" not "in the user code"
@@ -344,15 +424,15 @@
- -
+ +

Essential Commands

Slash commands that transform Claude Code from a chatbot into a power tool.

- -
+ +

/help

Try This

@@ -378,8 +458,8 @@
- -
+ +

/model — Switch Models

Try This

@@ -397,8 +477,8 @@
- -
+ +

/model — Effort Level

When Opus 4.6 is selected, you can adjust the effort level:

@@ -416,8 +496,8 @@
- -
+ +

/fast — Faster Output

Try This

@@ -430,8 +510,8 @@

Use fast mode when you need quick responses and don't need deep reasoning. Toggle it off for complex tasks.

- -
+ +

/plan — Plan Before Code

Try This

@@ -450,8 +530,8 @@
- -
+ +

/compact — Manage Context

Try This

@@ -469,8 +549,8 @@
- -
+ +

/context & /cost

@@ -486,8 +566,8 @@
- -
+ +

/clear & /rewind

@@ -507,8 +587,8 @@
- -
+ +

/resume — Resume Sessions

Try This

@@ -525,8 +605,8 @@
- -
+ +

/memory — Persistent Context

Try This

@@ -541,8 +621,8 @@
- -
+ +

/doctor — Diagnostics

Try This

@@ -557,8 +637,8 @@
- -
+ +

/config — Configuration

Try This

@@ -573,8 +653,8 @@
- -
+ +

/permissions — Tool Access Control

Try This

@@ -596,8 +676,8 @@ Read(.env) // Block reading secrets
- -
+ +

/sandbox — Sandboxing

Try This

@@ -614,8 +694,8 @@ Read(.env) // Block reading secrets
- -
+ +

Commands Cheat Sheet

@@ -649,15 +729,15 @@ Read(.env) // Block reading secrets
- -
+ +

Workflows

Plan first, execute second. Professional workflows that prevent wasted effort.

- -
+ +

Why Plan Before Code

@@ -679,8 +759,8 @@ Read(.env) // Block reading secrets
- -
+ +

Plan Mode in Practice

Step by Step

@@ -702,8 +782,8 @@ Read(.env) // Block reading secrets
- -
+ +

Task Lists

For complex tasks, Claude creates a task list to track progress:

> Add user authentication with JWT, including: @@ -719,8 +799,8 @@ Read(.env) // Block reading secrets
- -
+ +

The Commit Workflow

Ask Claude to Commit

@@ -738,8 +818,8 @@ Read(.env) // Block reading secrets
- -
+ +

The PR Workflow

Ask Claude to Create a PR

@@ -753,8 +833,8 @@ Read(.env) // Block reading secrets
- -
+ +

Workflow Best Practices

🗺️
Always start with plan modeFor any non-trivial task
@@ -765,15 +845,15 @@ Read(.env) // Block reading secrets
- -
+ +

CLAUDE.md & Memory

Make Claude remember your project, conventions, and preferences across every session.

- -
+ +

What is CLAUDE.md?

Key Concept

@@ -788,8 +868,8 @@ Read(.env) // Block reading secrets
- -
+ +

Creating CLAUDE.md

Try This

@@ -815,8 +895,8 @@ A Node.js REST API for managing user accounts... - Follow existing error handling patterns in src/utils/errors.ts
- -
+ +

What to Include in CLAUDE.md

@@ -839,8 +919,8 @@ A Node.js REST API for managing user accounts...
- -
+ +

Keep It Under 150 Lines

Critical Rule

@@ -854,8 +934,8 @@ A Node.js REST API for managing user accounts...
- -
+ +

/memory Command

Try This

@@ -870,8 +950,8 @@ A Node.js REST API for managing user accounts...

Claude also learns automatically — it may add notes to a separate auto-memory file as you work.

- -
+ +

Rules (.claude/rules/)

What Are Rules?

@@ -888,8 +968,8 @@ When writing tests:

This rule only activates when Claude is working on test files — keeping context clean for other tasks.

- -
+ +

Memory Best Practices

📏
CLAUDE.md under 150 linesBrief, focused, high-signal instructions
@@ -900,15 +980,15 @@ When writing tests:
- -
+ +

Skills

Reusable knowledge and workflows that Claude loads on-demand — like giving it a manual.

- -
+ +

What Are Skills?

Key Concept

@@ -922,8 +1002,8 @@ When writing tests:
- -
+ +

Skill Directory Structure

# Skills live in .claude/skills/ .claude/ @@ -942,8 +1022,8 @@ When writing tests:
- -
+ +

SKILL.md Frontmatter

# .claude/skills/weather-fetcher/SKILL.md --- @@ -965,8 +1045,8 @@ Return only the temperature value in Celsius.
- -
+ +

Creating Your First Skill

Try This

@@ -985,8 +1065,8 @@ Return only the temperature value in Celsius.
- -
+ +

Invoking Skills

Manual Invocation (Slash Command)

> /weather-fetcher @@ -1002,8 +1082,8 @@ Return only the temperature value in Celsius.

Skills preloaded into agents are available from the start — no manual invocation needed.

- -
+ +

Skills Summary

@@ -1025,15 +1105,15 @@ Return only the temperature value in Celsius.
- -
+ +

Agents

Custom agents with their own tools, skills, and personality — from simple helpers to complex workflows.

- -
+ +

What Are Agents?

Key Concept

@@ -1062,8 +1142,8 @@ Task(
- -
+ +

Agent Frontmatter

# .claude/agents/code-reviewer.md --- @@ -1084,8 +1164,8 @@ Review your memory for patterns you've seen before.

tools — what the agent can do. skills — knowledge preloaded at startup. memory — persistent learning across sessions.

- -
+ +

Example: The Weather Agent

This repository includes a working example of the Command → Agent → Skills pattern:

# .claude/agents/weather.md @@ -1108,8 +1188,8 @@ to fetch weather data and apply transformations.
- -
+ +

Agent Tools & Model

Restricting Tools

# Read-only agent — can't modify anything @@ -1128,8 +1208,8 @@ to fetch weather data and apply transformations.
- -
+ +

Agents with Preloaded Skills

Key Pattern

@@ -1150,8 +1230,8 @@ Build API endpoints following the preloaded conventions.

The agent gets all three skills injected at startup — it already knows your team's patterns.

- -
+ +

Setting a Default Agent

Via settings.json

@@ -1169,8 +1249,8 @@ Build API endpoints following the preloaded conventions.
- -
+ +

Subagents via Task Tool

Key Concept

@@ -1193,8 +1273,8 @@ Task(

- -
+ +

Command → Agent → Skills

The full architecture pattern for complex workflows:

┌─────────────────────────────────────────────┐ @@ -1213,8 +1293,8 @@ Task(
- -
+ +

Agent Memory

Key Feature

@@ -1233,8 +1313,8 @@ Task(

- -
+ +

Agents Summary

@@ -1264,15 +1344,15 @@ Task(
- -
+ +

Customization

37 settings and 84 environment variables — make Claude Code truly yours.

- -
+ +

settings.json Overview

Settings Hierarchy

@@ -1290,8 +1370,8 @@ Task(
- -
+ +

Spinner Verbs

Customize the loading messages that appear while Claude thinks:

// .claude/settings.json @@ -1314,8 +1394,8 @@ Task(
- -
+ +

Status Line

A custom info bar below the composer showing model, context, cost, git branch, etc.

@@ -1334,8 +1414,8 @@ Task(

Every team member can have a different status line — customize it in your personal settings.local.json.

- -
+ +

Output Styles

Set via /config

@@ -1353,8 +1433,8 @@ Task(
- -
+ +

Keybindings

Customize Keys

@@ -1378,8 +1458,8 @@ Task(
- -
+ +

Terminal Setup & Vim Mode

@@ -1397,8 +1477,8 @@ Task(
- -
+ +

Hooks Overview

What Are Hooks?

@@ -1414,8 +1494,8 @@ Task(

Claude Code supports 15 hook events. Five of them can block execution (exit code 2).

- -
+ +

Plugins & Marketplaces

Install a Plugin

@@ -1434,8 +1514,8 @@ Task(
- -
+ +

MCP Servers

What is MCP?

@@ -1453,8 +1533,8 @@ Task(
- -
+ +

Customization Summary

@@ -1478,15 +1558,15 @@ Task(
- -
+ +

Tips & Next Steps

Practical advice from experience and the creator of Claude Code.

- -
+ +

Debugging Tips

🩺
Run /doctorFirst thing to try when something isn't working
@@ -1496,8 +1576,8 @@ Task(
- -
+ +

The Golden Rules

1️⃣
Always start with plan modeFor any non-trivial task. Review the plan before Claude writes code.
@@ -1509,8 +1589,8 @@ Task(
- -
+ +

Resources

📖
Claude Code Docscode.claude.com/docs/en
@@ -1522,8 +1602,8 @@ Task(
- -
+ +

Your Next Steps

1️⃣
Install & LoginGet Claude Code running on your machine today
@@ -1535,8 +1615,8 @@ Task(
- -
+ +
@@ -1554,12 +1634,12 @@ Task(
-
1 / 81
+
1 / 82
← → or Space to navigate