DEV Community

Cover image for Primeiro bot do Discord para envio de lembrete: do zero ao deploy! #PASSO1️⃣
Jackson Dhanyel Santin
Jackson Dhanyel Santin

Posted on • Updated on

Primeiro bot do Discord para envio de lembrete: do zero ao deploy! #PASSO1️⃣

Como iniciar o projeto sem saber nada?

Bom, como sendo meu primeiro bot para o discord meu conhecimento somava um total de 0 😆, mas faz parte, tendo em vista que comecei a mexer com javascript no final do ano passado.
Eu tive muito da ajuda de canais no youtube e do próprio chatGPT para o desenvolvimento e entendimento da aplicação.
Com a internet, hoje em dia, só não programa e não aprende quem não quer mesmo, não é?! Então, pensando nisso, e no fato de que eu precisava criar algo que me lembrasse de fazer algumas coisas no dia-a-dia que eram importantes, eu resolvi ir atrás de aprender e é isso mesmo que pretendo compartilhar nesse post.

Obs.: É fundamental que se tenha uma conta criada no discord!

Passo 1: Criar um servidor no Discord.

Com o Discord aberto, você precisa criar um servidor (pode ser com o nome que você vai dar ao seu bot, ou qualquer outro nome que desejar) para dar segmento aos próximos passos.

Image description

Image description

Se não quiser selecionar aqui, pode dar um skip this question.

Image description

Aqui você pode dar o nome que desejar e até adicionar uma foto de perfil do servidor.

Image description

Finalizado, ele abrirá dessa forma.

Image description


Passo 2: Criar uma nova aplicação no Discord Developer.

Primeiro você precisa acessa o Developer Portal e ir na opção New Application, conforme mostra na imagem abaixo.

Image description


Passo 3: Gerar a URL do bot.

Após criar a aplicação, você vai precisar acassar o menu OAuth2 >> URL Generator e marcar a opção BOT, feito isso, será gerada uma URL no campo GENERATED URL, basta copiar ela e abrir ela em nova aba no navegador.

Image description

Obs.: Se a URL não for gerada marcando a opção BOT, você precisará marcar a opção ADMINISTRADOR nas opções que serão abertas ao selecionar a opção BOT, conforme imagem.

Image description

Passo 4: Marcações importantes que precisam ser feitas no Developer Portal.

Antes de partirmos para o link que foi gerado e aberto em nova aba na web, precisamos finalizar um item importante aqui no Developer Portal para que depois possamos codificar com total acesso as informações. Algumas marcações precisam ser realizadas, para isso, você vai precisar acessar o menu BOT e encontrar o título Privileged Gateway Intents, no final da página e marcar as três opções, logo após salvar.

Image description


Passo 5: Autorizar o bot a entrar no servidor.

Agora sim, vamos dar a permissão para que o bot possa acessar o nosso servidor que criamos lá no passo 1, para isso, vamos ir naquela aba aberta com a URL que foi gerada e vamos selecionar o nossos servidor, após, ir na opção Authorize.

Image description

Após autorizar ele provavelmente irá pedir para confirmar que é um humano, após confirmar, se tudo der certo, essa tela deverá aparecer para você e inclusive a notificação no canto inferior direito.

Image description

No servidor que criamos no discord no Passo 1 deverá aparecer uma nova mensagem dando as boas vindas para o bot e inclusive mostrando que ele está ali, mas offline.

Image description


Passo 6: Ferramentas necessárias e indispensáveis.

Primeiramente, você precisa ter instalado em sua máquina dois itens fundamentais, uma IDE para poder criar o código (e ai eu recomendo o VS CODE, mas também tem o Sublime Text ou o Eclipse, além de vários outros) e você também vai precisar ter instalado o Node.Js para que depois possamos instalar as dependências necessárias pare realizar a aplicação.


Passo 7: Instalando dependências necessárias.

Inicialmente vamos começar criando uma pasta em algum lugar do seu computador, eu normalmente gosto de criar na Área de Trabalho, mas isso depende muito de cada pessoa, eu criei a pasta com o nome bot-discord.

Image description

Após criada a pasta, vamos abrir a nossa IDE (no meu caso o VS Code) e vamos abrir a pasta que criamos.

Image description

Após abrir, vamos abrir o terminal (pode ser do VS Code mesmo) e roda o comando abaixo:

$ npm init
Enter fullscreen mode Exit fullscreen mode

Após rodar o comando acima, ele vai pedir algumas coisas, basta dar ENTER em todas elas e no final, terá o seguinte retorno:

{
  "name": "bot-discord",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}
Enter fullscreen mode Exit fullscreen mode

Além desse retorno no terminal, na pasta onde criamos, dentro do VS Code, vai aparecer o arquivo package.json.

Image description

