ガイド

Todo リスト

整理されたタスク管理のためにClaude Agent SDKを使用してtodoを追跡・表示する

Todo追跡は、タスクを管理し、ユーザーに進捗を表示するための構造化された方法を提供します。Claude Agent SDKには、複雑なワークフローを整理し、タスクの進行状況についてユーザーに情報を提供するのに役立つ組み込みのtodo機能が含まれています。

Todoのライフサイクル

Todoは予測可能なライフサイクルに従います：

タスクが特定されたときにpendingとして作成される
作業が開始されたときにin_progressにアクティブ化される
タスクが正常に完了したときに完了する
グループ内のすべてのタスクが完了したときに削除される

Todoが使用される場合

SDKは以下の場合に自動的にtodoを作成します：

3つ以上の異なるアクションを必要とする複雑な複数ステップのタスク
複数の項目が言及されているユーザー提供のタスクリスト
進捗追跡の恩恵を受ける重要な操作
ユーザーがtodo整理を求める明示的な要求

例

Todo変更の監視

import { query } from "@anthropic-ai/claude-agent-sdk";

for await (const message of query({
  prompt: "React アプリのパフォーマンスを最適化し、todoで進捗を追跡する",
  options: { maxTurns: 15 }
})) {
  // Todo更新はメッセージストリームに反映されます
  if (message.type === "tool_use" && message.name === "TodoWrite") {
    const todos = message.input.todos;
    
    console.log("Todoステータス更新:");
    todos.forEach((todo, index) => {
      const status = todo.status === "completed" ? "✅" : 
                    todo.status === "in_progress" ? "🔧" : "❌";
      console.log(`${index + 1}. ${status} ${todo.content}`);
    });
  }
}

リアルタイム進捗表示

import { query } from "@anthropic-ai/claude-agent-sdk";

class TodoTracker {
  private todos: any[] = [];
  
  displayProgress() {
    if (this.todos.length === 0) return;
    
    const completed = this.todos.filter(t => t.status === "completed").length;
    const inProgress = this.todos.filter(t => t.status === "in_progress").length;
    const total = this.todos.length;
    
    console.log(`\n進捗: ${completed}/${total} 完了`);
    console.log(`現在作業中: ${inProgress} タスク\n`);
    
    this.todos.forEach((todo, index) => {
      const icon = todo.status === "completed" ? "✅" : 
                  todo.status === "in_progress" ? "🔧" : "❌";
      const text = todo.status === "in_progress" ? todo.activeForm : todo.content;
      console.log(`${index + 1}. ${icon} ${text}`);
    });
  }
  
  async trackQuery(prompt: string) {
    for await (const message of query({
      prompt,
      options: { maxTurns: 20 }
    })) {
      if (message.type === "tool_use" && message.name === "TodoWrite") {
        this.todos = message.input.todos;
        this.displayProgress();
      }
    }
  }
}

// 使用方法
const tracker = new TodoTracker();
await tracker.trackQuery("todoを使用して完全な認証システムを構築する");

関連ドキュメント

例

Todo変更の監視

import { query } from "@anthropic-ai/claude-agent-sdk";

for await (const message of query({
  prompt: "React アプリのパフォーマンスを最適化し、todoで進捗を追跡する",
  options: { maxTurns: 15 }
})) {
  // Todo更新はメッセージストリームに反映されます
  if (message.type === "tool_use" && message.name === "TodoWrite") {
    const todos = message.input.todos;
    
    console.log("Todoステータス更新:");
    todos.forEach((todo, index) => {
      const status = todo.status === "completed" ? "✅" : 
                    todo.status === "in_progress" ? "🔧" : "❌";
      console.log(`${index + 1}. ${status} ${todo.content}`);
    });
  }
}

リアルタイム進捗表示

import { query } from "@anthropic-ai/claude-agent-sdk";

class TodoTracker {
  private todos: any[] = [];
  
  displayProgress() {
    if (this.todos.length === 0) return;
    
    const completed = this.todos.filter(t => t.status === "completed").length;
    const inProgress = this.todos.filter(t => t.status === "in_progress").length;
    const total = this.todos.length;
    
    console.log(`\n進捗: ${completed}/${total} 完了`);
    console.log(`現在作業中: ${inProgress} タスク\n`);
    
    this.todos.forEach((todo, index) => {
      const icon = todo.status === "completed" ? "✅" : 
                  todo.status === "in_progress" ? "🔧" : "❌";
      const text = todo.status === "in_progress" ? todo.activeForm : todo.content;
      console.log(`${index + 1}. ${icon} ${text}`);
    });
  }
  
  async trackQuery(prompt: string) {
    for await (const message of query({
      prompt,
      options: { maxTurns: 20 }
    })) {
      if (message.type === "tool_use" && message.name === "TodoWrite") {
        this.todos = message.input.todos;
        this.displayProgress();
      }
    }
  }
}

// 使用方法
const tracker = new TodoTracker();
await tracker.trackQuery("todoを使用して完全な認証システムを構築する");