Discord.js v14 botの作り方【基礎・埋め込み編】 (2024/5/22現在)

# Discord.js とは
Discord.js (以下d.js) とは、discordのbotを開発するときに使用するパッケージの1つです。
同様に、Discord.pyというものがあります。これはpythonで開発する場合のパッケージになります。
詳しくは[こちら](https://qiita.com/minoru_kinugasa/items/e1bdee4ca016b2a38e2c)をごらんください！

# 埋め込みとは
見たほうが早いです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3794632/e9f599f1-93c4-cfa4-8cc6-362bbeadca13.png)
これです。
この埋込みはすべてのプロパティが入っていますが、タイトルだけ や 画像だけ という埋め込みを送信することもできます。

### 送信方法
`send()`関数の中にオブジェクトで`embed`を入れます。
これも見たほうが早いです。
```js:index.js
const { Client, GatewayIntentBits, EmbedBuilder } = require('discord.js');
const { token } = require('./config.json');
const client = new Client({
    intents: [
        GatewayIntentBits.Guilds,
        GatewayIntentBits.GuildMessages,
        GatewayIntentBits.MessageContent
    ]
});

client.once('ready', async () => {
    console.log(`${client.user.tag}で起動しました！`);

    const channel = client.channels.cache.get("1242400992251744318");
    if (channel) {
        channel.send({
            embeds: [
                new EmbedBuilder()
                    .setColor(0x0099FF)
                    .setTitle('Some title')
                    .setURL('https://discord.js.org/')
                    .setAuthor({ name: 'Some name', iconURL: 'https://i.imgur.com/AfFp7pu.png', url: 'https://discord.js.org' })
                    .setDescription('Some description here')
                    .setThumbnail('https://i.imgur.com/AfFp7pu.png')
                    .addFields(
                        { name: 'Regular field title', value: 'Some value here' },
                        { name: '\u200B', value: '\u200B' },
                        { name: 'Inline field title', value: 'Some value here', inline: true },
                        { name: 'Inline field title', value: 'Some value here', inline: true },
                    )
                    .addFields({ name: 'Inline field title', value: 'Some value here', inline: true })
                    .setImage('https://i.imgur.com/AfFp7pu.png')
                    .setTimestamp()
                    .setFooter({ text: 'Some footer text here', iconURL: 'https://i.imgur.com/AfFp7pu.png' })
            ]
        })
    }
});
```
これで、画像と同じ埋め込みを送信することができます。

### 知っておいたほうがいいこと
画像やタイトルなど、大体のものは英単語通りのものを指定できますが、embedにはいくつかルールがあります。

**・タイトルにメンションを含むことはできない**
これは、そのままですがタイトルにユーザーメンション、チャンネルメンション、その他すべてのメンションを含むことはできません。


**・同じコンポーネントを複数使用できない**
これは、わかりにくいかもしれませんが、例えば`.setDescription()`を2つ設定することで、2つdescriptionを設定できるわけではありません。改行などを駆使して使う必要があります。


**・同時に通常メッセージや、添付ファイルをメッセージに入れることができる。**
`embeds: []`の中に埋め込みがあるので、同じように
`content: "テキスト"`や`components: []`などもメッセージに含むことができます。


**・1つのメッセージに複数の埋め込みを入れることができる。**
`embeds: []`の中には、`new EmbedBuilder()`を1つ以上含む事ができます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3794632/18b8b4e6-d490-b6b7-4bfd-8d56c566a8a7.png)
コードは
```js:index.js
channel.send({
    embeds: [
        new EmbedBuilder()
            .setColor(0x0099FF)
            .setTitle('1つ目のうめこみ'),
        new EmbedBuilder()
            .setColor(0x0099FF)
            .setTitle('2つ目のうめこみ'),
            new EmbedBuilder()
            .setColor(0x0099FF)
            .setTitle('3つ目のうめこみ'),
            new EmbedBuilder()
            .setColor(0x0099FF)
            .setTitle('4つ目のうめこみ'),
            new EmbedBuilder()
            .setColor(0x0099FF)
            .setTitle('5つ目のうめこみ')
    ]
});
```
注意として、2つ目以降の`new EmbedBuilder()`を作るときは、`,`を忘れないようにしてください。

# 終わりに
今回はembed、埋め込みの使い方を完結にまとめました！
結構いろんなメソッドがあって複雑ですが、使ってみたら意外と簡単なのでぜひやってみてください！

他にも、メッセージ関連の情報の記事をいくつか書いているのでぜひごらんください！