Thomas Collart

Comment créer un Bot Discord en JS ?

Comment créer un Bot Discord avec NodeJS

Vous voulez dynamiser votre serveur Discord ? Vous ne trouvez pas le bot parfait qui fait ce que vous voulez ? Vous pensez donc à créer le votre ? Vous vous débrouillez en Javascript ?

Alors cet article de blog est fait pour vous ! J’ai developpé des centaines de bots au long de ma carrière et je vous dis tout.

Nous allons vous ensemble :

  • Quelle est la librairie js essentielle à utiliser
  • Comment faire un chatbot discord avec node js
  • Comment héberger son bot gratuitement ou pas

Attention ! Avant de commencer, peut-être que le bot ultime que vous cherchez existe déjà. Ou peut-être qu’une base de bot existe déjà sur GitHub. Pour vous en assurer et ne pas perdre de temps, n’oubliez pas de lire mon article de blog sur les bots discord.

Un tutoriel bot discord node js facile

Faire une application Discord n’est pas très compliqué. Dans ce tutoriel, nous utiliserons le JavaScript et les exemples de bases de bots disponibles sur le site officiel de Discord pour développeurs.

Comme je vous fournis la base du code, il ne vous reste plus qu’à y ajouter de la complexité à l’aide de conditions et autres structures de contrôle. Armé de ces connaissances fondamentales en code, vous devriez être capable de faire à peu près tout ce que vous voulez avec votre bot discord.

Si vous n’avez pas compris le paragraphe du dessus car vous n’avez pas les connaissances de base en code, je vous invite à apprendre la base du JavaScript sur FreeCodeCamp ou le tutoriel Apprendre à Coder avec Javascript sur OpenClassroom si vous ne parlez pas anglais.

Pourquoi Discord.js ?

Il est possible de créer des bots discord dans plusieurs langages de programmation. Que ce soit en Rust, Swift, Python, Ruby, PHP, Java ou autre, les développeurs de discord recommandent un certain nombre de librairies pour interagir avec leur API et une simple recherche Google ou sur Github vous permettra de trouver des APIs moins reconnues par l’équipe Discord dans votre langage de programmation préféré.

Programmer un bot discord v12 en Javascript avec Node JS

Pour ce tuto, c’est JavaScript que j’ai choisi pour sa simplicité et son universalité. Le JS prend le dessus sur beaucoup de fronts en programmation depuis ces dernières années. L’application de chat Discord elle-même est codée en JavaScript avec React, Electron et React-Native, toutes des librairies JS.

Mon blog mettant principalement l’accent sur le fait de “leverage” le code pour arriver à ses fins avec ces mêmes technologies, c’est donc tout naturellement que nous utiliserons la librairie discord.js v12 pour ce premier tuto sur l’utilisation des applications Discord.

Comment installer NodeJS ?

Utiliser Node JS avec discord.js

Node permet d’exécuter du javascript comme un programme, sur un ordinateur, un téléphone ou un serveur. Il s’installe comme un programme classique sur votre ordinateur ou par ligne de commande.

Installer Node JS sur Windows

Rendez-vous la page de téléchargement pour Windows de NodeJS et choisissez la version LTS pour Windows. Suivez le processus d’installation et vous devriez avoir tout ce qu’il faut pour commencer à programmer votre bot.

NodeJS pour Mac et Linux

Pour Mac et Linux, vous pouvez soit télécharger le GUI pour installer Node comme pour windows en allant sur la page de téléchargement pour Mac OSX ou Linux de NodeJS.

Si vous préférez passer par la console ou que vous êtes sur Linux, vous pouvez passer par votre gestionnaire de paquets préféré comme brew, apt, yum, dpkg, rpm, pacman ou un autre.

Installer discord.js

Avec Visual Studio Code ou PowerShell sur Windows ou votre terminal préféré sur Mac et Linux, rendez-vous dans le dossier dans lequel vous voulez créer votre bot discord. C’est un dossier dans lequel se trouveront les fichiers javascript et la configuration de votre bot. Vous pouvez le mettre n’importe où, du moment que ce soit un nouveau dossier vide pour rester organisé.

Une fois dans le dossier, initialisons le projet avec npm grâce à la commande :

npm init

Répondez oui à toutes les questions ou insérez les informations que vous voulez.

Si tout s’est bien passé, vous avez maintenant un dossier fermé dans lequel l’environnement de votre projet réside.

Installons maintenant discord.js v12 avec la commande :

npm install discord.js

Ou si vous préférez yarn :

yarn add discord.js

Voilà votre environnement de travail est prêt et vous avez tout ce qu’il faut pour commencer.

Configurer discord.js

Une fois Node installé, votre machine devrait avoir tout ce qu’il faut pour pouvoir installer la librairie discord.js et vous pourrez commencer à programmer le bot. Mais avant cela, il faut faire un petit tour sur le site de discord pour récupérer des identifiants, voyons tout cela ensemble.

Où mettre le client id et le token de discord dans votre code javascript ?