Nesse ponto já podemos começar a baixar algumas dependências que iremos precisar, a principal dela é a Discord.js, então vamos baixá-la.

$ npm install discord.js
Enter fullscreen mode Exit fullscreen mode

Também vamos precisar ter o node-cron ou node-schedule para trabalharmos com cron job, no meu caso, estarei utilizando o node-schedule.

$ npm install node-schedule
Enter fullscreen mode Exit fullscreen mode

Também vamos precisar instalar o fs que é uma lib para gerenciamento de arquivos do sistema, ele permite ler arquivos, renomear, criar, atualizar e excluir, mas não irei me aprofundar muito nesse assunto, vamos ao que interessa.

$ npm install fs
Enter fullscreen mode Exit fullscreen mode

Passo 8: Criando arquivos e montando estrutura do projeto.

Vamos começar criando um arquivo bot.js (ou pode ser index.js), vamos precisar criar também um arquivo config.json, também vamos criar uma pasta chamada Comands(ou o nome que desejar, lembrando que essa pasta eu criei com a primeira letra maiúscula) e dentro dessa pasta uma outra pasta general (tudo minúsculo e também pode ser um outro nome que desejar), ali dentro criaremos o arquivo sendMessage.js.
Fora da pasta Comands, ou seja, na raíz do projeto, criaremos uma pasta chamada handler e dentro dela o arquivo
index.js, a estrutura de arquivos, então, ficará dessa forma.

.
├── Comands
│   └── general
│       └── sendMessage.js
├── handler
│   └── index.js
├── bot.js
├── config.json
├── package.json
Enter fullscreen mode Exit fullscreen mode

Passo 9: Configurando a pasta config.json.

Esse arquivo vai conter o token do seu bot, é muito importante que esse token não seja espalhado e muito menos divulgado no github quando for publicá-lo (caso suba ele no github, claro). Por isso, se pretende subir esse projeto no seu github, como eu fiz com o meu, você precisa criar um arquivo .gitignore e dentro dele informar o nome do arquivo config.json, dessa forma.

// arquivo .gitignore
config.json
Enter fullscreen mode Exit fullscreen mode

Agora sim, sabendo disso, vamos montar a estrutura do arquivo.

{
  "token": "TOKEN_DO_SEU_SERVIDOR_DISCORD"
}
Enter fullscreen mode Exit fullscreen mode

Para encontrar esse token, você precisa ir no Developer Portal, no menu Bot e na opção Reset Token e então copiá-lo e colar ele no lugar do "TOKEN_DO_SEU_SERVIDOR_DISCORD", dentro do arquivo config.json.

Image description

Ficará dessa forma o arquivo.

{
  "token": "123456fdsd78sd54d"
}
Enter fullscreen mode Exit fullscreen mode

Passo 10: Hora de fazer acontecer!!!

Agora vamos começar a trabalhar no nosso bot e na sua funcionalidade de enviar lembretes. Primeiramente, dentro do arquivo bot.js vamos adicionar esse código.

1 const Discord = require("discord.js");
2 const config = require("./config.json")
3 const client = new Discord.Client({ 
4  intents: [
5   "Guilds", 
6   "GuildMembers", 
7   "MessageContent", 
8   "GuildMessages"
9  ] 
10 });
11
12 module.exports = client
13
14 client.on('interactionCreate', (interaction) => {
15
16  if (interaction.type === 
17  Discord.InteractionType.ApplicationCommand) {
18
19    const cmd = client.slashCommands
20    .get(interaction.commandName);
21
22    if (!cmd) return interaction.reply(`Error`);
23
24    interaction["member"] = 
25    interaction.guild.members.cache
26    .get(interaction.user.id);
27
28    cmd.run(client, interaction)
29
30  }
31 })
32
33 client.on("ready", () => {
34 console.log(`Estou online em ${client.user.username}`)
35
36  client.user.setActivity({
37    name: 'Lembrete',
38    type: Discord.ActivityType.Watching
39  })
40 })
41
42 client.slashCommands = new Discord.Collection()
43 require("./handler")(client)
44
45 client.login(config.token)
Enter fullscreen mode Exit fullscreen mode

Para facilitar a explicação eu adicionei o número das linhas ao lado, então vamos lá.

Linha Explicação
1 Importa a biblioteca do discord.js.
2 Importa o arquivo config.json com o nosso token.
3 Novo cliente é criado usando a classe Discord.Client(). O parâmetro intents especifica quais eventos o bot irá ouvir.
12 Exporta o objeto cliente.
14 É um ouvinte de eventos que lida com interações de comandos de aplicativo no Discord. Essa parte do código é responsável por receber e processar os comandos de aplicativo no Discord, permitindo que o bot execute ações específicas em resposta a esses comandos.
33 É um ouvinte de eventos do evento ready.
34 Mostra uma mensagem no console do terminal mostrando a mensagem "Estou online em Lembretes" para que possamos identificar se realmente está funcionando.
42 Nestas linhas, uma nova coleção slashCommands é criada e atribuída ao objeto client. Em seguida, um arquivo chamado "handler.js" é importado e executado.
45 O código faz o login do bot utilizando o token fornecido no arquivo config.json.

