Primeros pasos en Discord.JS

consecutes

Christopher

Posted on March 3, 2021

Primeros pasos en Discord.JS

Introducción

¡Hola!, estamos muy emocionados por darle comienzo a esta serie donde les daremos el empujón inicial hacia la API de Discord, antes que nada vamos a empezar por conocer lo que necesitamos para esta guía.

Requisitos:

  • Javascript básico, ya que es el lenguaje de programación que vamos a usar, aunque hay una variedad de librerias a su disposición, por ejemplo, Python. Sientete libre de probarlas para conseguir tu entorno de programación ideal.
  • Node(+NPM).
  • Editor de código (cualquiera).

Instalando Node

Primero debemos instalar la versión más reciente (o la que sea compatible con tu ordenador) de Node.

NODE1

Le recomendamos instalar la versión LTS debido a que es la que proporciona mayor estabilidad, pero si desea probar las últimas caracteristicas que ofrece Node instale la versión más reciente.

Las versiones más recientes de Node no soportan Windows 7, si usted es usuario de este sistema operativo debe instalar la versión 13 o anteriores.

Cabe destacar que el instalador trae consigo NPM, que será nuestro gestor de paquetes aliado a lo largo de todo este proceso.

Inicializando el proyecto

1. Creando cuenta del bot

Una vez instalado Node en nuestro sistema es hora de crear una cuenta para el bot en el portal de desarrolladores de discord.

Para acceder a el portal de desarrolladores deberás iniciar sesión con tu cuenta de discord, no te preocupes, es un portal oficial.

  1. Click en New application DISCORD2
  2. Ingresa el nombre que le quieras colocar a la aplicación en el portal DISCORD3
  3. Click en la pestaña bot DISCORD4
  4. Create new bot account DISCORD5 DISCORD6 Y aqui podrás editar datos como el nombre del bot, su foto de perfil, si va a ser público, etc. Guarda datos importante de la cuenta del bot, como el ID y el token ya que los usaremos más adelante.

NUNCA COMPARTAS DEL TOKEN DEL BOT, EL TOKEN ES LO QUE AUTENTICA LA CONEXIÓN ENTRE EL CÓDIGO Y LA API DE DISCORD, EL MISMO DEBE DE SER PRIVADO. TEN CUIDADO

Actualmente Discord te informa si el token de alguno de tus bots ha sido publicado en algún sitio, como por ejemplo, Github.

2. Invitando el bot al servidor

Ahora vamos a añadir el bot que acabamos de crear a un servidor, te recomendamos tener un servidor de pruebas a la hora de desarrollar bots, por si algo sale mal o simplemente para evitar distracción o saboteo por parte de otros usuarios.

Ingresa a este sitio web, en el cual podrás generar un link de invitación para el bot, simplemente debes introducir el ID del bot, sin preocuparte ya que el mismo es un dato público, en el mismo sitio podrás decidir que permisos le vas a dar al bot, te recomendamos dejarlo como administrador, pero al hacer un bot público tendrás que darle los permisos que necesite y que se adapten a sus funciones.
Alt Text

3. Instalando Discord.js

Vamos a empezar a usar el editor de código, te recomendamos Visual Studio Code, un editor de código desarrollado por Microsoft, de todas formas puedes usar el de tu preferencia.

Ahora sí, primero vamos a abrir una consola o terminal en la carpeta que vamos a utilizar para trabajar en el bot, y a ejecutar el siguiente comando para iniciar un proyecto con node.

npm init -y
Enter fullscreen mode Exit fullscreen mode

Esto lo que hará es crear el package.json el cual es el archivo raíz de nuestro proyecto, en el que se encontraran datos como el nombre del proyecto, la version, comandos de prueba, módulos instalados, y colocará estos valores según una plantilla que viene por defecto.

Tambien puedes usar

npm init
Enter fullscreen mode Exit fullscreen mode

Para introducir cada uno de los datos por ti mismo.

Alt Text

Ahora vamos a instalar paquete de discord.js con el siguiente comando:

npm i discord.js --save
Enter fullscreen mode Exit fullscreen mode

Alt Text

Y al cabo de unos segundos tendras una nueva carpeta creada llamada node_modules en esta carpeta se guardarán los paquetes que instales a medida de que vayas avanzando en el proyecto.

Encendiendo el bot

Te pudiste haber dado cuenta cuando añadiste el bot al servidor que este está desconectado, a partir de ahora vamos a empezar a trabajar con código en el lenguaje de programación Javascript, como dijimos en el principio, te recomendamos rotundamente dos cosas.