Retournez sur le portail de développeurs de Discord pour récupérer le token que l’on va mettre dans notre projet. Token Bot Discord sur le Portail du Développeur

Créez un fichier javascript, par exemple index.js et ce code pour commencer :

const Discord = require('discord.js');
const client = new Discord.Client();
const token =INSEREZ VOTRE TOKEN ICI’

client.once('ready', () => {
   console.log(Félicitations, votre bot Discord a été correctement initialisé !');
});

client.login(token);

Veillez à bien insérez votre token à la ligne 3 entre les apostrophes.

Sauvez votre fichier et lancez la commande node index.js (remplacez index.js par le nom de votre fichier si vous avez choisi un autre nom).

Si vous voyez le message Félicitations, votre bot Discord a été correctement initialisé !, c’est que tout s’est passé comme prévu, votre bot est bien lié à votre serveur discord et nous pouvons commencez à ajouter de l’intelligence pour qu’il fasse des choses utiles.

Note : Si on vous vole le token du bot, on a accès à votre bot, n’hésitez pas à le régénérer sur le Portail de Développeur Discord. Vous devrez alors remplacez l’ancien token dans votre code par le nouveau, l’ancien étant maintenant inactif.

Exploiter au mieux Discord.js

Vous possédez maintenant toutes les clés pour vous aider dans la réussite de votre serveur discord. Grâce aux différentes possibilités qu’un bot discord vous offre.

Félicitations, vous avez tout ce qu’il faut pour créer un bot original qui correspond exactement à vos attentes !

Je vous souhaite un serveur discord populaire grâce à son automatisation et que l’API discord.js vous mène vers d’autres créations par le code.

Vous avez maintenant un boilerplate qui fonctionne, le temps est venu de s’amuser en explorant l’API discord.js v12.

Il existe de nombreuses manières d’automatiser ses tâches et de créer des interactions avec ses membres. Je vous en montre 3 ici avec du texte, des images et de la voix.

Un auto repondeur en Javascript

client.on("message", message => {
  if (message.content === "!ping") {
    message.channel.send("Pong.")
  }
})

Créer une commande discord js

Vous savez maintenant intéragir simplement avec un serveur Discord. Pour une meilleure organisation, les bots discord js suivent une convention qui est de créer un dossier commands dans lequel on met toutes notes commandes. Ainsi, si on créait la commande pour kicker des utilisateurs, on aurait un fichier kick.js dans le dossier command et on appelerait la commande dans index.js.

Créez un dossier commandes à la racine du dossier.

Créez un fichier kick.js et utilisez ce code :

module.exports = message => {
  const member = message.mentions.members.first()
  if (!member) {
    return message.reply(`Utilisateur pas trouvé ou pas spécifié`)
  }
  if (!member.kickable) {
    return message.reply(`L'utilisateur n'est pas kickable`)
  }
  return member
    .kick()
    .then(() => message.reply(`L'utilisateur ${member.user.tag} a été kicked`))
    .catch(error => message.reply(`Une erreur s'est produite`))
}

Importez la commande dans votre fichier principal index.js, importez et appelez la commande kick comme ceci :

const kick = require("../commands/kick")
module.exports = (client, message) => {
  if (message.content.startsWith("!kick")) {
    return kick(message)
  }
}

Canva et Discord.js

Il faut installer une nouvelle librairie, Canvas, pour gérer les images :

npm i canvas

Ensuite, ajoutez à votre script le code suivant :

client.on("guildMemberAdd", async member => {
  const channel = member.guild.channels.cache.find(
    ch => ch.name === "member-log"
  )
  if (!channel) return

  const canvas = Canvas.createCanvas(700, 250)
  const ctx = canvas.getContext("2d")

  const background = await Canvas.loadImage("./wallpaper.jpg")
  ctx.drawImage(background, 0, 0, canvas.width, canvas.height)

  ctx.strokeStyle = "#74037b"
  ctx.strokeRect(0, 0, canvas.width, canvas.height)

  // Texte générique d'introduction avant le nom d'utilisateur
  ctx.font = "28px sans-serif"
  ctx.fillStyle = "#ffffff"
  ctx.fillText(
    "Bienvenue sur le serveur,",
    canvas.width / 2.5,
    canvas.height / 3.5
  )

  // Ajouter le nom d'utilisateur
  ctx.font = applyText(canvas, `${member.displayName}`)
  ctx.fillStyle = "#ffffff"
  ctx.fillText(
    `${member.displayName}!`,
    canvas.width / 2.5,
    canvas.height / 1.8
  )

  ctx.beginPath()
  ctx.arc(125, 125, 100, 0, Math.PI * 2, true)
  ctx.closePath()
  ctx.clip()

  const avatar = await Canvas.loadImage(
    member.user.displayAvatarURL({ format: "jpg" })
  )
  ctx.drawImage(avatar, 25, 25, 200, 200)

  const attachment = new Discord.MessageAttachment(
    canvas.toBuffer(),
    "bienvenue-image.png"
  )

  channel.send(`Bienvenue sur le serveur, ${member}!`, attachment)
})

La voix avec Discord js

client.on("message", async message => {
  // On rejoint le même salon que la personne qui a envoyé le message
  if (message.member.voice.channel) {
    const connection = await message.member.voice.channel.join()

    // Créer un dispatcher
    const dispatcher = connection.play("audio.mp3")

    dispatcher.on("start", () => {
      console.log("audio.mp3 a commencé !")
    })

    dispatcher.on("finish", () => {
      console.log("audio.mp3 s'est terminé !")
    })

    // Gestion d'erreurs !
    dispatcher.on("error", console.error)

    dispatcher.destroy()
  }
})

Les bots Discord js open source sur Github

Vous pouvez suivre le repo git associé à cet article sur github. Si vous comprenez l’anglais, voici la documentation officielle de discord.js et un guide complet qui reprend beaucoup d’exemples et de bonnes pratiques.

Héberger son bot discord js en ligne gratuitement

A ce stade, votre devriez être satisfait de votre bot qui devrait bien interagir avec votre serveur.

Il tourne bien sur votre ordinateur mais vous avez remarqué que quand votre script javascript ne tourne plus, le bot ne répond plus au serveur.

Dans l’idéal nous voudrions que notre bot tourne en continu, sans interruption et de manière stable, c’est là qu’un hébergeur est utile.

Ces hebergeurs fonctionnent aussi pour les bots et scripts developpes en d’autres languages de programmation. D’ailleurs, j’ai ecrit un article si vous voulez savoir comment savoir developper des bots discord en python.

On sait pourquoi il faut héberger son bot discord, regardons maintenant comment y arriver.

Host un Bot Discord js sur un VPS

Pour héberger votre bot, le plus facile est de passer par un VPS. Un Virtual Private Server ou un Serveur Dédié Virtuel est une session virtuelle sur une partie de serveur physique. Cette location de bout de serveur vous permet de profiter de la haute performance d’un serveur dans le cloud pour un prix réduit.

Certains des VPS les plus connus sont DigitalOcean, Heroku ou encore AWS EC2.

Voyons comment faire tourner votre script sur ces services.

Comment héberger son bot discord node js sur Heroku ?

Mettre un bot discord en ligne avec heroku Avant de pouvoir host sur heroku, il faut que vous compreniez Git. Si ce n’est pas le cas, il existe de nombreux tutos pour vous expliquer comment créer un compte github et y mettre votre code.

Sinon, commitez votre code avec git et inscrivez-vous sur Heroku. Un fois inscrit et votre compte validé, lancez dans la console la commande heroku login.

Pour que Heroku sache quoi faire de votre projet, créez un fichier nommé Procfile avec comme contenu :

worker: npm start

Et ajoutez dans le fichier package.json, la commande associée :

"start": "node index.js"

Ensuite, tapez dans la console :

heroku create LE_NOM_DE_VOTRE_BOT_DISCORD
git remote add heroku https://git.heroku.com/LE_NOM_DE_VOTRE_BOT_DISCORD.git
git push heroku master

DigitalOcean pour host son bot Discord JS

Vous pouvez aussi faire tourner le bot de manière permanente sur DigitalOcean pour moins de 5 euros par mois avec la plus petite Droplet.

D’ailleurs, si vous n’avez pas encore de compte DigitalOcean, vous pouvez utiliser mon lien d’affiliation pour recevoir 100 dollars de crédit pour recevoir près de 2 ans d’hébergement gratuit.

Mettre son bot discord js sur AWS EC2

Si vous êtes familier avec les Amazon Web Services, il est aussi possible d’host son bot dessus. Utiliser EC2 est l’approche la plus simple mais vous expliquer comment faire pourrait être un article de blog à lui tout seul ! Google est votre ami si c’est le chemin que vous voulez emprunter pour héberger votre bot.

Vous avez maintenant la base d’un bot discord nodejs !

Dans cet article vous avez découvert :

  • comment créer son propre bot discord en node js
  • quelles sont les principales commandes de base
  • comment organiser votre code et vos commandes

En plus, vous avec pu l’héberger gratuitement sur Heroku ou en payant avec d’autres services.

Maintenant c’est à vous de jouer, explorer les possibiltés pour les bots discord avec javascript, inspirez-vous de ce que vous trouvez sur Github et ailleurs et n’hésitez pas à me partager vos créations sur Twitter avec le lien ci-dessous.



Je m'appelle Thomas. Depuis ma sortie de la première promo de l'École 42, j'ai développé une app qui a été téléchargée plus de 400.000 fois. J'ai lancé près de 10 idées de startups et de nombreux autres business. Sur ce blogue, je vous apprends comment utiliser le Code pour devenir libre.

Envie de gagner plus d'argent avec le code ?
Suivez la newsletter !
Désinscrivez-vous quand vous voulez
Gratuit, c'est un très bon prix
Les emails sont gratuits. Vos informations sont stockées de manière sécurisée et privée. Vous pourrez vous désinscrire en un clic et à tout moment.