Próximo passo, vamos adicionar essa função dentro da pasta handler >> index.js.

1 const fs = require("fs")
2
3 module.exports = async (client) => {
4
5  const SlashsArray = []
6
7  fs.readdir(`./Comands`, (error, folder) => {
8    folder.forEach(subfolder => {
9      fs.readdir(`./Comands/${subfolder}/`, (error, files) => {
10        files.forEach(files => {
11
12          if (!files?.endsWith('.js')) return;
13          files = require(`../Comands/${subfolder}/${files}`);
14          if (!files?.name) return;
15          client.slashCommands.set(files?.name, files);
16
17          SlashsArray.push(files)
18        });
19      });
20    });
21  });
22  client.on("ready", async () => {
23    client.guilds.cache.forEach(guild => 
24    guild.commands.set(SlashsArray))
25  });
26 };

Enter fullscreen mode Exit fullscreen mode
Explicação
Essa função lê os arquivos de comandos de slash de um diretório, carrega esses arquivos como módulos, adiciona-os ao mapa "slashCommands" do cliente e define esses comandos para cada servidor quando o cliente está pronto.

Por fim, vamos adicionar essa função ao arquivo sendMessage.js.

1 const Discord = require("discord.js");
2 const schedule = require("node-schedule");
3 const client = require("../../bot")
4
5 const jobOne = schedule.scheduleJob("0 8 * * *", () => {
6  sendMessage("8:00", "Correr");
7 });
8
9 const jobTwo = schedule.scheduleJob("0 12 * * *", () => {
10  sendMessage("12:00", "Caminhar");
11 });
12
13 async function sendMessage(time, activity) {
14  const channelToSend = await client.channels
15    .fetch("1113553458931437720")
16    .catch(() => null);
17
18  if (channelToSend) {
19    const embed = new Discord.EmbedBuilder()
20      .setDescription(`Olá, são ${time}, hora de  
21      ${activity}`)
22      .setColor(0x2a3756);
23
24    channelToSend.send({ embeds: [embed] });
25  }
26 }
Enter fullscreen mode Exit fullscreen mode
Linha Explicação
1 Importa a biblioteca do discord.js.
2 Importa a biblioteca do node-schedule.
3 Exporta o objeto cliente de dentro do **bot.js.
5 Cria uma variável jobOne que chama a função scheduleJob de dentro de schedule e define o horário em que quer que a função sendMessage execute, nesse caso às 08:00h da manhã ele vai chamar a função passando o horário como string "08:00" e o nome da atividade que deve ser feita, no caso "Correr".
9 Cria uma variável jobTwo que chama a função scheduleJob de dentro de schedule e define o horário em que quer que a função sendMessage execute, nesse caso às 12:00h da manhã ele vai chamar a função passando o horário como string "12:00" e o nome da atividade que deve ser feita, no caso "Caminhar".
13 Cria a função sendMessage que recebe o time e activity como parâmetro.
14 Cria um parâmetro channelToSend e passa por parâmetro no fetch o ID do canal após as explicações, explico como encontrar o ID do canal.
18 Esse trecho de código verifica se a variável channelToSend está definida e não é nula. Se for verdadeiro, cria uma instância de um objeto Embed do Discord com uma descrição contendo uma mensagem de saudação, o horário atual e uma atividade. O objeto Embed também define uma cor para o visual da mensagem. Em seguida, a função send() é chamada no channelToSend para enviar a mensagem contendo o objeto Embed como um parâmetro. Essa mensagem é exibida no canal de texto especificado pela variável channelToSend.

Passo 11: Como encontrar o ID do canal?

Agora explicarei como encontrar o ID que foi comentado no passo anterior.
Primeiramente, você precisará estar com o modo desenvolvedor do discord ativado.

Image description

Após ativar, é só ir no servidor que criamos no passo 1 e no canal que general, pressionar o botão direito do mouse >> copy Channel ID.

Image description

Top comments (2)

Collapse
 
jgjunior023 profile image
José

Bom dia,

O meu não dá certo, fiz tudo conforme descrito no passo a passo.

Collapse
 
jacksonsantin profile image
Jackson Dhanyel Santin • Edited

Bom dia!

Qual parte está ocorrendo o erro? Consegue compartilhar?
Se tiver publicado no github, dai consigo dar uma olhada também, para te auxiliar.