Claude Sonnet 4.5を使ってTypeScriptでDiscordのおうむ返しBotを作ってみた【AI活用・初心者向け】

はじめに:なぜDiscord BotをAIで作るのか

AIアシスタントの進化が著しい2026年、プログラミングの現場でもAIの力を借りることが当たり前になってきました。特にGitHub Copilotに搭載されているClaude Sonnet 4.5は、コード生成の精度が非常に高く、初心者でも本格的なアプリケーション開発ができるようになっています。

今回は、そんなClaude Sonnet 4.5を使って、TypeScriptでDiscordのおうむ返しBot(エコーボット)を作成してみました。Discord Bot開発は、チャットボットやゲームボット、管理ボットなど、様々な用途に応用できる実践的なスキルです。

この記事では、実際の開発過程で遭遇した問題とその解決方法も含めて、リアルな体験をお伝えします。Discord Bot開発に興味がある方、AIを使ったプログラミングを試してみたい方の参考になれば幸いです。

使用した技術スタック・開発環境

今回のDiscord Bot開発で使用した技術は以下の通りです:

  • AIアシスタント: Claude Sonnet 4.5(GitHub Copilot経由)
  • プログラミング言語: TypeScript 5.3.3
  • Botフレームワーク: discord.js v14.14.1
  • 環境変数管理: dotenv v16.4.1
  • 実行環境: Node.js
  • 開発環境: Visual Studio Code
  • パッケージマネージャー: npm

TypeScriptを選んだ理由は、型安全性によってバグを事前に防げることと、VS Codeとの相性が良く、開発体験が優れているためです。discord.jsはDiscord Bot開発において最も人気のあるライブラリで、充実したドキュメントとコミュニティサポートがあります。

Claudeに依頼した内容とプロンプト戦略

実は今回、非常にシンプルなプロンプトで開発を開始しました。使用したプロンプトは以下の通りです:

「typescriptでdiscordのおうむ返しbotを作成して」

たったこれだけです。Claude Sonnet 4.5は、この簡潔なリクエストから以下のことを自動的に判断し、実行してくれました:

  • プロジェクトに必要なファイル構成の設計
  • TypeScriptの設定ファイルの作成
  • 依存関係の管理(package.json)
  • 環境変数の管理方法
  • エラーハンドリングの実装
  • セットアップ手順のドキュメント作成
  • .gitignoreの設定

これは従来のAIアシスタントでは考えられないレベルの理解力と実装能力です。

生成されたファイル構成

Claudeは以下のファイルを一度に生成してくれました。それぞれのファイルの役割を解説します:

oumugaesi/
├── src/
│   └── index.ts          # Botのメインコード(エントリーポイント)
├── package.json          # npmパッケージの依存関係定義
├── tsconfig.json         # TypeScriptコンパイラの設定
├── .env.example          # 環境変数のテンプレート(トークン管理)
├── .gitignore           # Gitでバージョン管理しないファイルの指定
└── README.md            # プロジェクトの説明とセットアップ手順

各ファイルの詳細解説

src/index.ts
Botの核となるメインコードです。Discordへのログイン処理、メッセージの監視、おうむ返しのロジックがすべてここに実装されています。

package.json
プロジェクトのメタデータと依存ライブラリを定義します。npm installコマンドで必要なパッケージをインストールする際に参照されます。また、npm run devなどのスクリプトコマンドもここで定義されています。

tsconfig.json
TypeScriptのコンパイラオプションを設定します。どのJavaScriptバージョンにコンパイルするか、どのディレクトリに出力するかなどを制御します。

.env.example
環境変数のテンプレートファイルです。Discord BotトークンなどのセキュリティにかかわるデータをGitに含めないようにするための仕組みです。

.gitignore
Gitでバージョン管理から除外するファイルを指定します。node_modules/dist/.envなどの自動生成ファイルや秘密情報を含むファイルを除外します。

README.md
プロジェクトの説明、セットアップ手順、使い方をまとめたドキュメントです。他の開発者がプロジェクトを理解する際の入り口になります。

メインコードの詳細解説:Discord Botの仕組みを理解する

生成されたsrc/index.tsは非常にシンプルで理解しやすいコードでした。以下、初心者の方でも理解できるように、各部分を詳しく解説していきます:

