1. Afin de faciliter votre navigation sur le site, nous utilisons des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation de cookies. En savoir plus.
  2. Nous vous recommandons fortement de vous inscrire sur le forum pour bénéficier de toutes les fonctionnalités : S'enregistrer !

[Tutoriel] Créer un BOT Discord (NodeJS)

Discussion dans 'Développement (Autres)' créé par DrLegend, 24 Avril 2019.

  1. DrLegend

    DrLegend Homme mystérieux ✨
    Staff Helper Ancien

    Inscrit:
    19 Septembre 2016
    Messages:
    152
    J'aime reçus:
    70
    Tutoriel : Comment créer un BOT Discord

    Avoir des bots sur son serveur Discord peut être utile, mais la plupart ont besoin d'en utiliser plusieurs afin d'avoir les fonctions souhaités, de plus utiliser des bots publiques ne permet pas d'avoir + d'originalité dans votre serveur.
    C'est pour cela que votre cher Docteur (moi :3) va vous enseigner le développement d'un bot !



    Sommaire :
    • Introduction
    • Installations / Requis
    • Créer le profile du Bot
    • Donner la vie au Bot
    • Créer des commandes basiques



    ♦ Introduction ♦
    Avant de commencer, il faut savoir que cela ne va pas vous sembler facile au départ.
    En effet, au départ vous pourrez probablement vous perdre et sembler que c'est impossible pour vous.
    Mais n'ayez guère de soucis, si vous suivez à la lettre tout ce que j'ai écrit et que vous prenez votre temps de bien comprendre, ce sera plus simple. Et s'il y a le moindre soucis, n'hésitez pas à me le dire je vous dépannerais !
    PS : Je ne suis pas un expert dans la matière, juste un simple développeur qui code à sa manière.


    Il existe plusieurs langages de programmation, les plus connus pour coder des bots sont :
    Dans notre cas, on va utiliser le NodeJS ! (JavaScript pour ceux qui ont déjà lu ce mot)
    Nous allons dans ce cour, installer les éléments requis pour développer le bot et créer la base du bot.
    On va à la fin créer des commandes telles que les infos du serveur et créer la Boule Magique 8 !
    C'est parti !


    ♦ Installations / Requis ♦
    Afin de concevoir un bot, 2 éléments sont nécessaires :
    - Un éditeur de code
    - NodeJS


    Pour l'éditeur de code, je vous recommande fortement Visual Studio Code !

    https://code.visualstudio.com/download

    En ce qui concerne NodeJS, téléchargez-le ici :
    https://nodejs.org/fr/
    Téléchargez et installez ces deux logiciels, une fois fait on passe à l'étape suivante !



    ♦ Créer le profile du Bot ♦
    Il faut créer le profile du Bot Discord, pour cela rien de plus simple que d'aller sur le site Discord !
    Vous devrez vous connecter et aller sur la page des applications :
    https://discordapp.com/developers/applications/

    Ensuite, vous cliquez sur "New Application" situé en haut à droite :
    [​IMG]

    Vous remarquerez que j'ai déjà 2 bots, tous deux sont codés eux aussi en NodeJS

    Ensuite, vous allez devoir écrire le nom de votre bot, pour ma part je l'ai nommé Teuchi
    (Non ce n'est pas "shit" à l'envers, c'est le nom du vendeur de nouilles dans Naruto.) ensuite vous validez et vous êtes redirigé sur la page du profile de votre bot !
    [​IMG]

    Ajoutez donc une image à votre bot ! (la description n'est pas nécessaire)
    Et ensuite, vous cliquez sur l'onglet à gauche "Bot" !

    Cela vous amène sur une page, cliquez donc sur "Add Bot", Discord vous demande une confirmation vous confirmez donc.
    Et là vous... vous avez créé un bot !

    [​IMG]


    Sauf qu'il n'y a rien dedans et qu'il est Hors-Ligne en permanence :c
    Désormais, il nous qu'à attribuer les permissions au Bot et l'inviter sur un serveur !
    Pour cela, je vous recommande d'aller sur le site qui vous permettra de générer un lien d'invitation du Bot avec les permissions nécessaires :
    https://discordapi.com/permissions.html#0


    Il vous faudra ensuite cocher les permissions que vous souhaitez.
    Ensuite, en bas vous remarquerez qu'il faut indiquer le Client ID de votre Bot !
    Pour l'avoir, il suffit d'aller sur la page du profile de votre Bot, vous avez "CLIENT ID" et vous copiez le nombre qui suit !
    Retournez sur la page des permissions et collez ce nombre dans Client ID.
    Une fois fait, vous n'avez juste qu'à cliquez sur le lien blanc en dessous pour inviter le bot !

    [​IMG]


    ♦ Donner la vie au Bot ♦
    Et le voilà ! Le bot est normalement sur votre serveur !
    En tout cas, il est bien sur le mien :

    [​IMG]

    On peut donc voir qu'il est bien reconnu tel un Bot, cependant il y a un soucis...
    Bah il est hors-ligne mon cher Didier !

    Maintenant, il est temps de lui donner la vie et ça veut aussi dire : Passer au codage

    Ouvrez votre éditeur de code, dans notre cas c'est Visual Studio Code.
    [​IMG]

    Vous n'aurez pas les mêmes couleurs que j'ai, j'ai changé le thème du logiciel ^^'
    [​IMG] [​IMG]

    Afin de créer les fichiers du Bot, on va d'abord créer un dossier !

    - Créez donc où vous souhaitez, un dossier où serons inclus tous les fichiers du Bot !
    - Retournez sur Visual Studio Code, et allez dans "File" et "Open Folder", et là vous sélectionnez le dossier créé.


    Ainsi, vous avez un tableau d'éléments à votre gauche avec le nom du dossier

    [​IMG]

    Par la suite, il nous faut le Terminal de l'éditeur.

    - Cliquez donc en haut sur "Terminal" et cliquez "New Terminal"
    - Vous aurez en bas, une petite fenêtre ! Cliquez dessus et tapez :
    npm init

    Appuyez sur la touche Entrée, plusieurs lignes vont s'afficher.. Vous n'avez juste à taper plusieurs fois sur Entrée pour tout valider, ainsi on a un nouveau fichier nommé "package.json"

    Ensuite, toujours sur le Terminal, tapez :

    npm i --s discord.js
    Une fois que la commande est exécutée, on a un autre fichier nommé "package-lock.json" et un dossier "node_modules".
    [​IMG]

    Ensuite, on va créer un fichier (clique droit dans le tableau à gauche) et on le nomme:

    index.js
    Une fois fait, on écrit dans ce fichier les lignes suivantes :
    Code:
    const Discord = require('discord.js');
    
    const bot = Discord.Client();
    
    bot.on('ready', function () {
        bot.user.setStatus('online')
        bot.user.setActivity("cuisiner des ramens", { type: 'PLAYING'})
        console.log("Le Bot est en ligne sans problèmes au démarrage");
    });
    
    bot.login('LE TOKEN');

    Je vais expliquer la signification de ces lignes de codes :
    const Discord = require('discord.js'); Signifie qu'on fait appelle aux ressources nécessaires ici.
    const bot = Discord.Client(); Défini "bot" est un utilisateur Discord ! (Vous pouvez remplacer par client ou encore patate mais restons professionnel !)

    bot.on('ready', function () { Est une ligne indiquant ce que doit être exécuté en dessous, lorsque le Bot est démarré
    bot.user.setStatus('online') Le Bot est affiché "En Ligne" (vert)
    bot.user.setActivity("cuisiner des ramens", { type: 'PLAYING'}) En dessous du pseudo du Bot sera affiché "Joue à cuisiner des ramens" (On peut aussi remplacer "Joue à" part "Écoute" "Regarde" "Streaming")
    console.log("Le Bot est en ligne sans problèmes au démarrage"); Une fois que le Bot est démarré, on aura dans la console (ou Terminale) cette phrase qui confirme que le Bot est bien démarré.

    bot.login('LE TOKEN'); C'est l'identifiant du Bot, il faut insérer son Token !

    ATTENTION : Il faut remplacer "LE TOKEN" par le token en chiffre de votre Bot !
    Pour cela, il faut retourner sur la page Discord du Bot et copier son Token et le coller à la place de "LE TOKEN"
    [​IMG]

    /!\ Ne donnez jamais le Token à qui que ce soit ! C'est ce qui identifie le Bot !
    Si quelqu'un le possède, il peut manipuler votre votre en codant de son côté.
    Si cela arrive, cliquez sur "Regenerate" sur la page du Bot, cela génère un nouveau Token.

    Désormais, il ne reste plus qu'à le démarrer !
    - Sur le Terminal de l'éditeur de code, écrivez : node index.js
    - C'est tout !

    Et voilà ! Le bot est démarré !
    [​IMG]

    Si ce n'est pas le cas, normalement des erreurs sont affichés dans le Terminal.
    Envoyez les moi si vous n'arrivez pas à fixer le problème.

    Désormais, on va lui ajouter deux commandes, et avec un prefix !

    -serveur (Infos du serveur où est situé le Bot !)
    -boule8 (la fameuse boule magique 8 qui donne des réponses au hasard !)


    ♦ Créer des commandes basiques ♦
    C'est parti Didier !
    Il faut savoir qu'il y a 2 manières de créer des commandes :
    - Une qui consiste à les coder dans le fichier
    index.js (simple mais pas très organisé)
    - Ou alors, créer un dossier "Commandes" avec un fichier par commande (c'est mieux pour s'organiser)
    Mais on va rester sur les bases et les coder dans le fichier index du Bot. J'expliquerais peut-être comment séparer les commandes par fichier si vous le souhaitez !

    Tout d'abord, il faut définir le préfix ! C'est tout simple, avec les premières lignes du fichiers, vous ajoutez :
    Code:
    let prefix = "-"

    Commençons donc par les infos du serveur !
    Tout d'abord, voici en langage français ce que le Bot devra comprendre :

    Lorsqu'un message est publié :
    -> Si l'auteur du message est le Bot, la commande est annulée.
    -> Si le message ne contient pas de prefix, la commande est annulée.
    -> le mot qui suit le prefix est un argument (cela sert à différencier les commandes)
    -> Lister les commandes (ou argument) et leurs actions

    Le code doit donner ceci :
    Code:
    bot.on('message', function (message) {
    
        if (message.author.equals(bot.user)) return;
        if (!message.content.startsWith(prefix)) return;
        var args = message.content.substring(prefix.length).split(" ");
        switch (args[0].toLowerCase()) {
            case "serveur":
    
                break;
        }
    })


    En dessous de case "serveur": on met tous les codes de la commande.
    Et pour terminer la commande et passer à une autre, il suffit de taper
    break;
    /!\ Il faut absolument respecter les ; /!\
    Ensuite, on va créer un embed !
    Voici un lien (anglais) qui explique le concept d'un embed :
    https://discordjs.guide/popular-topics/embeds.html
    J'aurais dû mal à vous expliquer en français tout cela, je suis désolé.. ;-;
    Voici le code de la commande "
    serveur" :
    Code:
    let info_embed = new Discord.RichEmbed()
    
                .setDescription("Informations du serveur")
                .setColor("#f4b042")
                .setThumbnail(message.guild.iconURL)
                .addField("Nom du serveur", message.guild.name, true)
                .addField("Membres total", message.member.guild.members.filter(m => !m.user.bot).size, true)
                .addField("Serveur créé par", message.guild.owner.displayName)
                .addBlankField()
                .addField("Créé le", message.guild.createdAt, true)
                .addField("Vous avez rejoint le", message.member.joinedAt, true);
                message.channel.send(info_embed);

    Ajoutez ce code en dessous de la ligne case "serveur":
    Du chinois n'est-ce pas ? Je vais essayer de vous expliquer comme je peux.
    - let info_embed = new Discord.RichEmbed() Signifie qu'on créer un embed nommé "info_embed".
    - #f4b042 (après .setColor) Est la couleur en HEX (site couleurs : https://htmlcolorcodes.com/fr/)
    - setThumbnail c'est la miniature, vous pouvez mettre un lien d'image ou écrivez message.guild.iconURL pour afficher le logo du serveur Discord.
    - Les
    .addField sont les éléments, ce qui est écrit dans "" sont les titres et après la virgule c'est l'information.
    - Tout ce qui suit après
    message.guild(ou member) c'est de l'anglais donc vous devriez deviner ce qu'il s'agit ^^
    - En revanche, le code bizarre
    message.member.guild.members.filter(m => !m.user.bot).size signifie que le Bot affiche le nombre de membres SANS compter les bots !
    - les
    true signifie qu'on veut mettre l'information suivante (qui doit être true aussi) à la ligne de celle-ci.
    - Et enfin,
    message.channel.send(info_embed) le Bot envoie le message !
    Voici le résultat :
    [​IMG]

    Pas mal hein ?
    Quoi les dates sont moches ? Oui bah pas ma faute ;-; !
    Sinon voici une explication en spoiler comment affiché une date comme 24/04/2019:
    - Vous allez dans le Terminal et tapez : npm i --s moment
    - Ensuite, en haut de votre fichier code, en dessous des premières lignes, vous ajoutez:
    Code:
    const moment = require('moment')
    - Ensuite, allez au code de la commande serveur et remplacez les 2 derniers .addField par :

    Code:
    .addField("Créé le", moment(message.guild.createdAt).format('DD/MM/YYYY'), true)
    .addField("Vous avez rejoint le", moment(message.member.joinedAt).format('DD/MM/YYYY'), true);
    - Et c'est tout !

    Voici le résultat :
    [​IMG]

    Et voilà on a créé la commande des infos du serveur ! :D

    Ensuite, on va passer à la commande de la
    Boule Magique 8 !
    Cette fois-ci, ce sera + simple !
    En dessous du
    break; de la commande précédente, on a ajouter les lignes suivantes :
    Code:
    case "8boule":
                let résultat = ["Je ne crois pas", "Sûrement pas !", "Bien sûr.. quoi que non.", "Oh peut-être !", "Probablement..", "Mais bien sûr DIDIER !"];
                message.channel.send(" **Réponse :** "+ résultat[Math.floor(Math.random() * résultat.length)] + " ")
    break;
    Donc on a créé la commande 8boule !
    La seconde ligne sont les réponses défini en "résultat", vous pouvez les remplacer et en ajouter autant que vous voulez !
    Et enfin, le message d'envoie du message, vous remarquerez le :

    résultat[Math.floor(Math.random() * résultat.length)]
    Cela signifie que le Bot va prendre une des réponses au hasard !

    Et voilà ce que ça donne :
    [​IMG]



    Et voilàààààà !
    On a fini de créer un bot et de lui ajouter 2 commandes !
    Si jamais vous avec un soucis ou des questions, n'hésitez pas à me demander !
    Et si vous souhaitez des tutoriels pour d'autres fonctions, demandez-moi lesquelles et soit je vous dirais en réponse soit j'en ferais un sujet !

    C'était votre humble Docteur Legend.
    Dabisous !
     
    • Utile Utile x 3
    • Informatif Informatif x 1
    #1
  2. KneaXy

    KneaXy En quête de foi, je prêche sur le chemin.
    Suprême Membre Actif Ancien

    Inscrit:
    7 Mars 2015
    Messages:
    969
    J'aime reçus:
    110
    Tutoriel bien présenté
    Félicitations à toi :)
     
    #2
  3. _ReworTwiix_

    _ReworTwiix_ | Staff Pvp & Mini-Games | ✔
    Staff Modérateur Ancien

    Inscrit:
    22 Mars 2018
    Messages:
    123
    J'aime reçus:
    29
    _ReworTwiix_
    Intéressant :)
     
    #3