Alt Text

  1. Si no tienes los conocimientos básicos del mismo por favor, consulta algún curso, puedes conseguir muchos en Youtube de forma gratuita.

  2. Trata en lo posible de evitar el Copy&Paste, prueba escribir el código por ti mismo para que te acostumbres a la sintaxis de la libreria, recuerda que en el mundo de la programación todo se consigue con la práctica.

Ahora bien, en la carpeta que habiamos elegido en un principio para desarrollar el proyecto vamos a tener hasta ahora un archivo y una carpeta (node_modules y package.json), algo como esto:

Alt Text

En nuestro editor de código favorito vamos a crear un nuevo archivo el cual podemos titular como queramos, los nombres más comunes son app.js, server.js o bot.js, en lo que resta de la guía vamos a titular el archivo principal del bot como app.js.

Alt Text

Ahora en app.js vamos a comenzar declarando que necesitamos el modulo de Discord.js

const Discord = require('discord.js');
const client = new Discord.Client();
Enter fullscreen mode Exit fullscreen mode

Vamos a crear el evento ready el cual se llamará una vez el bot se haya iniciado correctamente.

client.on('ready', () => { 
    console.log('El bot se ha iniciado correctamente'); 
});
Enter fullscreen mode Exit fullscreen mode

Vamos a crear el evento message el cual es el evento fudamental de nuestro bot, el cual detecta cuando un usuario envia un mensaje en alguno de los servidores donde se encuentra el bot o via mensaje directo, el nombre con el cual nos referimos al objeto del mensaje puede ser cualquiera en realidad, los mas usados son msg o message, en lo que resta de guía nos vamos a referir al mismo como message.


client.on('message', (message) => {

//Código 

});
Enter fullscreen mode Exit fullscreen mode

Ahora por último añadiremos nuestro token, la cual es la llave que nos dará acceso a la cuenta del bot en si y por ende acceso a la API de Discord, recuerda no debes compartir este dato con nadie

client.login('token');
Enter fullscreen mode Exit fullscreen mode

Recuerda sustituir la palabra "token" por el que se le asignó a tu bot en el portal de desarrolladores de Discord.

Y eso sería todo, el código quedaría algo así:

const Discord = require("discord.js"); 
const client = new Discord.Client(); 

//Evento ready 

client.on('ready', () => { 

    console.log('El bot se ha iniciado correctamente');  

}); 

//Evento message 

client.on('message', (message) => { 

//Código 

}); 

client.login('token');
Enter fullscreen mode Exit fullscreen mode

Ahora, ¿por qué no probamos a añadir nuestro primer comando?
Vamos a añadir el siguiente código dentro del evento message

if(message.content.startsWith('!'+'ping')){
message.channel.send('¡Pong!');
};
Enter fullscreen mode Exit fullscreen mode

En la primera línea colocamos una condicional que va a devolver true en caso de que el contenido del mensaje que envie el usuario sea !ping, luego de eso el bot enviará un mensaje diciendo ¡Pong!, eso es lo que estamos haciendo en este código.

Finalmente vamos a encender el bot.
Simplemente debes abrir una terminal en al carpeta raíz del proyecto y ejecutar el siguiente comando

node app.js
Enter fullscreen mode Exit fullscreen mode

Alt Text

Hay una mejor forma, usando el módulo nodemon el cual lo que hace es mantener el bot encendido y lo reinicia de forma automática cada vez que realizamos un cambio en el código, es bastante útil, para instalarlo, en la misma consola ejecutamos el siguiente comando:

npm i nodemon -g
Enter fullscreen mode Exit fullscreen mode

El cual instalará de manera global el módulo, por lo que no vas a tener que instalarlo en cada proyecto que vayas a crear.

Utilizarlo es bastante sencillo, solo con un comando

nodemon app
Enter fullscreen mode Exit fullscreen mode

Si vamos a Discord, al servidor de pruebas en el que añadimos al bot podremos observar que el bot ya está en línea, ahora queda probar que el comando funcione correctamente.

Alt Text

Y listo, ya tienes un bot funcional, pero eso no es todo, si quieres seguir aprendiendo sobre este tópico, puedes revisar nuestras guías en las cuales ponemos a tu disposición temas como embeds, prefijos, reacciones y mucho más.

Esperamos que esta guía te haya sido de ayuda, recuerda seguirnos en nuestra cuenta de Instagram.

💖 💪 🙅 🚩
consecutes
Christopher

Posted on March 3, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Primeros pasos en Discord.JS
node Primeros pasos en Discord.JS

March 3, 2021