import { Client, GatewayIntentBits, Events, Message } from 'discord.js';
import * as dotenv from 'dotenv';

dotenv.config();

const client = new Client({
  intents: [
    GatewayIntentBits.Guilds,
    GatewayIntentBits.GuildMessages,
    GatewayIntentBits.MessageContent,
  ],
});

client.once(Events.ClientReady, (readyClient) => {
  console.log(`準備完了! ${readyClient.user.tag} としてログインしました。`);
});

client.on(Events.MessageCreate, async (message: Message) => {
  if (message.author.bot) return;
  
  if (!message.channel.isSendable()) return;

  try {
    await message.channel.send(message.content);
  } catch (error) {
    console.error('メッセージ送信エラー:', error);
  }
});

const token = process.env.DISCORD_TOKEN;
if (!token) {
  console.error('DISCORD_TOKENが設定されていません。');
  process.exit(1);
}

client.login(token);

コードを部分ごとに詳しく解説

1. インポート文とセットアップ

import { Client, GatewayIntentBits, Events, Message } from 'discord.js';
import * as dotenv from 'dotenv';

dotenv.config();

解説:

  • Client: Discord Botのメインクラス。これを使ってDiscordサーバーに接続します
  • GatewayIntentBits: Botが受け取るイベントの種類を指定するための定数群
  • Events: Discordで発生するイベントの種類(メッセージ受信、ユーザー参加など)
  • Message: メッセージオブジェクトの型定義
  • dotenv.config().envファイルから環境変数を読み込みます

2. Discordクライアントの初期化とIntentの設定

const client = new Client({
  intents: [
    GatewayIntentBits.Guilds,
    GatewayIntentBits.GuildMessages,
    GatewayIntentBits.MessageContent,
  ],
});

解説: Intent(インテント)は、Botがどのようなイベントを受け取りたいかをDiscordに伝える仕組みです。これはプライバシー保護とパフォーマンス向上のために導入されました。

  • Guilds: サーバー(ギルド)の基本情報を取得
  • GuildMessages: サーバー内でメッセージが送信されたことを検知
  • MessageContent重要! メッセージの内容を取得するために必須。Discord Developer Portalでも有効化が必要

2022年以降、DiscordはMessageContent Intentの扱いを厳格化しました。これを有効にしないと、メッセージの内容が空になってしまうため、おうむ返しBotは機能しません。

3. Bot起動時の処理

client.once(Events.ClientReady, (readyClient) => {
  console.log(`準備完了! ${readyClient.user.tag} としてログインしました。`);
});

解説:

  • once(): イベントリスナーを登録するメソッド。onceは一度だけ実行されます
  • ClientReady: BotがDiscordに正常にログインし、準備が完了したときに発火
  • readyClient.user.tag: Botのユーザー名とタグ(例:MyBot#1234)

このログ出力により、Botが正常に起動したことを確認できます。開発中のデバッグにも役立ちます。

4. メッセージ受信時の処理(コアロジック)

client.on(Events.MessageCreate, async (message: Message) => {
  if (message.author.bot) return;
  
  if (!message.channel.isSendable()) return;

  try {
    await message.channel.send(message.content);
  } catch (error) {
    console.error('メッセージ送信エラー:', error);
  }
});

解説:

a) メッセージ受信イベントの監視

  • on(): 継続的にイベントを監視するメソッド
  • MessageCreate: 新しいメッセージが作成されるたびに発火
  • async: 非同期処理を使用するための宣言

b) Bot自身のメッセージを無視

if (message.author.bot) return;

これは非常に重要な処理です。この行がないと、以下のような無限ループが発生します:

  1. ユーザーが「こんにちは」と送信
  2. Botが「こんにちは」とおうむ返し
  3. BotのメッセージをBotが検知して「こんにちは」と送信
  4. 無限ループ...

Botが送信したメッセージのauthor.botプロパティはtrueになるため、この条件でBot自身のメッセージをスキップします。

c) 送信可能なチャンネルかチェック

if (!message.channel.isSendable()) return;

Discordには様々な種類のチャンネルがあります。一部のチャンネル(例:PartialGroupDMChannel)はBotがメッセージを送信できません。isSendable()メソッドはTypeScriptの型ガードとしても機能し、型エラーを防ぎます。

