・
Claude Codeの使い方｜ToDoアプリの機能実装を試して検証した
エンジニアの業務効率を飛躍的に向上させるツールとして、Claude Codeが注目を集めています。
本記事では、その特徴や具体的な導入手順、さらに実践的な使い方を詳しく解説。
開発プロセスの改善にぜひお役立てください！
🔤Claude Codeとは？
Claude Codeは、Anthropic社が提供するエンジニア向けの画期的なAIアシスタントであり、CLI環境での開発体験を根本から変えるツールとして注目を集めています。
Claude Codeの概要
Claude Codeは、特にCLI（コマンドラインインターフェース）環境に統合されるよう設計されており、エンジニアが使い慣れたターミナルや開発ツール、ブラウザ上で直接AIと対話しながらコーディングを進められる仕様になっています。
Claude Sonnetなどの強力なモデルと連携し、単なるコード補完にとどまらず、バグ修正やタスク自動化、コミット作成など幅広い支援が可能。
作業中の環境間移動を減らし、シームレスな開発体験を実現してくれるのです。
開発業務におけるメリット
Claude Codeを日常業務に取り入れることで、開発者はルーチンワークから解放され、高度な設計や問題解決に集中できるようになるでしょう。
例えば、
- 数千行に及ぶソースコードの中からバグの原因を特定
- 複雑な依存関係を持つコンポーネントのテストコードを生成
- 自然言語による指示 → 新しい機能の実装案を出力
というように、開発業務の一プロセスをAIが代替してくれるので、チーム全体の生産性向上が見込めます。
新しいプログラミング言語やフレームワークを学習する際にも、有能なペアプログラミングのパートナーとして活躍してくれるはずです！
Claude Codeの料金
Claude Code自体のインストールは無料ですが、利用にはPro/Max等のサブスクリプション契約、またはClaude Console（API）アカウントが必要です。Pro/Maxでは利用枠が月額料金に含まれ、API経由ではトークン消費に応じた従量課金が発生。
消費されるトークン数に基づいてコストが計算されるため、使った分だけ支払う柔軟な運用が可能となっています。
API利用およびTeam/Enterpriseの利用料金表
また、頻繁に大規模なコード生成を行う個人ユーザー向けには、Claude ProやMaxといったサブスクリプションプランも用意されており、利用頻度やプロジェクトの規模に合わせて最適な料金モデルを選択できます。
個人向け利用料金表
利用開始前に最新の利用料金やプランの詳細を確認し、予算に応じた運用計画を立てるようにしましょう。
※表内に記載されている料金は執筆時のレート換算となります。
💻Yoomは開発業務に関連する作業を自動化できます
エンジニアの業務はコーディングだけではありません。
タスク管理ツールへのチケット登録や、社内チャットツールへの進捗報告など、開発周辺の様々な業務が存在します。
Claude Codeが直接対応できないワークフローの自動化には、Yoomの活用が非常に有効です。
[Yoomとは]
プログラミングのコア業務はClaude Codeで効率化し、周辺タスクはYoomで自動化するという組み合わせが、チームの生産性を最大化するための鍵となるでしょう。
開発業務をサポートする自動化フローボット
■概要
Yoomを活用した「Googleフォームで回答が送信されたら、AIで開発用のPythonコードを生成しSlackに通知する」ワークフローは、フォーム回答をトリガーに、AIが自動でPythonスクリプトを生成し、Slackに通知する業務ワークフローです。
■このテンプレートをおすすめする方
- Googleフォームで収集した要件や仕様をSlackに即時共有しつつ、自動でコード生成まで試したい開発チーム
- Pythonコード作成を学びたいエンジニアや学生の方
- フォーム回答→手動コーディングの繰り返し作業を減らしたいプロジェクトマネージャー
- 迅速なプロトタイプ作成でアイディア検証を行いたいスタートアップや社内企画部門
■このテンプレートを使うメリット
- フォーム回答後すぐにAIがPythonコードを出力、手作業を大幅削減
- 生成されたコードをSlackでスピーディーに共有でき、開発速度アップ
- AIを実務で活かしながら、ワークフローの自動化を学習できる
■概要Airtableに蓄積された顧客からの問い合わせやアンケート結果などのテキストデータを、一つひとつ確認して内容を要約・分析する作業は手間がかかるのではないでしょうか。このワークフローを活用すれば、Airtableに新しいレコードが登録されると、その内容をAnthropic（Claude）が自動で解析し、結果を元のレコードに追記します。AirtableとClaudeの連携を通じて、手作業によるデータ分析業務を効率化し、データの活用を促進できます。■このテンプレートをおすすめする方- AirtableとClaudeを連携させ、手作業で行っているテキストデータの分析業務を自動化したい方
- Airtableに集約した顧客の声やフィードバックを、効率的に要約・分類したいと考えている方
- 生成AIを活用してデータベースの情報をリッチ化し、業務効率を向上させたいと考えている方
■このテンプレートを使うメリット- Airtableへのレコード登録を起点に、Claudeによる解析と結果の書き戻しまでが自動化されるため、これまで分析や転記に費やしていた時間を短縮できます。
- 手作業でのコピー＆ペーストや分析結果の転記が不要になるため、入力間違いや反映漏れといったヒューマンエラーの防止に繋がります。
■フローボットの流れ- はじめに、AirtableとAnthropic（Claude）をYoomと連携します。
- 次に、トリガーでAirtableを選択し、「レコードが登録されたら」というアクションを設定します。
- 次に、オペレーションでAnthropic（Claude）の「テキストを生成」アクションを設定し、Airtableから取得したテキストデータの解析や要約などを実行します。
- 最後に、オペレーションでAirtableの「レコードを更新」アクションを設定し、Anthropic（Claude）が生成した結果を元のレコードに追記します。
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション■このワークフローのカスタムポイント- Airtableのトリガーやオペレーション設定では、連携対象のベースIDやテーブルIDを任意で設定してください。取得や更新先とするフィールドも任意で設定可能です。
- Anthropic（Claude）のオペレーション設定では、目的に応じて利用するモデル（Claude 3 Sonnetなど）や、指示内容（プロンプト）を任意で設定してください。
■注意事項- Airtable、Anthropic（Claude）のそれぞれとYoomを連携してください。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- AirtableのアウトプットはJSONPathから取得可能です。取得方法は「『取得する値』を追加する方法」をご参照ください。
■概要
Yoomを活用した「Googleフォームで回答が送信されたら、AIで開発用のPythonコードを生成しSlackに通知する」ワークフローは、フォーム回答をトリガーに、AIが自動でPythonスクリプトを生成し、Slackに通知する業務ワークフローです。
■このテンプレートをおすすめする方
- Googleフォームで収集した要件や仕様をSlackに即時共有しつつ、自動でコード生成まで試したい開発チーム
- Pythonコード作成を学びたいエンジニアや学生の方
- フォーム回答→手動コーディングの繰り返し作業を減らしたいプロジェクトマネージャー
- 迅速なプロトタイプ作成でアイディア検証を行いたいスタートアップや社内企画部門
■このテンプレートを使うメリット
- フォーム回答後すぐにAIがPythonコードを出力、手作業を大幅削減
- 生成されたコードをSlackでスピーディーに共有でき、開発速度アップ
- AIを実務で活かしながら、ワークフローの自動化を学習できる
- AirtableとClaudeを連携させ、手作業で行っているテキストデータの分析業務を自動化したい方
- Airtableに集約した顧客の声やフィードバックを、効率的に要約・分類したいと考えている方
- 生成AIを活用してデータベースの情報をリッチ化し、業務効率を向上させたいと考えている方
- Airtableへのレコード登録を起点に、Claudeによる解析と結果の書き戻しまでが自動化されるため、これまで分析や転記に費やしていた時間を短縮できます。
- 手作業でのコピー＆ペーストや分析結果の転記が不要になるため、入力間違いや反映漏れといったヒューマンエラーの防止に繋がります。
- はじめに、AirtableとAnthropic（Claude）をYoomと連携します。
- 次に、トリガーでAirtableを選択し、「レコードが登録されたら」というアクションを設定します。
- 次に、オペレーションでAnthropic（Claude）の「テキストを生成」アクションを設定し、Airtableから取得したテキストデータの解析や要約などを実行します。
- 最後に、オペレーションでAirtableの「レコードを更新」アクションを設定し、Anthropic（Claude）が生成した結果を元のレコードに追記します。
- Airtableのトリガーやオペレーション設定では、連携対象のベースIDやテーブルIDを任意で設定してください。取得や更新先とするフィールドも任意で設定可能です。
- Anthropic（Claude）のオペレーション設定では、目的に応じて利用するモデル（Claude 3 Sonnetなど）や、指示内容（プロンプト）を任意で設定してください。
- Airtable、Anthropic（Claude）のそれぞれとYoomを連携してください。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- AirtableのアウトプットはJSONPathから取得可能です。取得方法は「『取得する値』を追加する方法」をご参照ください。
AIワーカーを活用した自動化フローボット
■概要GitHubで新機能の要望やバグ報告のIssueが起票された際、その内容をもとに開発・QA・ビジネスの各視点を網羅した技術ドキュメントを作成するのは、多くの時間と労力を要する作業です。ドキュメント作成の初動が遅れると、チーム内でのスムーズな意思決定や開発スピードにも影響を及ぼしかねません。このワークフローを活用すれば、GitHubでIssueが作成されたことをきっかけに、AIワーカーが多角的な視点から技術ドキュメントのドラフトを自動生成し、Notionへの保存とSlackへの通知までを一気通貫で実行します。これにより、ドキュメント作成にかかる負担を抑え、迅速なレビュー体制の構築を実現します。
■このテンプレートをおすすめする方- GitHubでのIssue起票後のドキュメント作成を効率化し、開発スピードを向上させたいプロジェクトマネージャーの方
- GitHubとNotionを併用しており、Issueの内容をもとにした多角的な技術検討を自動化したいエンジニアの方
- 新しいIssueが作成された際に、開発やQAなどの各視点を網羅した情報をスムーズにチームへ共有したいと考えているチームリーダーの方
■このテンプレートを使うメリット- GitHubでIssueが作成されると、AIワーカーが自動で技術ドキュメントのドラフトを作成するため、ドキュメントの起票にかかる時間を短縮し、本来の業務に集中できます。
- 開発、QA、ビジネスの各視点を網羅したドキュメントがNotionに自動生成されることで、チーム内での情報共有やレビューをスムーズに開始でき、意思決定の質が向上します。
■フローボットの流れ- はじめに、GitHub、Notion、SlackをYoomと連携します。
- 次に、トリガーでGitHubを選択し、「Issueが新しく作成されたら」というアクションを設定します。
- 最後に、AIワーカーで、新機能の要望メモから開発・QA・ビジネス視点を網羅した技術ドキュメントのドラフトを作成するためのスキル（指示）を作成します。
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント- GitHubのトリガー設定では、対象とするリポジトリを任意で指定してください。
- AIワーカーの指示内容を調整することで、出力されるドキュメントの構成や重点を置くポイントをチームの運用に合わせてカスタマイズ可能です。
- Notionのステップでは、ドキュメントを保存する親ページやデータベースのプロパティを任意で設定してください。
- Slackの通知先チャンネルや、通知するメッセージの内容も自由に設定が可能です。
■注意事項- GitHub、NotionのそれぞれとYoomを連携してください。AIワーカー内で使用するツール（アプリ）についてもマイアプリ連携が必要です。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- AIワーカーの基本設定は「【AIワーカー】基本的な設定方法」をご参照ください。
- AIワーカーの同時実行数・作成可能なAIワーカー数・利用可能なAIモデルはご契約中のプランによって異なります。
- AIワーカー内でご利用いただけるアプリやオペレーション等はフローボットの利用制限と同様です。
- AIワーカーは、テスト実行でも本番実行と同様にタスクを消費しますのでご注意ください。詳細は「【AIワーカー】タスク実行数の計算方法」ご参照ください。
- AIワーカーはスキルを詳細に設定することで適切な処理を実行しやすくなります。詳細は「【AIワーカー】マニュアルの作成方法」をご参照ください。
■概要GitLabで新しいイシューが作成されるたびに、内容を確認して手動でラベルを付ける作業は、プロジェクトが大きくなるほど煩雑になりがちです。このワークフローを活用すれば、GitLabでイシューが作成された際にAIが自動で内容を精査し、適切なラベル付けまでを自律的に行います。まるで専属のGitLab AIエージェントのようにイシュー管理を自動化することで、開発チームの生産性向上を支援します。■このテンプレートをおすすめする方- GitLabでのイシューのトリアージやラベル付けに多くの時間を費やしている開発チームの方
- GitLabの運用にAIエージェントのような自動化を取り入れ、生産性を向上させたい方
- イシュー管理の属人化を防ぎ、対応の迅速化と標準化を目指しているプロジェクト管理者の方
■このテンプレートを使うメリット- GitLabでイシューが作成されるとAIが内容を自動で精査・ラベル付けするため、これまで手作業で行っていたトリアージ業務の時間を短縮できます。
- AIが一定の基準で処理を行うため、担当者による判断のばらつきを防ぎ、イシュー管理の属人化解消や業務の標準化に繋がります。
■フローボットの流れ- はじめに、GitLabをYoomと連携します。
- 次に、トリガーでGitLabを選択し、「イシューが作成されたら」というアクションを設定します。
- 最後に、オペレーションでAIワーカーを選択し、GitLabのイシュー内容を精査して自動でトリアージを行うためのマニュアル（指示）を作成します。
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント- AIワーカーのオペレーションでは、OpenAIやAnthropic（Claude）など、利用したいAIモデルを任意で選択してください。
- AIワーカーへの指示は、イシューのタイトルや本文からどのような情報を抽出し、どのような基準でラベルを判断するかなど、要件に合わせて自由に設定してください。
■注意事項- GitLabとYoomを連携してください。AIワーカー内で使用するツール（アプリ）についてもマイアプリ連携が必要です。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- AIワーカーの基本設定は「【AIワーカー】基本的な設定方法」をご参照ください。
- AIワーカーの同時実行数・作成可能なAIワーカー数・利用可能なAIモデルはご契約中のプランによって異なります。
- AIワーカー内でご利用いただけるアプリやオペレーション等はフローボットの利用制限と同様です。
- AIワーカーは、テスト実行でも本番実行と同様にタスクを消費しますのでご注意ください。詳細は「【AIワーカー】タスク実行数の計算方法」ご参照ください。
- AIワーカーはマニュアルを詳細に設定することで適切な処理を実行しやすくなります。詳細は「【AIワーカー】マニュアルの作成方法」をご参照ください。
■このテンプレートをおすすめする方
- GitHubでのIssue起票後のドキュメント作成を効率化し、開発スピードを向上させたいプロジェクトマネージャーの方
- GitHubとNotionを併用しており、Issueの内容をもとにした多角的な技術検討を自動化したいエンジニアの方
- 新しいIssueが作成された際に、開発やQAなどの各視点を網羅した情報をスムーズにチームへ共有したいと考えているチームリーダーの方
■このテンプレートを使うメリット
- GitHubでIssueが作成されると、AIワーカーが自動で技術ドキュメントのドラフトを作成するため、ドキュメントの起票にかかる時間を短縮し、本来の業務に集中できます。
- 開発、QA、ビジネスの各視点を網羅したドキュメントがNotionに自動生成されることで、チーム内での情報共有やレビューをスムーズに開始でき、意思決定の質が向上します。
■フローボットの流れ
- はじめに、GitHub、Notion、SlackをYoomと連携します。
- 次に、トリガーでGitHubを選択し、「Issueが新しく作成されたら」というアクションを設定します。
- 最後に、AIワーカーで、新機能の要望メモから開発・QA・ビジネス視点を網羅した技術ドキュメントのドラフトを作成するためのスキル（指示）を作成します。
■このワークフローのカスタムポイント
- GitHubのトリガー設定では、対象とするリポジトリを任意で指定してください。
- AIワーカーの指示内容を調整することで、出力されるドキュメントの構成や重点を置くポイントをチームの運用に合わせてカスタマイズ可能です。
- Notionのステップでは、ドキュメントを保存する親ページやデータベースのプロパティを任意で設定してください。
- Slackの通知先チャンネルや、通知するメッセージの内容も自由に設定が可能です。
■注意事項
- GitHub、NotionのそれぞれとYoomを連携してください。AIワーカー内で使用するツール（アプリ）についてもマイアプリ連携が必要です。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- AIワーカーの基本設定は「【AIワーカー】基本的な設定方法」をご参照ください。
- AIワーカーの同時実行数・作成可能なAIワーカー数・利用可能なAIモデルはご契約中のプランによって異なります。
- AIワーカー内でご利用いただけるアプリやオペレーション等はフローボットの利用制限と同様です。
- AIワーカーは、テスト実行でも本番実行と同様にタスクを消費しますのでご注意ください。詳細は「【AIワーカー】タスク実行数の計算方法」ご参照ください。
- AIワーカーはスキルを詳細に設定することで適切な処理を実行しやすくなります。詳細は「【AIワーカー】マニュアルの作成方法」をご参照ください。
- GitLabでのイシューのトリアージやラベル付けに多くの時間を費やしている開発チームの方
- GitLabの運用にAIエージェントのような自動化を取り入れ、生産性を向上させたい方
- イシュー管理の属人化を防ぎ、対応の迅速化と標準化を目指しているプロジェクト管理者の方
- GitLabでイシューが作成されるとAIが内容を自動で精査・ラベル付けするため、これまで手作業で行っていたトリアージ業務の時間を短縮できます。
- AIが一定の基準で処理を行うため、担当者による判断のばらつきを防ぎ、イシュー管理の属人化解消や業務の標準化に繋がります。
- はじめに、GitLabをYoomと連携します。
- 次に、トリガーでGitLabを選択し、「イシューが作成されたら」というアクションを設定します。
- 最後に、オペレーションでAIワーカーを選択し、GitLabのイシュー内容を精査して自動でトリアージを行うためのマニュアル（指示）を作成します。
■このワークフローのカスタムポイント
- AIワーカーのオペレーションでは、OpenAIやAnthropic（Claude）など、利用したいAIモデルを任意で選択してください。
- AIワーカーへの指示は、イシューのタイトルや本文からどのような情報を抽出し、どのような基準でラベルを判断するかなど、要件に合わせて自由に設定してください。
- GitLabとYoomを連携してください。AIワーカー内で使用するツール（アプリ）についてもマイアプリ連携が必要です。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- AIワーカーの基本設定は「【AIワーカー】基本的な設定方法」をご参照ください。
- AIワーカーの同時実行数・作成可能なAIワーカー数・利用可能なAIモデルはご契約中のプランによって異なります。
- AIワーカー内でご利用いただけるアプリやオペレーション等はフローボットの利用制限と同様です。
- AIワーカーは、テスト実行でも本番実行と同様にタスクを消費しますのでご注意ください。詳細は「【AIワーカー】タスク実行数の計算方法」ご参照ください。
- AIワーカーはマニュアルを詳細に設定することで適切な処理を実行しやすくなります。詳細は「【AIワーカー】マニュアルの作成方法」をご参照ください。
🚌Claude Codeの導入方法
ツールを導入する際、環境構築や設定にかける工数が懸念点となることは少なくありません。
しかし、Claude Codeのインストールや設定プロセスは非常にシンプルに設計されており、既存の開発環境へスムーズに組み込むことが可能です。
※Claude Codeは個人向けサブスクリプションではPro以上で利用可能
アカウントの用意と利用環境の選択
Claudeでアカウントを作成し、必要に応じて Pro/Max/Teamなどの有料サブスクリプションを契約します。
次は利用場面に合わせて必要な環境を整えましょう。
Claude Codeはブラウザ環境・IDE連携・言語/フレームワーク・API設定など、利用環境の幅が広いのが特徴。
Webからの利用やアプリをダウンロードする方法が比較的簡単です。
自身の開発プロセスにあったシステム環境を選択しましょう！
環境設定
ターミナルやコマンドラインで環境構築を行う場合、事前にコードプロジェクトを用意する必要があります。
準備完了後、コードを実行してインストール。
インストール後は認証が必要です。Pro/Max等のサブスクリプションアカウント、またはClaude Consoleでログインします。
認証が完了すると情報が保存され、プロジェクトごとの細かい設定が可能になります。
なお、デスクトップアプリを選択した場合は、アプリインストール後、Codeタブをクリックすればコーディングをすぐに開始できますよ！
利用前の条件を確認
ターミナルで使用する場合、任意のプロジェクトディレクトリでClaude Codeを開始します。
利用可能なコマンドについてはClaude Code:クイックスタートを確認してくださいね。
環境が整ったら、実際にコーディングを進めてみてください。
アプリ上でClaude Codeを使用する際は、実行環境やプロジェクトフォルダ、モデルを事前に指定しておきましょう。
その後、タスクを入力することで返答を得られるようになります！
🏃♀️Claude Code：コーディング処理精度を検証
それでは早速、実際の開発業務を想定してClaude Codeの実力を検証してみましょう。
日々のコーディング作業においてどれほどの実用性を持ち、エンジニアの負担を軽減できるのか、その有効性を確かめていきます。
なお、検証はデスクトップアプリを使って進めていきますね。
①新規機能の実装
まずはシンプルなToDoアプリを構築。
Claude Codeに対して、「タスクの期限リマインダー機能」を新しく追加する指示を入力しました。
この時、プロジェクトのフォルダを指定しておくことで、AIはプロジェクト全体のディレクトリ構造や既存のコードベースを把握した上で回答してくれます。
入力プロンプト（一部抜粋）
あなたは、すでにこのフォルダ一式を読み込んでいる前提で回答してください。
このプロジェクトは、フロントエンド（React）とバックエンド（Node.js/Express）で構成されたシンプルなToDoアプリです。
【現在の仕様の前提】
【やりたいこと】
この既存のToDoアプリに、「タスクの期限リマインダー機能」を新規実装してください。
【要件】
【実装方針に関する希望】
【出力フォーマットの希望】
1. 全体設計
〜〜
4. 運用上の注意点 ・ローカル環境での動作確認手順（例：マイグレーション、開発サーバーの再起動など）があれば、簡単に補足してください。
以上を踏まえ、このプロジェクトの現状のコードを読み込みながら、実装に必要な変更案と具体的なコードを提案してください。
検証結果
プロンプト投稿後、出力完了までにかかった時間は約20秒ほど。
この圧倒的な情報処理能力には思わず脱帽してしまいます...！
フロントエンドのUIコンポーネントの追加だけでなく、バックエンドのAPIロジックに至るまで、広範囲にわたって必要なコード変更が画面上に提示されました。
希望する新規実装機能に、必要なデータをどのような理由で新設しているかを、階層ごとに分けて説明できており、設計内容もわかりやすく説明されていますね。（赤線）
また、「2. 変更が必要なファイル一覧」や「3. ファイルごとのコード提案」の出力結果も確認しましたが、元の構成ファイルも正確に読みこんでいて、その上でコード改修の提案が行えていました。
実際に提案されたコードをVSCodeにコピーして適用。
細かい調整は必要だったものの、ゼロからロジックを考えて書き始める作業に比べて、思考とコード入力の手間が軽減されたことを実感しました！
②既存コードのリファクタリング
次に、長期間にわたる機能追加の繰り返しで複雑化し、可読性が著しく低下していた古い関数のリファクタリングを依頼しました。
まずは、検証1でも使用したデータフォルダに、可読性の低いコードを組み込んでいる「legacyTaskFilter.ts」というファイルを追加して対象フォルダに指定。
以下のプロンプトを投稿します。
入力プロンプト（一部抜粋）
あなたはTypeScript + ReactベースのToDoアプリをメンテナンスしているシニアフロントエンドエンジニアです。
今から、長年の機能追加で複雑化し、可読性が低下している「タスク一覧フィルタ＆ソート」用の古い関数をリファクタリングしてほしいです。
### 依頼内容
このファイルに定義されている getTaskList関数を、「よりモダンで保守しやすいコード」にリファクタリングしてください。
既存の呼び出し元コードが極力壊れないように、「getTaskListの公開インターフェース（引数の数と型、戻り値の構造）は大きく変えない」「完全に変える必要がある場合は、「既存呼び出し元の修正方針」もあわせて提案」のどちらかを選んでください。
### 出力フォーマット
〜〜
### 注意点
・ロジック上のバグや仕様のあいまいさに気づいた場合は、挙動を勝手に変えずに、「こう解釈するのが自然」「ここは利用チームと要相談」などのコメントとして補足してください。
・すぐにプロダクションコードに組み込めるレベルの可読性・一貫性を目指してください。
検証結果
まずは対象ファイルの読み込みからスタートし、指示の方針を理解した旨の文章が生成されました。
ファイルへの書き込み許可を求められたため、「一度だけ許可」をクリック。
すると、最新の言語仕様を用いた簡潔できれいなコードが、わずか数秒でチャット画面に出力されました！
単にコードを短くするだけでなく、変数の命名規則がプロジェクト全体に合わせて自動的に統一され、可読性を下げる原因となっていた不要なネストも解消されるなど、最適解に基づいた修正案が提示。
変更点の明示もわかりやすく、既存コード喉の部分をどのように変更したかが一目でわかるようになっています。
元コードと見比べると、重複したコードが配置されて野暮ったい印象を受ける構成をスマートな構成のものに編集してくれていることがお分かりいただけるでしょうか？（赤枠）
人が見落としがちな細かい改善点までカバーされており、リファクタリング提案が期待できると感じました。
③エラー発生時の解決の迅速化
最後に、開発中によく遭遇するトラブルを想定し、意図的に型エラーや実行時エラーを発生させた状態での対応について検証します。
出力された長大なエラーメッセージをコピーし、該当すると思われるソースコードとともにプロンプトを投稿しました。
入力プロンプト（一部抜粋）
あなたはTypeScript + React + Node.js/ExpressベースのToDoアプリをメンテナンスしているシニアフルスタックエンジニアです。
いま、開発中に発生したエラー（型エラーまたは実行時エラー）について、原因の特定と修正方法の提案をお願いしたいです。
### 依頼内容
1. 貼り付けたエラーメッセージ とソースコードを読み取り、 ・どの行／どのファイル周辺で ・どのような原因によって ・どのような種類のエラー（型エラーor実行時エラー）が起きているのか を特定してください。
### 出力フォーマット
次の 4 セクションに分けて回答してください。
1. 【エラーの概要】
2. 【修正案コード】
3. 【原因の技術的な解説】
4. 【今後の予防策・確認ポイント】
検証結果
検証2と同様にファイルの読み取りを許可するかのメッセージがいくつか表示され、許可後AIがコード解析を行います。
3分後には入力された複雑なスタックトレースとコードの文脈を瞬時に分析し、エラーの根本的な原因を特定した上で、修正すべき箇所をピンポイントで画面上に提示してくれました！（赤枠）
複数の問題があることも的確に指摘し、各コードに対する修正案も提示。
さらに素晴らしいのは、なぜそのエラーが発生したのかという技術的な背景や予防策までも詳細に記載していれている点。
戻り値の構成や型定義の統一を行うことで、改善とエラーの予防が期待できることを箇条書きでわかりやすく提示してくれました！（赤線）
エラー状態を短時間で解析してくれただけでなく、デバッグ作業に伴うエンジニアの心理的ストレスの軽減に大きく貢献。
工数削減や人的リソースの最適化にも役立つことも示唆された結果となりました。
💪チーム開発を最適化する高度な機能
Claude Codeは個人のコーディングスピードを上げるだけでなく、チーム全体での開発プロセスを円滑にし、プロジェクトの品質を底上げするための高度な機能があります。
コードレビューの自動化
Claude Codeは個人のコーディング支援だけでなく、プルリクエスト作成前の事前コードレビューといった優秀な機能を備えているのです！
コミットしようとしている差分ファイルをClaude Codeに解析させることで、セキュリティ上の脆弱性やチームのコーディング規約からの逸脱、パフォーマンスの懸念点などを自動的にリストアップ。
人のレビュアーによる負担が軽減され、コードレビューのサイクルを高速化できる傾向があります。
テスト生成とドキュメント化
他にも、実装済みの関数やクラスを指定して「テストを書いて」と指示するだけで、エッジケースを含んだ網羅的なユニットテストの雛形を出力してくれます。
また、ソースコードの意図を汲み取り、READMEファイルや関数用のコメント（JSDocなど）を自動で作成・更新することも可能です。
ドキュメントの保守は後回しにされがちですが、AIの支援によって最新の状態を保ちやすくなり、新しいメンバーがプロジェクトに参画する際のオンボーディングもスムーズに進められるようになるでしょう！
🌈まとめ
Claude Codeを使うことで、直接AIと対話しながら、コード生成からリファクタリング、エラー解決までをシームレスに行えるようになります。
適切な導入と初期設定を行えば、日々のコーディングにかかる時間を削減し、より創造的な開発業務に注力できるようになるでしょう。
また、コードレビューの支援やテストの自動生成といった機能は、チーム全体のコード品質と生産性を底上げする可能性を秘めています。
ぜひ一度ご自身の開発環境に取り入れ、その実力を体験してみてはいかがでしょうか？
🪶Yoomでできること
Claude Codeによるコーディングの効率化と合わせて、Yoomを活用することで組織全体の業務プロセスをさらに最適化することが可能です。
Yoomは、エンジニアだけでなくバックオフィスや営業チームなど、あらゆる部門が利用する様々なアプリケーションを繋ぎ合わせ、一連の作業を自動化します。
プログラミング領域外の反復的な手作業をYoomに任せることで、組織全体の限られたリソースをより付加価値の高い業務へ集中させることができるでしょう。
■概要日々受信する多くのメールへの返信作業に、時間や手間がかかっていると感じることはありませんか。特に内容を考慮して返信文を作成する業務は、重要な一方で大きな負担となりがちです。このワークフローを活用すれば、Gmailで受信したメールの内容をAnthropic（Claude）が解析し、返信文を自動で作成して送信するまでの一連の流れを自動化できます。Anthropic（Claude）を活用したメール返信の自動化で、コミュニケーション業務の効率化を実現しましょう。■このテンプレートをおすすめする方- Gmailでの問い合わせ対応に多くの時間を費やしているカスタマーサポート担当者の方
- Anthropic（Claude）を活用したメール返信の自動化で、業務効率化を目指している方
- 定型的なメールへの返信作業を自動化し、コア業務に集中したいと考えている方
■このテンプレートを使うメリット- Gmailで受信したメールへの返信を自動化するため、これまで手作業に費やしていた時間を短縮し、他の業務に充てることができます。
- Anthropic（Claude）が内容を解析し返信文を生成するため、返信内容の品質を一定に保ち、対応漏れなどのヒューマンエラーを防ぎます。
■フローボットの流れ- はじめに、GmailとAnthropic（Claude）をYoomと連携します。
- 次に、トリガーでGmailを選択し、「特定のラベルのメールを受信したら」というアクションを設定します。
- 次に、オペレーションでAnthropic（Claude）の「テキストを生成」アクションを設定し、受信したメール本文をもとに返信文を作成するよう指示します。
- 最後に、オペレーションでGmailの「メールを送る」アクションを設定し、生成されたテキストを本文としてメールを返信します。
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント- Gmailでメールを送信するアクションでは、送信先を任意のアドレスに設定することが可能です。
- 送信するメールの本文は、固定のテキストを設定したり、Anthropic（Claude）で生成したテキストなどの動的な情報を変数として埋め込んだりできます。
■注意事項- Gmail、Anthropic（Claude）のそれぞれとYoomを連携してください。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
■概要GitHubでプルリクエストが更新されるたびに、手動でテストシナリオを作成・更新する作業は、開発サイクルのボトルネックになりがちです。 このワークフローを活用することで、プルリクエストの変更内容をAIが自動で解析し、最適なテストシナリオを自律的に生成します。まるで専属のAIエージェントがいるかのように、テスト自動化のプロセスを効率化し、開発スピードの向上に貢献します。■このテンプレートをおすすめする方- GitHubでの開発プロセスにおける、テストシナリオ作成の工数を削減したい開発チームの方
- AIエージェントの技術を活用して、テスト自動化の仕組みを構築したいと考えているQAエンジニアの方
- 手動でのテスト項目作成によるヒューマンエラーや、レビュー工数を削減したいプロジェクトマネージャーの方
■このテンプレートを使うメリット- プルリクエストの更新をトリガーにAIがシナリオを自動生成するため、これまで手作業に費やしていた時間を短縮し、コア業務に集中できます。
- AIがコードの変更点に基づいたテストシナリオを生成するため、担当者による品質のばらつきを防ぎ、テストプロセスの標準化を実現します。
■フローボットの流れ- はじめに、GitHub、Slack、Google スプレッドシートをYoomと連携します。
- 次に、トリガーでGitHubを選択し、「プルリクエストは作成または更新されたら」というアクションを設定します。
- 次に、オペレーションで「分岐」を設定し、更新時のみ後続の処理が行われるようにします。
- 最後に、オペレーションでAIワーカーを設定し、GitHubのプルリクエストからコードの変更内容を解析し、最適なテスト自動化シナリオを生成・提案するためのマニュアル（指示）を作成します。
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント- AIワーカーへの指示（プロンプト）は、ユーザーの環境に合わせて自由にカスタムが可能です。例えば、特定のテストフレームワークを指定したり、トリガーで取得したプルリクエストのタイトルや本文を変数として埋め込んだりすることで、より精度の高いテストシナリオを生成できます。
■注意事項- GitHub、Slack、Google スプレッドシートのそれぞれとYoomを連携してください。AIワーカー内で使用するツール（アプリ）についてもマイアプリ連携が必要です。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- 分岐はミニプラン以上のプランでご利用いただける機能（オペレーション）となっております。フリープランの場合は設定しているフローボットのオペレーションはエラーとなりますので、ご注意ください。
- ミニプランなどの有料プランは、2週間の無料トライアルを行うことが可能です。無料トライアル中には制限対象のアプリや機能（オペレーション）を使用することができます。
- AIワーカーの基本設定は「【AIワーカー】基本的な設定方法」をご参照ください。
- AIワーカーの同時実行数・作成可能なAIワーカー数・利用可能なAIモデルはご契約中のプランによって異なります。
- AIワーカー内でご利用いただけるアプリやオペレーション等はフローボットの利用制限と同様です。
- AIワーカーは、テスト実行でも本番実行と同様にタスクを消費しますのでご注意ください。詳細は「【AIワーカー】タスク実行数の計算方法」ご参照ください。
- AIワーカーはマニュアルを詳細に設定することで適切な処理を実行しやすくなります。詳細は「【AIワーカー】マニュアルの作成方法」をご参照ください。
■概要GitHubのIssue管理において、新しいIssueが作成されるたびに内容を確認し、優先度を判断して担当者を割り当てる作業は、プロジェクトが大きくなるほど煩雑になりがちです。このワークフローを活用すれば、Issue作成をトリガーとしてAIが内容を解析し、優先度付けと担当者のアサインを自動で行うため、まるで専属のGitHub AIエージェントのようにIssue管理の初動を効率化し、開発チームがより本質的な業務に集中できる環境を構築します。■このテンプレートをおすすめする方- GitHubでのIssue管理における優先度付けや担当者割り振りに手間を感じている方
- GitHub AIエージェントのような仕組みを導入し、Issueのトリアージを自動化したい方
- 手作業によるIssueの仕分け作業をなくし、開発チームの生産性を向上させたい方
■このテンプレートを使うメリット- Issue作成後の優先度判定と担当者アサインが自動化されるため、手作業での確認や割り振りにかかる時間を短縮できます
- AIが設定された基準で判断するため、担当者による判断のブレがなくなり、Issue管理業務の属人化を解消します
■フローボットの流れ- はじめに、GitHubをYoomと連携します
- 次に、トリガーでGitHubを選択し、「Issueが新しく作成されたら」というアクションを設定します
- 最後に、オペレーションでAIワーカーを選択し、受け取ったIssueの情報をもとに優先度判定と担当者のアサインを行うためのマニュアル（指示）を作成します
※「トリガー」：フロー起動のきっかけとなるアクション、「オペレーション」：トリガー起動後、フロー内で処理を行うアクション
■このワークフローのカスタムポイント- GitHubのトリガー設定では、対象としたいリポジトリのオーナー名とリポジトリ名を任意で設定してください
- AIワーカーの設定では、利用したいAIモデルを選択し、Issueの内容からどのように優先度を判定し、誰をアサインするかの基準を指示として具体的に設定してください
■注意事項- GitHubとYoomを連携してください。AIワーカー内で使用するツール（アプリ）についてもマイアプリ連携が必要です。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- AIワーカーの基本設定は「【AIワーカー】基本的な設定方法」をご参照ください。
- AIワーカーの同時実行数・作成可能なAIワーカー数・利用可能なAIモデルはご契約中のプランによって異なります。
- AIワーカー内でご利用いただけるアプリやオペレーション等はフローボットの利用制限と同様です。
- AIワーカーは、テスト実行でも本番実行と同様にタスクを消費しますのでご注意ください。詳細は「【AIワーカー】タスク実行数の計算方法」ご参照ください。
- AIワーカーはマニュアルを詳細に設定することで適切な処理を実行しやすくなります。詳細は「【AIワーカー】マニュアルの作成方法」をご参照ください。
- Gmailでの問い合わせ対応に多くの時間を費やしているカスタマーサポート担当者の方
- Anthropic（Claude）を活用したメール返信の自動化で、業務効率化を目指している方
- 定型的なメールへの返信作業を自動化し、コア業務に集中したいと考えている方
- Gmailで受信したメールへの返信を自動化するため、これまで手作業に費やしていた時間を短縮し、他の業務に充てることができます。
- Anthropic（Claude）が内容を解析し返信文を生成するため、返信内容の品質を一定に保ち、対応漏れなどのヒューマンエラーを防ぎます。
- はじめに、GmailとAnthropic（Claude）をYoomと連携します。
- 次に、トリガーでGmailを選択し、「特定のラベルのメールを受信したら」というアクションを設定します。
- 次に、オペレーションでAnthropic（Claude）の「テキストを生成」アクションを設定し、受信したメール本文をもとに返信文を作成するよう指示します。
- 最後に、オペレーションでGmailの「メールを送る」アクションを設定し、生成されたテキストを本文としてメールを返信します。
■このワークフローのカスタムポイント
- Gmailでメールを送信するアクションでは、送信先を任意のアドレスに設定することが可能です。
- 送信するメールの本文は、固定のテキストを設定したり、Anthropic（Claude）で生成したテキストなどの動的な情報を変数として埋め込んだりできます。
- Gmail、Anthropic（Claude）のそれぞれとYoomを連携してください。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- GitHubでの開発プロセスにおける、テストシナリオ作成の工数を削減したい開発チームの方
- AIエージェントの技術を活用して、テスト自動化の仕組みを構築したいと考えているQAエンジニアの方
- 手動でのテスト項目作成によるヒューマンエラーや、レビュー工数を削減したいプロジェクトマネージャーの方
- プルリクエストの更新をトリガーにAIがシナリオを自動生成するため、これまで手作業に費やしていた時間を短縮し、コア業務に集中できます。
- AIがコードの変更点に基づいたテストシナリオを生成するため、担当者による品質のばらつきを防ぎ、テストプロセスの標準化を実現します。
- はじめに、GitHub、Slack、Google スプレッドシートをYoomと連携します。
- 次に、トリガーでGitHubを選択し、「プルリクエストは作成または更新されたら」というアクションを設定します。
- 次に、オペレーションで「分岐」を設定し、更新時のみ後続の処理が行われるようにします。
- 最後に、オペレーションでAIワーカーを設定し、GitHubのプルリクエストからコードの変更内容を解析し、最適なテスト自動化シナリオを生成・提案するためのマニュアル（指示）を作成します。
■このワークフローのカスタムポイント
- AIワーカーへの指示（プロンプト）は、ユーザーの環境に合わせて自由にカスタムが可能です。例えば、特定のテストフレームワークを指定したり、トリガーで取得したプルリクエストのタイトルや本文を変数として埋め込んだりすることで、より精度の高いテストシナリオを生成できます。
- GitHub、Slack、Google スプレッドシートのそれぞれとYoomを連携してください。AIワーカー内で使用するツール（アプリ）についてもマイアプリ連携が必要です。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- 分岐はミニプラン以上のプランでご利用いただける機能（オペレーション）となっております。フリープランの場合は設定しているフローボットのオペレーションはエラーとなりますので、ご注意ください。
- ミニプランなどの有料プランは、2週間の無料トライアルを行うことが可能です。無料トライアル中には制限対象のアプリや機能（オペレーション）を使用することができます。
- AIワーカーの基本設定は「【AIワーカー】基本的な設定方法」をご参照ください。
- AIワーカーの同時実行数・作成可能なAIワーカー数・利用可能なAIモデルはご契約中のプランによって異なります。
- AIワーカー内でご利用いただけるアプリやオペレーション等はフローボットの利用制限と同様です。
- AIワーカーは、テスト実行でも本番実行と同様にタスクを消費しますのでご注意ください。詳細は「【AIワーカー】タスク実行数の計算方法」ご参照ください。
- AIワーカーはマニュアルを詳細に設定することで適切な処理を実行しやすくなります。詳細は「【AIワーカー】マニュアルの作成方法」をご参照ください。
- GitHubでのIssue管理における優先度付けや担当者割り振りに手間を感じている方
- GitHub AIエージェントのような仕組みを導入し、Issueのトリアージを自動化したい方
- 手作業によるIssueの仕分け作業をなくし、開発チームの生産性を向上させたい方
- Issue作成後の優先度判定と担当者アサインが自動化されるため、手作業での確認や割り振りにかかる時間を短縮できます
- AIが設定された基準で判断するため、担当者による判断のブレがなくなり、Issue管理業務の属人化を解消します
- はじめに、GitHubをYoomと連携します
- 次に、トリガーでGitHubを選択し、「Issueが新しく作成されたら」というアクションを設定します
- 最後に、オペレーションでAIワーカーを選択し、受け取ったIssueの情報をもとに優先度判定と担当者のアサインを行うためのマニュアル（指示）を作成します
■このワークフローのカスタムポイント
- GitHubのトリガー設定では、対象としたいリポジトリのオーナー名とリポジトリ名を任意で設定してください
- AIワーカーの設定では、利用したいAIモデルを選択し、Issueの内容からどのように優先度を判定し、誰をアサインするかの基準を指示として具体的に設定してください
- GitHubとYoomを連携してください。AIワーカー内で使用するツール（アプリ）についてもマイアプリ連携が必要です。
- トリガーは5分、10分、15分、30分、60分の間隔で起動間隔を選択できます。
- プランによって最短の起動間隔が異なりますので、ご注意ください。
- AIワーカーの基本設定は「【AIワーカー】基本的な設定方法」をご参照ください。
- AIワーカーの同時実行数・作成可能なAIワーカー数・利用可能なAIモデルはご契約中のプランによって異なります。
- AIワーカー内でご利用いただけるアプリやオペレーション等はフローボットの利用制限と同様です。
- AIワーカーは、テスト実行でも本番実行と同様にタスクを消費しますのでご注意ください。詳細は「【AIワーカー】タスク実行数の計算方法」ご参照ください。
- AIワーカーはマニュアルを詳細に設定することで適切な処理を実行しやすくなります。詳細は「【AIワーカー】マニュアルの作成方法」をご参照ください。
出典1：Claude Code/出典2：Claude Login
プログラミング知識なしで手軽に構築できます。