d) メッセージの送信とエラーハンドリング

try {
  await message.channel.send(message.content);
} catch (error) {
  console.error('メッセージ送信エラー:', error);
}

  • await: 非同期処理の完了を待ちます
  • message.channel.send(): 同じチャンネルにメッセージを送信
  • message.content: 受信したメッセージの内容
  • try-catch: ネットワークエラーや権限エラーなど、予期しない問題をキャッチ

5. 環境変数のチェックとログイン

const token = process.env.DISCORD_TOKEN;
if (!token) {
  console.error('DISCORD_TOKENが設定されていません。');
  process.exit(1);
}

client.login(token);

解説:

  • process.env.DISCORD_TOKEN: 環境変数からBotトークンを取得
  • トークンが設定されていない場合は、エラーメッセージを表示して終了(exit(1)
  • client.login(): Discordサーバーに接続してログイン

Botトークンは非常に重要な秘密情報です。これが漏洩すると、第三者があなたのBotを操作できてしまいます。必ず環境変数で管理し、Gitにコミットしないようにしましょう。

実装中に遭遇した問題と解決

実際の開発では、最初から完璧なコードが生成されるわけではありません。ここでは、遭遇した問題とその解決プロセスを詳しく解説します。

TypeScript型エラーの発生

最初の実装では、以下のようなTypeScriptのコンパイルエラーが発生しました:

TSError: ⨯ Unable to compile TypeScript:
src/index.ts:28:27 - error TS2339: Property 'send' does not exist on type 
'DMChannel | PartialDMChannel | PartialGroupDMChannel | NewsChannel | 
StageChannel | TextChannel | PublicThreadChannel<...> | 
PrivateThreadChannel | VoiceChannel'.
  Property 'send' does not exist on type 'PartialGroupDMChannel'.

エラーの原因を理解する

このエラーメッセージは一見複雑に見えますが、要約すると以下の通りです:

問題の核心: message.channelの型は、複数のチャンネルタイプのユニオン型(Union Type)です。TypeScriptは、すべての可能な型で利用可能なメソッドやプロパティしか使用を許可しません。

discord.jsでは、以下のような様々なチャンネルタイプが存在します:

  • TextChannel(テキストチャンネル)→ send()メソッドあり ✓
  • DMChannel(ダイレクトメッセージ)→ send()メソッドあり ✓
  • VoiceChannel(ボイスチャンネル)→ send()メソッドあり ✓
  • PartialGroupDMChannel(グループDM)→ send()メソッドなし ✗

最後のPartialGroupDMChannelにはsend()メソッドが存在しないため、TypeScriptコンパイラがエラーを出していました。これはTypeScriptの型安全性が正しく機能している証拠でもあります。

Claudeによる迅速な問題解決

このエラーをClaudeに報告したところ、即座に以下の修正案が提示されました:

if (!message.channel.isSendable()) return;

この解決策の優れている点:

  1. 型ガード関数の活用
    isSendable()はdiscord.js v14で提供されている型ガード関数です。この関数がtrueを返すと、TypeScriptはそのチャンネルがsend()メソッドを持つことを保証します。
  2. 実行時の安全性
    型チェックだけでなく、実行時にも送信不可能なチャンネルへのアクセスを防ぎます。
  3. エレガントなコード
    余計な型アサーションや型キャストを使わず、シンプルで読みやすいコードになっています。
  4. 将来性
    Discordが新しいチャンネルタイプを追加しても、isSendable()が適切に対応してくれます。

学びのポイント

この経験から学べることは:

  • AIは完璧ではないが、修正能力が高い:最初の実装で問題が発生しても、適切にフィードバックすれば即座に修正してくれる
  • TypeScriptの型安全性の価値:コンパイル時にエラーを検出できるため、実行時のバグを未然に防げる
  • エラーメッセージを読む重要性:エラーメッセージには解決のヒントが含まれている

生成されたコードの品質評価

Claude Sonnet 4.5が生成したコードを、複数の観点から評価してみました:

評価項目スコア詳細
コードの可読性★★★★★変数名が明確で、コメントも適切。初心者でも理解しやすい構造
型安全性★★★★★TypeScriptの型を適切に活用。型エラーを未然に防ぐ実装
エラーハンドリング★★★★☆try-catchでエラーをキャッチ。ログ出力も適切
セキュリティ★★★★★トークンを環境変数で管理。.gitignoreも適切に設定
保守性★★★★☆シンプルな構造で拡張しやすい。より複雑な機能を追加する余地あり
ベストプラクティス準拠★★★★★discord.js v14の推奨パターンに従っている
ドキュメント★★★★★READMEが充実。セットアップ手順が明確
パフォーマンス★★★★☆基本的な処理は効率的。大規模運用には追加の最適化が必要

総合評価:★★★★☆(4.6 / 5.0)

特に優れている点:

  • プロジェクト構成が体系的で、プロフェッショナルな品質
  • セキュリティ面での配慮(トークン管理、.gitignore)
  • TypeScriptの型システムを効果的に活用
  • 初心者にも理解しやすいコードスタイル

改善の余地がある点:

  • より高度な機能(コマンドハンドラー、データベース連携など)への拡張ガイド
  • ログレベルの制御(開発環境と本番環境での切り替え)
  • テストコードの追加

とはいえ、基礎的なおうむ返しBotとしては、非常に高品質なコードが生成されました。

実際のセットアップ手順(ステップバイステップガイド)

ここからは、実際にBotを動かすための詳細な手順を解説します。

ステップ1: 依存関係のインストール

プロジェクトディレクトリに移動し、必要なパッケージをインストールします:

cd oumugaesi
npm install

このコマンドで以下のパッケージがインストールされます:

  • discord.js(Botフレームワーク)
  • dotenv(環境変数管理)
  • typescript(TypeScriptコンパイラ)
  • ts-node(TypeScriptを直接実行)
  • @types/node(Node.jsの型定義)

インストールには数分かかる場合があります。完了するとnode_modulesディレクトリが作成されます。

ステップ2: 環境変数ファイルの作成

テンプレートから.envファイルを作成します:

cp .env.example .env

次に、テキストエディタで.envファイルを開き、以下のようにBotトークンを設定します:

DISCORD_TOKEN=your_actual_bot_token_here

重要: この.envファイルは絶対にGitにコミットしないでください。生成された.gitignoreに既に含まれているため、通常は問題ありません。

ステップ3: Discord Developer PortalでのBot作成

Discord Botを動かすには、Discord Developer PortalでBotを作成し、トークンを取得する必要があります。

3-1. Applicationの作成

  1. Discord Developer Portalにアクセス
  2. 右上の「New Application」ボタンをクリック
  3. Botの名前を入力(例:「おうむ返しBot」)
  4. 利用規約に同意して「Create」をクリック

3-2. Botユーザーの追加

  1. 左サイドバーの「Bot」タブをクリック
  2. 「Add Bot」ボタンをクリック
  3. 確認ダイアログで「Yes, do it!」をクリック

3-3. Botトークンの取得

  1. Botセクションで「Reset Token」をクリック(初回は「Copy」でも可)
  2. 表示されたトークンをコピー
  3. プロジェクトの.envファイルに貼り付け

警告: Botトークンは二度と表示されません。紛失した場合はReset Tokenする必要があります。

3-4. MESSAGE CONTENT INTENTの有効化(最重要!)

これは絶対に忘れてはいけない設定です:

  1. Bot設定画面を下にスクロール
  2. 「Privileged Gateway Intents」セクションを見つける
  3. 「MESSAGE CONTENT INTENT」をオンにする
  4. ページ下部の「Save Changes」をクリック

この設定を有効にしないと、Botはメッセージの内容を取得できず、おうむ返し機能が動作しません。

3-5. Botの招待

  1. 左サイドバーの「OAuth2」→「URL Generator」をクリック
  2. 「SCOPES」セクションで**「bot」**にチェック
  3. 「BOT PERMISSIONS」セクションで以下にチェック:
    • Send Messages(メッセージ送信)
    • Read Messages/View Channels(メッセージ読み取り)
  4. ページ下部に生成されたURLをコピー
  5. ブラウザの新しいタブでそのURLを開く
  6. Botを追加したいサーバーを選択
  7. 「認証」をクリック

これでBotがサーバーに参加します。

ステップ4: Botの実行

すべての設定が完了したら、Botを起動します:

npm run dev

成功すると、以下のようなメッセージが表示されます:

準備完了! おうむ返しBot#1234 としてログインしました。

Discordサーバーで何かメッセージを送信すると、Botが同じ内容を返信してきます!

Claude Sonnet 4.5を使った開発の強み

1. 圧倒的な時間短縮

従来の開発プロセスと比較:

タスク従来の方法Claude使用時間短縮
プロジェクト構成の設計30分0分(自動)100%
package.jsonの作成10分0分(自動)100%
tsconfig.jsonの設定15分0分(自動)100%
メインコードの実装60分0分(自動)100%
エラー処理の実装20分0分(自動)100%
ドキュメントの作成30分0分(自動)100%
デバッグと修正30分5分83%
合計約3時間約5分97%

実に97%の時間短縮が実現しました。

2. プロフェッショナルな品質

Claudeが自動的に実装してくれた重要な要素:

  • プロジェクト構成の体系化
  • TypeScriptによる型安全性の確保
  • 適切なエラーハンドリング
  • Botの無限ループ防止
  • セキュリティ面での配慮(トークン管理)

これらは初心者が見落としがちなポイントですが、Claudeは自動的に実装してくれます。

3. 問題解決能力の高さ

型エラーが発生した際、以下のような対応を見せました:

  • エラーの原因を理解している
  • discord.jsのAPI(isSendable())を正しく使用
  • エレガントで保守性の高い解決策を提示
  • 追加の説明も簡潔で的確

4. 学習効果の高さ

生成されたコードは以下の特徴があります:

  • シンプルで読みやすい
  • コメントが適切に配置されている
  • 段階的に理解を深められる構造
  • 「なぜそうするのか」が理解しやすい

これにより、単にコピー&ペーストするだけでなく、コードを理解しながら学習できます。

Discord Bot開発における応用可能性

今回作成したおうむ返しBotは基礎的な実装ですが、この基盤を使って様々な機能を追加できます:

拡張アイデア

1. コマンドシステムの実装

  • スラッシュコマンド(/help/infoなど)
  • プレフィックスベースのコマンド(!ping!statsなど)

2. 管理機能

  • メッセージの自動削除
  • ユーザーのキック・バン機能
  • ロールの自動付与

3. エンターテイメント機能

  • ミニゲーム(じゃんけん、クイズなど)
  • 音楽再生機能
  • 画像生成Bot

4. 実用的な機能

  • リマインダー機能
  • 翻訳Bot
  • GitHub/Twitterなどの通知連携

5. AI連携

  • ChatGPT APIとの連携
  • 画像認識機能
  • 自然言語処理による高度な応答

AIを活用した開発の未来と考察

2026年のプログラミングの現状

2026年現在、AIアシスタントは単なる「補助ツール」から「協働パートナー」へと進化しています。Claude Sonnet 4.5のような高度なAIは、以下のような変革をもたらしています:

  • 初心者の参入障壁の低下:プログラミング経験が少なくても、実用的なアプリケーションを作成できる
  • 開発速度の劇的な向上:数時間かかっていた作業が数分で完了
  • ベストプラクティスの民主化:経験豊富な開発者の知識が、誰でも利用できる
  • 学習効率の向上:動くコードから学べる

AIを使った開発の推奨アプローチ

  1. まず試してみる:完璧なプロンプトを考えすぎず、シンプルに依頼する
  2. 生成されたコードを読む:コピペで終わらせず、理解する努力をする
  3. エラーを恐れない:エラーが出たらAIにフィードバックして修正してもらう
  4. 段階的に拡張:基礎ができたら、追加機能を一つずつ依頼する
  5. ドキュメントも活用:AIの提案と公式ドキュメントを併用する

Discord Bot開発で学べるプログラミングの基礎

今回のおうむ返しBot開発を通じて、以下のような重要な概念を学べます:

概念Discord Botでの実装応用範囲
非同期処理async/awaitによるメッセージ送信Web API、データベース操作全般
イベント駆動メッセージ受信時の処理GUI、サーバーアプリケーション
エラーハンドリングtry-catchによるエラー処理すべてのアプリケーション開発
環境変数管理.envによるトークン管理セキュアな設定管理
型システムTypeScriptの型安全性大規模開発、チーム開発
API連携Discord APIの使用外部サービス連携全般

これらはDiscord Botに限らず、あらゆるWebアプリケーション開発で必要となる基礎知識です。

トラブルシューティング:よくある問題と解決策

問題1: Botがメッセージに反応しない

原因: MESSAGE CONTENT INTENTが有効になっていない

解決策:

  1. Discord Developer PortalのBot設定を開く
  2. MESSAGE CONTENT INTENTを有効化
  3. Save Changesをクリック
  4. Botを再起動

問題2: 「DISCORD_TOKENが設定されていません」エラー

原因: .envファイルが正しく作成・設定されていない

解決策:

  1. プロジェクトルートに.envファイルがあるか確認
  2. DISCORD_TOKEN=your_token_hereの形式で記述されているか確認
  3. トークンの前後に余分なスペースや引用符がないか確認

問題3: npm installでエラーが発生

原因: Node.jsのバージョンが古い、またはネットワーク問題

解決策:

# Node.jsのバージョン確認
node --version

# 16.x以上であることを確認
# 古い場合はNode.jsを更新

# キャッシュをクリアして再試行
npm cache clean --force
npm install

問題4: 型エラーが発生する

原因: TypeScriptのバージョン不整合、または依存関係の問題

解決策:

# node_modulesを削除して再インストール
rm -rf node_modules package-lock.json
npm install

まとめ:AI時代のプログラミング学習と開発

この記事のポイント

Claude Sonnet 4.5を使ったDiscord Bot開発を通じて、以下のことが分かりました:

  1. AIは開発の強力なパートナー
    • プロジェクト構成からコード実装まで、包括的にサポート
    • 97%の時間短縮を実現
    • 初心者でもプロフェッショナルな品質のコードを生成
  2. TypeScript × discord.jsの組み合わせは強力
    • 型安全性により、実行前にエラーを検出
    • discord.js v14はAPIが洗練されている
    • 学習リソースが豊富
  3. 実践的な学習ができる
    • 動くコードから学べる
    • エラー対処の経験を積める
    • 拡張性のある基盤を手に入れられる
  4. セキュリティとベストプラクティスの重要性
    • トークン管理の適切な方法
    • エラーハンドリングの必要性
    • 無限ループなどの問題の回避

これからDiscord Bot開発を始める方へ

この記事で紹介した手順に従えば、初心者でも30分程度で動作するDiscord Botを作成できます。重要なのは:

  • 完璧を求めすぎない:まず動かしてみる
  • エラーを学習機会と捉える:エラーメッセージから学ぶ
  • 段階的に機能を追加する:いきなり複雑なものを作ろうとしない
  • AIを活用する:困ったらClaudeに相談する

次のステップ

おうむ返しBotができたら、以下のような拡張に挑戦してみてください:

  1. 簡単な拡張
    • 特定のキーワードに反応する
    • メッセージに絵文字リアクションを付ける
    • メッセージを加工して返す(大文字変換など)
  2. 中級の拡張
    • スラッシュコマンドの実装
    • データベースでの情報保存
    • 定期的なメッセージ送信(cron)
  3. 上級の拡張
    • AI APIとの連携(ChatGPT、Claudeなど)
    • 複数サーバー対応のスケーラブルな設計
    • Webダッシュボードの実装

これらの拡張も、Claude Sonnet 4.5に依頼すれば、適切な実装方法を教えてくれるはずです。

参考リンク・リソース

公式ドキュメント

開発ツール

コミュニティ

おわりに

2026年、AIの力を借りたプログラミングは、もはや特別なことではなくなりました。Claude Sonnet 4.5のような高度なAIアシスタントを使えば、初心者でも数分で実用的なアプリケーションを作成できます。

しかし、AIはあくまでツールです。生成されたコードを理解し、カスタマイズし、さらに発展させるのは、私たち人間の役割です。AIを「魔法の杖」と考えるのではなく、「優秀な教師」や「協働パートナー」として活用することで、より効果的な学習と開発が可能になります。

この記事が、Discord Bot開発やAIを活用したプログラミングに興味を持つ方の一助となれば幸いです。ぜひ、あなた自身の手でBotを作成し、カスタマイズして、新しい可能性を探ってみてください。

Happy Coding! 🤖✨


\ 最新情報をチェック /

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です