javascript-typescript

[oak turret]

interaction.options.on("interactionCreate", (interaction) => {
if (interaction.isButton() && interaction.customId === "confirm")
interaction.user.send("Salut")
})

interactionCreate est un event, qui est déclenché par l'instance de DJS, donc ton client

[autumn tendon]

tout mon code si vous voulez:
https://pastebin.com/JA0mKg5Z
MDP : gca

[oak turret]

donc ça serait :

client.on("interactionCreate", (interaction) => {});

[oak turret]

Pas besoin, c'est ça la souci

[autumn tendon]

okay je vais testé

[oak turret]

client = la variable qui contient le new Client({})

[autumn tendon]

j'ai fait ça,

        client.on("interactionCreate", (interaction) => {
                interaction.user.send("Coucou!")
            })

c'est bien ça ?

[oak turret]

à tester, mais ça me parait ok

[autumn tendon]

    at Object.execute (C:\Users\Andsley\Desktop\ClickAndEat\commands\utility\commander.js:53:11)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async Object.execute (C:\Users\Andsley\Desktop\ClickAndEat\events\interactionCreate.js:16:4)```

[oak turret]

montre moi ton code update stp

[autumn tendon]

        const confirm = new ButtonBuilder()
            .setCustomId('confirm')
            .setLabel('Prendre la commande')
            .setStyle(ButtonStyle.Success);

        const cancel = new ButtonBuilder()
            .setCustomId('cancel')
            .setLabel('Annuler la commande')
            .setStyle(ButtonStyle.Danger);

            const row = new ActionRowBuilder()
            .addComponents(confirm, cancel);

            client.on("interactionCreate", (interaction) => {
                interaction.user.send("Coucou!")
            })

[oak turret]

ton fichier entier stp

[autumn tendon]

https://pastebin.com/bbxwdb6N
mdp : gca

[oak turret]

Ouais ok non c'est pas bon ton require est faux

client ne fait pas partie de discord.js

Tu as bien un new Client() quelque part, tu dois l'avoir dans ton fichier, t'utilises une lib ou quoi ? ou tu fais tout toi-même ?

[autumn tendon]

c'est un command handler

[oak turret]

lequel ?

[autumn tendon]

const fs = require('node:fs');
const path = require('node:path');
const { Client, Collection, GatewayIntentBits } = require('discord.js');
const { token } = require('./config.json');

const client = new Client({ intents: [GatewayIntentBits.Guilds] });

client.commands = new Collection();
const foldersPath = path.join(__dirname, 'commands');
const commandFolders = fs.readdirSync(foldersPath);

for (const folder of commandFolders) {
    const commandsPath = path.join(foldersPath, folder);
    const commandFiles = fs.readdirSync(commandsPath).filter(file => file.endsWith('.js'));
    for (const file of commandFiles) {
        const filePath = path.join(commandsPath, file);
        const command = require(filePath);
        if ('data' in command && 'execute' in command) {
            client.commands.set(command.data.name, command);
        } else {
            console.log(`[WARNING] The command at ${filePath} is missing a required "data" or "execute" property.`);
        }
    }
}


const eventsPath = path.join(__dirname, 'events');
const eventFiles = fs.readdirSync(eventsPath).filter(file => file.endsWith('.js'));

for (const file of eventFiles) {
    const filePath = path.join(eventsPath, file);
    const event = require(filePath);
    if (event.once) {
        client.once(event.name, (...args) => event.execute(...args));
    } else {
        client.on(event.name, (...args) => event.execute(...args));
    }
}

client.login(token);

celui du wiki

[oak turret]

ta fonction execute dans ton pastebin, essaie de passer client en deuxième argument, et console.log(client) stp

[autumn tendon]

je console.log ou ?

[oak turret]

juste en dessous

[autumn tendon]

undefined

[autumn tendon]

je fais quoi ?

[oak turret]

for (const file of eventFiles) {
    const filePath = path.join(eventsPath, file);
    const event = require(filePath);
    if (event.once) {
        client.once(event.name, (...args) => event.execute(client, ...args));
    } else {
        client.on(event.name, (...args) => event.execute(client, ...args));
    }
}

et dans ta fonction execute :

async execute(client, interaction) ...

[autumn tendon]

j'ai une grosse erreur

[oak turret]

Montre ton code

screen le

[autumn tendon]

lequel

[oak turret]

ça faut modifier dans ton index.js, fin là où ce code est

[oak turret]

Et le deuxième, là où tu fais ta commande

Fin bref montre ton code

ta commande

[autumn tendon]

tout le js ?

[oak turret]

ton index, et ta commande

[autumn tendon]

index.js

const fs = require('node:fs');
const path = require('node:path');
const { Client, Collection, GatewayIntentBits } = require('discord.js');
const { token } = require('./config.json');

const client = new Client({ intents: [GatewayIntentBits.Guilds] });

client.commands = new Collection();
const foldersPath = path.join(__dirname, 'commands');
const commandFolders = fs.readdirSync(foldersPath);

for (const folder of commandFolders) {
    const commandsPath = path.join(foldersPath, folder);
    const commandFiles = fs.readdirSync(commandsPath).filter(file => file.endsWith('.js'));
    for (const file of commandFiles) {
        const filePath = path.join(commandsPath, file);
        const command = require(filePath);
        if ('data' in command && 'execute' in command) {
            client.commands.set(command.data.name, command);
        } else {
            console.log(`[WARNING] The command at ${filePath} is missing a required "data" or "execute" property.`);
        }
    }
}


const eventsPath = path.join(__dirname, 'events');
const eventFiles = fs.readdirSync(eventsPath).filter(file => file.endsWith('.js'));

for (const file of eventFiles) {
    const filePath = path.join(eventsPath, file);
    const event = require(filePath);
    if (event.once) {
        client.once(event.name, (...args) => event.execute(client, ...args));
    } else {
        client.on(event.name, (...args) => event.execute(client, ...args));
    }
}

client.login(token);

commander.js (part 1)

const { ActionRowBuilder, SlashCommandBuilder, EmbedBuilder, ButtonBuilder, ButtonStyle, client } = require('discord.js');

module.exports = {
    data: new SlashCommandBuilder()
        .setName('commander')
        .setDescription('Commander votre repas')
        .addStringOption(option =>
            option.setName('nom')
                .setDescription(`Votre nom de famille.`)
                .setRequired(true))
        // Option 2
        .addStringOption(option =>
            option.setName('prenom')
                .setDescription('Votre prénom.')
                .setRequired(true))
                // Option 3
                .addStringOption(option =>
                    option.setName('repas')
                        .setDescription('Le repas que vous voulez manger.')
                        .setRequired(true))
                        // Option 4
                        .addStringOption(option =>
                            option.setName('localisation')
                                .setDescription(`Ou-est-ce que vous nous attendez ?`)
                                .setRequired(true))
                                // Option 5
                                .addStringOption(option =>
                                    option.setName('code-promo')
                                        .setDescription(`Avez-vous un code promo ?`)
                                        .setRequired(false)),


    async execute(client, interaction){
        console.log(client)
        await interaction.reply({ content: ':incoming_envelope: Votre commande a bien été envoyé.', ephemeral: true });
        const recu = interaction.client.channels.cache.get('1192145289788788756');

commander.js (part 2)

        
        const confirm = new ButtonBuilder()
            .setCustomId('confirm')
            .setLabel('Prendre la commande')
            .setStyle(ButtonStyle.Success);

        const cancel = new ButtonBuilder()
            .setCustomId('cancel')
            .setLabel('Annuler la commande')
            .setStyle(ButtonStyle.Danger);

            const row = new ActionRowBuilder()
            .addComponents(confirm, cancel);

            client.on("interactionCreate", (interaction) => {
                interaction.user.send("Coucou!")
            })

        let nom = interaction.options.getString("nom");
        let prenom = interaction.options.getString("prenom")
        let repas  = interaction.options.getString("repas")
        let localisation = interaction.options.getString("localisation")
        let promo = interaction.options.getString("code-promo") || "Aucun code promotionnel utilisé.";
        


        const commande_embed = new EmbedBuilder()
            .setColor('Green')
            .setTitle(":bell: **Ding ! Nouvelle commande reçu** :bell:")
            .addFields(
                { name: ':family: Nom de famille :', value: `\`${nom}\`` },
                { name: ':adult: Prénom :', value: `\`${prenom}\`` },
                { name: ':fork_knife_plate: Repas :', value: `\`${repas}\`` },
                { name: ':round_pushpin: Localisation :', value: `\`${localisation}\`` },
                { name: ':label: Code promo :', value: `\`${promo}\`` },
                { name: ':person_in_tuxedo: Client :', value: `${interaction.user}` }
            )
        
        recu.send({ embeds: [commande_embed], components: [row]});
            
    },
};

[oak turret]

enlève le client de ton require

[autumn tendon]

quel file?

[oak turret]

commander

[autumn tendon]

ok c'est bon

et après ?

[oak turret]

essaie de voir ce que ça te log maintenant

[autumn tendon]

bah ça me met encore full error

[oak turret]

renvoie un pastebin stp

[autumn tendon]

de quel code ?

[oak turret]

commander

[autumn tendon]

https://pastebin.com/bbxwdb6N

[oak turret]

Déjà ton event ne doit pas être dans une commande, mais dans un ficheir séparé donc déjà règle ça

et après on verra

[autumn tendon]

bah c'est juste pour ranger, tu vois bien qu'avec les embed ça marche

[oak turret]

?

[autumn tendon]

l'event EmbedBuilder

il marche bien sans être dans un fichier à part

[oak turret]

mais c'est pas un event

c'est justement pour ça que y a pas de souci sur ça mdr

[autumn tendon]

tu parles de quel event ?

[oak turret]

interactionCreate est un event du client, donc évidemment ça cause des souci, les events doivent être seul et le code des events c'est juste le traitement des events

[autumn tendon]

il à un fichier hein

Events -> interactionCreate.js

j'en ai déjà un

[oak turret]

Bah pourquoi tu l'as mis dans ta commande alors

[autumn tendon]

comment ça ?

[oak turret]

https://discordjs.guide/slash-commands/response-methods.html
Look ça, et essaie de faire une commande simple pour voir

[autumn tendon]

même erreur

[oak turret]

fait voir ton fichier interactionCreate.js

[autumn tendon]

const { Events } = require('discord.js');

module.exports = {
    name: Events.InteractionCreate,
    async execute(interaction) {
        if (!interaction.isChatInputCommand) return;

        const command = interaction.client.commands.get(interaction.commandName);

        if (!command) {
            console.error(`No command matching ${interaction.commandName} was found.`);
            return;
        }

        try {
            await command.execute(interaction);
        } catch (error) {
            console.error(error);
            if (interaction.replied || interaction.deferred) {
                await interaction.followUp({ content: 'There was an error while executing this command!', ephemeral: true });
            } else {
                await interaction.reply({ content: 'There was an error while executing this command!', ephemeral: true });
            }
        }
    },
};

[oak turret]

met client en premier argument, et ça fonctionnera

[autumn tendon]

quel ligne ?

async execute ?

[oak turret]

oui

[autumn tendon]

alors ducoup pour mon ping.js ça marche

que je viens de créer comme tu m'a dis

mais pour mon commander.js

ça me log ça

TypeError: Cannot read properties of undefined (reading 'reply')
    at Object.execute (C:\Users\Andsley\Desktop\ClickAndEat\commands\utility\commander.js:35:21)
    at Object.execute (C:\Users\Andsley\Desktop\ClickAndEat\events\interactionCreate.js:16:18)
    at Client.<anonymous> (C:\Users\Andsley\Desktop\ClickAndEat\index.js:36:50)
    at Client.emit (node:events:513:28)
    at InteractionCreateAction.handle (C:\Users\Andsley\Desktop\ClickAndEat\node_modules\discord.js\src\client\actions\InteractionCreate.js:97:12)
    at module.exports [as INTERACTION_CREATE] (C:\Users\Andsley\Desktop\ClickAndEat\node_modules\discord.js\src\client\websocket\handlers\INTERACTION_CREATE.js:4:36)
    at WebSocketManager.handlePacket (C:\Users\Andsley\Desktop\ClickAndEat\node_modules\discord.js\src\client\websocket\WebSocketManager.js:355:31)
    at WebSocketManager.<anonymous> (C:\Users\Andsley\Desktop\ClickAndEat\node_modules\discord.js\src\client\websocket\WebSocketManager.js:239:12)
    at WebSocketManager.emit (C:\Users\Andsley\Desktop\ClickAndEat\node_modules\@vladfrangu\async_event_emitter\dist\index.cjs:282:31)
    at WebSocketShard.<anonymous> (C:\Users\Andsley\Desktop\ClickAndEat\node_modules\@discordjs\ws\dist\index.js:1173:51

[oak turret]

console.log client et interaction dans ta commande

[oak turret]

t'as log les deux ?

[autumn tendon]

yes

console.log(client, interaction)

[oak turret]

Le print que tu m'as envoyé, il a été print en premier ou deuxième ?

[autumn tendon]

premier

[oak turret]

ok donc, supprime client de la function execute sur ta commande

[autumn tendon]

je l'enlève de console.log aussi dcp

[oak turret]

oui

[oak turret]

le .reply devrait marcher maintenant alors

[autumn tendon]

le .reply marche mais ducoup j'ai mon
client.on("interactionCreate", (interaction) => {
interaction.user.send("Coucou!")
})
qui me fait une erreur

je dois genre faire interaction.on

?

[oak turret]

non, vu que tu gères ça dans ta commande normalement non

[autumn tendon]

bah ça me met comme même une erreur ducoup

[oak turret]

tu l'as enlevé ?

[autumn tendon]

de?

ReferenceError: client is not defined
at Object.execute (C:\Users\Andsley\Desktop\ClickAndEat\commands\utility\commander.js:54:4)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async Object.execute (C:\Users\Andsley\Desktop\ClickAndEat\events\interactionCreate.js:16:4)

[autumn tendon]

enlevé quoi ?

[oak turret]

envoie ton code ça ira plus vite

ton commander

[autumn tendon]

https://pastebin.com/sG3ScJVZ

[oak turret]

enlève le client.on du coup

[autumn tendon]

tout le code

?

du client.on

[oak turret]

oui

[autumn tendon]

okay, mais ducoup après, je fait comment pour envoyer un message directe (privé quoi) à la personne qui à fait la commande slash et pas celui qui à appuyer sur le button

[autumn tendon]

comment je peux faire ?

nevermind j'ai réussi

[oak turret]

t'as fait quoi ?

[leaden prism]

Hey, j'ai un problème avec eslint mais je n'arrive pas à trouver comment le régler. Pouvez vous m'aider svp
le code :

import styles from "./CityList.module.css";
import Spinner from "./Spinner";

function CityList({ cities, isLoading }) {
  if (isLoading) return <Spinner />;
  if (!cities.length) return <p>No cities found</p>;
  return <ul className={styles.cityList}>List</ul>;
}

export default CityList;

[autumn tendon]

finalement j'ai pas réussi

ça envoyait un mess a la personne qui appuyais sur le button

et pas celui qui avait fait la commande

et là ça envoit rien du tout, sans erreur

[normal lichen]

Bonjour, je suis entrain de créer un bot discord js en v14 avec ts, j'aimerais ajouter un système pour savoir qui a inviter la personne, je suis conscient que discord js ne permet pas de détecter qu'elle lien d'invitation a utiliser la personne pour rejoindre, mon alternative est de stocker les liens d'invitation en base de donnée et lorsqu'un membre rejoins je compare les liens d'invitations de la base de données avec ceux sur discord et regarde lequel a une utilisation en plus, mon soucis actuellement est que dans l'event guildMemberAdd je ne sais pas trop comment je peut faire pour récupérer la liste des invitation dans cette event, pourriez vous m'aiguiller s'il vous plait 😅

Je vous remercie !
Bonne journée

[glass cargo]

Honnêtement, ce n'est pas une idée viable, car il suffit que ton bot soit hors ligne et tout est cassé.
Mais sinon, tu as cette propriété :

[desert river]

:property: Guild#invites
A manager of the invites of this guild

[normal lichen]

Je vois mais du coup je doit tout de même comparer avec les invitations que j’ai stocker en base de données ?

[glass cargo]

Ouais

Je vois que comme ça

Après, tu peux peut-être chercher sur github des bots qui font la même chose pour voir qu'est-ce qu'ils utilisent 👀

[normal lichen]

Je t’avoue c’est pas trop mon truc

Je préfère chercher et demander de l’aide plutôt que de reprendre des codes, sa fait travailler ma logique 🤣

Mais oui je regarderais, le soucis dans mon idée est que le nombre d’utilisation de l’invitation sois pas fiable si je comprends bien ?

[glass cargo]

C'est le nombre d'invitations dans ta base de données qui ne sera pas fiable

[glass cargo]

T'inquiète, je suis pareil, mais quand je sèche vraiment, je vais juste jeter un coup d'oeil pour ensuite le réécrire à ma façon ^^

[normal lichen]

Oui je vois merci du conseil, je regarderai a cela ! x)

[autumn tendon]

Bonjourr, j'ai envie d'utiliser axios, pour faire un bot qui contacte une api, mais comment je peut faire sachant que j'ai que un token d'api

[glass cargo]

Je fais partir du fait que l'API a une authentification "basique" :

const axios = require("axios")

axios.get("https://example-api.com/users", {
  headers: {
    Authorization: "Bearer <token>"
  }
}).then(res => /* Handle res */).catch(res => /* Handle error */)

axios.post("https://example-api.com/users", {
  username: "Didier"
}, {
  headers: {
    Authorization: "Bearer <token>"
  }
}).then(res => /* Handle res */).catch(res => /* Handle error */)

[autumn tendon]

username: c'est quoi ?

[glass cargo]

Le body

j'ai mis un truc au pif

Mais après, tu remplace par les bons trucs ^^

[autumn tendon]

okay, et ça je le rentre au moment d'executer la commande, ou avant

[glass cargo]

ça dépend ce que tu veux faire 🤷‍♂️

Mais une fois la commande exécutée me parait plus logique x)

[autumn tendon]

okay je vais faire ça merci

[autumn tendon]

bon, j'ai tenté quelque chose,

code :

const {  SlashCommandBuilder } = require('discord.js');
const axios = require('axios')

module.exports = {
    data: new SlashCommandBuilder()
        .setName('view-warns')
        .setDescription(`Regarder les warns d'un joueur spécifique.`)
        .addStringOption(option =>
            option.setName('pseudo')
                .setDescription(`Pseudo du joueur d'ou vous voulez regarder les warns.`)
                .setRequired(true)),
    async execute(interaction) {

        let pseudo = interaction.options.getString("pseudo");

        axios.get("https://dashboard.kobralost-rp.com/tokens/9583/67/authorize?scopes=punishments-moderation.read,punishments-team.read", {
  headers: {
    Authorization: "MON_TOKEN_API"
  }
})

axios.post("https://dashboard.kobralost-rp.com/tokens/9583/67/authorize?scopes=punishments-moderation.read,punishments-team.read", {
  username: `\`${pseudo}\``
}, {
  headers: {
    Authorization: "MON_TOKEN_API"
  }
})

console.log(axios)


    },
};

et ça à pas l'air de marche

et je sais pas si c'est ça qu'il faut faire

[glass cargo]

J'en sais rien moi x)

Si t'es certains qui c'est comme ça que fonctionne l'API, va leur demander directement à eux :)

[autumn tendon]

okay

[floral bolt]

https://tenor.com/view/where-you-at-gif-21177622

Y’a plus personne ici ? 😮

[slim anvil]

@floral bolt c pour ce genre de réponse qu'il y a plus personne ici

[glass cargo]

Peut-être que les gens ont eu un accès à Google pour noel

[floral bolt]

Ou alors ChatGPT a été entrainé grâce à nos réponses 😄

[left relic]

Salut est-ce que quelqu'un sait comment faire une animation de slide comme sur : https://www.rolex.com/fr/watches/gmt-master-ii/m126720vtnr-0001 , sachant que ce n'est pas de la vrai 3D mais une animation frame par frame ?

[floral bolt]

Si c’est de la 3D

Ah non tu as raison, je vais regarder un peu plus je te tiens au courant

[left relic]

@floral bolt d'ailleurs j'ai déjà codé l'animation de la montre qui tourne au scroll avec gsap, je pourrais peut-être la réutilisée pour ça, le code: ```var images = [];
function preload(index) {
images[index] = new Image();
images[index].src = assets/rolex-img/frame-${index}.avif;
}

for(let i = 0; i < 180; i++){
preload(i)
}
const scrollAnim2 = document.getElementsByClassName('scroll-anim-2')[0];

const timeline2 = gsap.timeline({
scrollTrigger: {
trigger: '.scroll-anim-2',
start: 'top top',
end: '+=3785',
scrub: true,
pin: true
}
});
timeline2
.to('.scroll-anim-2', {
duration: '2840',
onUpdate: () => {
const animDuration = 2840;
const scrollPercentage = timeline2.time() / animDuration * 100;
var currentImage = Math.round(179/100 * scrollPercentage);
currentImage = currentImage < 180 ? currentImage : 179;
scrollAnim2.style.background = url('assets/rolex-img/frame-${currentImage}.avif');
scrollAnim2.style.backgroundPosition = 'center';
scrollAnim2.style.backgroundSize = '100%';
},
animation: 'frame'
}, 0)```

[floral bolt]

tu dev sur quoi ?

[left relic]

je recode une page du site de rolex que je trouve intéressante, c'est cette page : https://www.rolex.com/fr/watches/gmt-master-ii

[floral bolt]

Oui mais avec quel framework

[left relic]

@floral bolt après j'avais pensé à faire une scrollbar custom invisible pour l'animation et mettre un smooth scroll pour que ce soit plus fluide. J'utilise pas de framework, juste gsap et un peu tailwind.

[floral bolt]

Ok en gros tu dois utilisé les event listener

[left relic]

oui

je sais pas s'il y en a une pour gérer le swipe

[floral bolt]

wheel, touchmove ect

[left relic]

j'ai testé de calculer la vitesse de swipe puis de calculer de combien d'images il faut avancer dans l'animation etc avec onClick et onMouseUp mais j'aime pas trop cette solution

[floral bolt]

enfaite tu vas plutot check le x ou le y de ta page

faire un delta pour avoir tant d'image par x ou y

en gros eux ils utilisent canvas pour afficher les images

apres je ne sais pas comment marche le code derriere

[left relic]

ah oui j'utilise pas trop les canvas, pourquoi en utiliser pour afficher des images ?

mais sinon tu en pense quoi de faire une scrollbar invisible avec smooth scroll ? Vu que j'ai déjà l'animation au scroll j'aurais juste à faire la barre de scroll, mais je sais pas si c'est très propre

[floral bolt]

je penses que c'est pour l'optimisation les images sont prechargé et donc des que le x ou y change ca le change dans le canva

[left relic]

mais même sans canvas je précharge les images avec ```var images = [];
function preload(index) {
images[index] = new Image();
images[index].src = assets/rolex-img/frame-${index}.avif;
}

for(let i = 0; i < 180; i++){
preload(i)
}```

[floral bolt]

bah test tu verras bien

[left relic]

si ça fonctionne parce que quand je retire ce morceau de code, dans source il y a que la première image de l'animation, alors que quand il y est il y a toutes les images

[glass cargo]

Si seulement

[left relic]

@floral bolt j'ai testé de custom scrollbar mais ça fonctionne pas très bien : https://codepen.io/JFR001/full/OJGyQyy

[marsh nexus]

J'ai tapé la commande "node main" pour la vidéo de coder un bot dans la deuxième partie, et j'ai une erreur, je n'arrive pas a retrouver qu'est-ce que c'est

[versed storm]

Est-ce que tu peux fournir le code où tu fais appel à discord.js

[marsh nexus]

?

tu parles de ça?

[barren glacier]

Ton fichier principal de ton bot

Soit main.js je suppose

[barren glacier]

Est-ce que tu as installé dotenv ?

[marsh nexus]

j'ai fais npm i dote,v

env*

oui

[barren glacier]

🤔

Montre l'arborescence de ton bot

[barren glacier]

T'as pas indiqué le bon path dans ton require sur ta variable loadCommands

T'indiques loaders/ pourtant t'es à la racine même

Donc ça devrait être commands/loaders/loadCommands

[marsh nexus]

c exactement le meme chemin??

[barren glacier]

Je te rappele que ton main.js est à la racine de ton dossier source

[marsh nexus]

js

[barren glacier]

Donc tu accède d'abord à ton dossier qui contient loaders

Soit commands

[marsh nexus]

oui

[versed storm]

Dans son état actuel, ton code cherche le dossier loaders dans music (qui n'existe pas), il faut préciser correctement le chemin comme l'a indiqué Pizu
Soit d'abord entrer dans le dossier commands puis loaders

[marsh nexus]

oe?

[barren glacier]

Donc voilà la solution

à toi d'appliquer maintenant

[versed storm]

Dans VSCode, tu peux clic droit sur un fichier pour copier son chemin relatif

[marsh nexus]

donc music jdevrais le deplacer

[barren glacier]

Non

Juste ici regarde tu essayes d'accéder directement au dossier loaders depuis ton main.js

[versed storm]

[barren glacier]

Qui est lui-même dans un autre dossier commands

Si t'ouvres ton explorateur de fichier windows

Tu va pas accéder à loaders direct

[marsh nexus]

euh??

[barren glacier]

Tu vas aller sur commands

Et sur loaders

On est d'accord ?

[marsh nexus]

oui

[barren glacier]

Bon bah voilà là c'est la même

Ton code il va pas faire direct loaders

[marsh nexus]

okok

[barren glacier]

Il va aller dans commands, dans loaders et prendre ton fichier

[marsh nexus]

jvoi

[barren glacier]

Mais pour ça il faut lui indiquer

Il est bête et mêchant ton interpréteur

Il lit ce que tu lui a dis

[marsh nexus]

oe

[marsh nexus]

jle remplace par l'autre dcp

jveux bien hein

mais sa met tjrs la mm erreur

[barren glacier]

Photo ?

Code

Envoie tout

[barren glacier]

./commands/

[marsh nexus]

ah

[barren glacier]

Suffit juste d'ajouter un petit slash après ton point normalement

[barren glacier]

Bon maintenant le soucis doit venir de ton loadCommands lui-même

Tu peux envoyer le code de ton loadCommands ?

[barren glacier]

Ok, tu as installé fs ?

[marsh nexus]

npm i fs ?

[barren glacier]

Oui

[marsh nexus]

oui

[barren glacier]

🤔

Réessaie un coup quand même

[barren glacier]

Ok

[marsh nexus]

jai suivis le code de mad rage

mais lui a pas d'erreur

et moi si

[barren glacier]

Bon je vais devoir filer je t'aide plus tard si jamais personne t'as aidé

🙆‍♂️

[marsh nexus]

vsy

[floral bolt]

C’est quoi ton problème maintenant ?

[oak turret]

@marsh nexusTu devrais arrêter de te faire chier et passer sur Sheweny qui est une superbe lib pour faire tes bot

[marsh nexus]

Tu me présentes ?

[misty parcel]

Y'a Sapphire aussi 🤷‍♂️

Pcq Sheweny n'est plus maintenu

[oak turret]

Pas très grave qu'il soit plus maintenu pour le moment, toutes les fonctionalités sont supportés

[misty parcel]

Oui c'est vrai mais sur le long terme c'est po bien nan ? 🤔

Enfin je crois

[oak turret]

Oui oui, mais bon Sapphire why not

Mais je le trouve large moins bien que Sheweny

[misty parcel]

Ah oui ? Sur quel points ?

[oak turret]

Rien qu'à la façon d'utiliser, sur une commande tu dois la register etc, pas sur Sheweny fin il a l'air plus chiant

[slim anvil]

oui mais on conseille pas une lib plus maintenu

discord évolue trop vite pour se dire "c'est bon"

[crude bramble]

bonsoir à tous j'ai un soucis sur l'interaction de mes bouttons en ts pour ajouter un role lors de l'acceptation du reglement discord

j'ai ce bout de code

https://sharemycode.io/c/6ab15f4

mais je n'arrive pas à résoudre cette erreur

[floral bolt]

En JavaScript tout à une couleur 😉

[plush lava]

Fait ta propre lib 🙏

[crude bramble]

bonjour je developpe un evenement pour créer un embed de bienvenue mais j'ai cette erreur

voici mon code

https://sharemycode.io/c/e46dd89

[past nimbus]

Ajoute une condition pour vérifier qu'il s'agit d'un channel texte

[vagrant hemlock]

Bonjour, comment on fait pour corriger cette erreur, j'ai envie de faire une commande lock

module.exports = {
    data: new SlashCommandBuilder() 
    .setName('lock')
    .setDescription('lock the current channel'),
    
    async execute(interaction) {
        await interaction.reply('salon fermé avec succès !');
        interaction.channel.permissionOverwrites.edit(interaction.guild.everyone.id, {
            VIEW_CHANNEL: false,
            SEND_MESSAGES: false,
            READ_MESSAGE_HISTORY: false,
            ATTACH_FILES: false
        });
    }
}

mais j'obtiens cette erreur

E:\dev\discord\ondabot\src\commands\moderation\lock.js:11
        interaction.channel.permissionOverwrites.edit(interaction.guild.everyone.id, {
                                                                                 ^

TypeError: Cannot read properties of undefined (reading 'id')
    at Object.execute (E:\dev\discord\ondabot\src\commands\moderation\lock.js:11:82)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

Node.js v20.11.1

[merry inlet]

je comprend pas, je suis sur la meme base de donné meme requette mais 2 reponse différente entre mes logs et datagrip, la db et le script tourne sur la meme machine de dev et meme UTC

datagrip:

SELECT DATE(sessionEndTimeStamp) AS day,
SUM(time) AS total_time,
SUM(deaths) AS total_deaths,
SUM(kills) AS total_kills
FROM gm_server_stat_session
WHERE serverID = 'Q9SuZQRFmR'
AND steamID64 = '76561198200175111'
AND sessionEndTimeStamp > DATE_SUB(NOW(), INTERVAL 7 DAY)
GROUP BY day

->>>
2024-03-02,720,11,7
2024-03-03,8942,64,46
2024-03-05,2149,4,4
2024-03-07,4946,70,5
2024-03-08,9145,56,62
2024-03-09,9562,0,20

log (result, de la query dans mon bot js)

[
{
day: 2024-03-01T23:00:00.000Z,
total_time: '720',
total_deaths: '11',
total_kills: '7'
},
{
day: 2024-03-02T23:00:00.000Z,
total_time: '8942',
total_deaths: '64',
total_kills: '46'
},
{
day: 2024-03-04T23:00:00.000Z,
total_time: '2149',
total_deaths: '4',
total_kills: '4'
},
{
day: 2024-03-06T23:00:00.000Z,
total_time: '4946',
total_deaths: '70',
total_kills: '5'
},
{
day: 2024-03-07T23:00:00.000Z,
total_time: '9145',
total_deaths: '56',
total_kills: '62'
},
{
day: 2024-03-08T23:00:00.000Z,
total_time: '9562',
total_deaths: '0',
total_kills: '20'
}
]

[autumn tendon]

le log donne toute les sessions auparavant du joueur

c'est ça enfaite

[glass cargo]

L'un est formaté en JSON et l'autre en CSV

C'est tout x)

[crude bramble]

bonjour, j'essaie de faire une commande statistiques pour mon bot discord mais ça ne correspond pas, seul la totalité des membres est juste

voici mon code

https://sharemycode.io/c/ccc2539

[glass cargo]

La propriété guildMembers donne le nombre total de membres sur le serveur alors que members.cache.filter().size donne le nombre de membre en cache.

[crude bramble]

pour les chauffeurs par exemple members.cache.filter().size me retourne 1 cependant j'en ai plus

[glass cargo]

Oui, car il n'y a qu'un seul chauffeur en cache

[crude bramble]

du coup je peux pas le faire comme ça

au bout d'un moment mes stats ne seront plus à jour

si plus dans le cash

[glass cargo]

Exact

@crude bramble Je te recommande pas trop d'utiliser ça pour un bot qui doit gérer un gros serveur ou plusieurs serveurs, mais il semblerait qu'il soit possible d'ajouter tous les membres d'un serveur au cache manuellement : https://discord.js.org/docs/packages/discord.js/14.14.1/GuildMemberManager:Class#fetch

[crude bramble]

ah oui nickel du coup il serais plus judicieux de faire la maj uniquement à l'ajout ou suppression d'un role

[glass cargo]

Je pense que ça serait mieux de le faire au démarrage du bot

Comme ça tu met tous les membres en cache, et les nouveaux s'ajouteront tout seuls :)

[crude bramble]

ok je te remercie pour tout

[crude bramble]

finalement voilà ce que je fait au chargement du bot

https://sharemycode.io/c/8d631b3

[glass cargo]

👌

[misty pulsar]

Bonjour bonjour !
Je suis en train de dev un petit script Google app script pour faire de l'automatisation. Mais j'au une erreur dans mes variables apparemment.

Quelqu'un serait disponible en vocal en ou en message ?

[cyan iron]

Par message, poste ton problème directement si tu veux de l'aide

[crude bramble]

un peu rouillé je sais plus comment faire ça lol

j'ai ça dans mon code actuellement

[misty pulsar]

Ok je vous explique...

Je travaille sur Google App script pour automatiser un G SHeet

Je vous montre mon code et l'erreur

[crude bramble]

.setDescription(<#${membre.user.tag}> **Action**: Ban **Raison**: ${raison});

ça fait une demi heure que je m'acharne sur le misubishi lol

[visual sequoia]

donc membre.user.id

dans ton cas

[misty pulsar]

function testFunction(e) {
  
  var timestamp = e.values[0];
  var testVariable = e.values[1];

  var file = DriveApp.getFileById('168Q1IQ46j6PdTZseGFrYksCkL4x3_RXEyINGEPeCjR8'); 
  var folder = DriveApp.getFolderById('1aLIzJU1CupUUA3R4NuQ9koR39mVqvhPd')
  var copy = file.makeCopy ( timestamp + testVariable + '_' , folder);

  var doc = DocumentApp.openById(copy.getId()); 
  
  var body = doc.getBody(); 

  body.replaceText('<<testVariable>>', testVariable); 
  body.replaceText('<<timestamp>>', timestamp);

  var editors = ['[e-mail]', '[e-mail]'];
  for (var i = 0; i < editors.length; i++) {
  doc.addEditor(editors[i]);
}

  doc.setSharing(DocumentApp.Access.ANYONE_WITH_LINK, DocumentApp.Permission.VIEW);
  doc.setCopyable(false);
  doc.setDownloadable(false);
  doc.setPrintable(false);

// Exporter le document en tant qu'image PNG
  var exportURL = "https://www.googleapis.com/drive/v3/files/" + doc.getId() + "/export?mimeType=image/png";
  var response = UrlFetchApp.fetch(exportURL, {
    headers: {
      Authorization: 'Bearer ' + ScriptApp.getOAuthToken()
    }
  });
  
  var blob = response.getBlob();
  var pngFile = folder.createFile(blob);

  // Créer un fichier PNG dans le dossier spécifié
  var pngFolder = DriveApp.getFolderById('19qC47nKkbabBM1cq036OVMccr4jqFjPj');
  var pngFile = pngFolder.createFile(blob);

  // Exporter le document en tant qu'image PNG
  var exportURL = "https://www.googleapis.com/drive/v3/files/" + doc.getId() + "/export?mimeType=image/png";
  var response = UrlFetchApp.fetch(exportURL, {
    headers: {
      Authorization: 'Bearer ' + ScriptApp.getOAuthToken()
    }
  });

}```

sauf que : https://developers.google.com/apps-script/reference/drive/access?hl=fr

[crude bramble]

ptdr c'était aussi con que ça 😅

merci à toi en tout cas

[visual sequoia]

Pas de prob bg

[merry inlet]

Rien a voir, en js avec mysql2 la réponse est donné sous forme du objet, avec datagrip qui permet de visualiser c'est toi qui décide, mais le contenu devrais être le meme car c'est la meme requête

[merry inlet]

Nan, c'est la meme requête qui est exécuter

Donc sa ne devrait pas être le cas

[merry inlet]

je pense a un problème de timezone

[lapis onyx]

Salut: le pb c’est ta , a la fin de la ligne précédente

Au lieu de mettre la virgule apres setValue déplace la après set emojis

[autumn tendon]

jviens de me co, j'allais lui donner la réponse t'es trop rapide

[woven cosmos]

bonjour

[autumn tendon]

bonjour.

[misty pulsar]

Bonsoir !
j'aurais besoin de quelqu'un qui connaisse la doc dev de discord pour faire les embeds. C'est un problème de merde vraiment. Je suis persuadé que quelqu'un qui connais un minimum va me débloquer en 2 secondes. Ce qui n'est pas mon cas.

Voici l'erreur :

Exception: Request failed for https://discord.com returned code 400. Truncated server response: {"embeds": ["0"]} (use muteHttpExceptions option to examine full response) at sajp(Code:180:15)

Je précise que je n'utilise pas de librairie, c'est inutile dans mon cas, je veux juste envoyer en embed via un webhook

Voici mon code :

function sajp(e) {
    
    // morceau de code innutile...

      // Référence à l'objet File correspondant au doc
      var file = DriveApp.getFileById(doc.getId());
    
      // Définir les autorisations de partage pour que n'importe qui ayant le lien puisse voir le document
      file.setSharing(DriveApp.Access.ANYONE_WITH_LINK, DriveApp.Permission.VIEW);
    
      doc.saveAndClose();
    
      // Exporter le document en PDF
      let exportURL = 'https://www.googleapis.com/drive/v3/files/' + doc.getId() + '/export?mimeType=application/pdf';
      let response = UrlFetchApp.fetch(exportURL, {
        headers: {
          Authorization: 'Bearer ' + ScriptApp.getOAuthToken()
        }
      });
    
      let blob = response.getBlob();
      let pdfFile = folder.createFile(blob);
    
      // URL webhook
      let discordWebhookUrl = 'mon webhook'; ```

// Message channel Discord
      let discordEmbed = {
        'embeds': [{
          'author': {
            'name': ':warning: __TEST__ - NE PAS PRENDRE COMPTE :warning:'
          },
          'title': ':scales: JuriSys - SAJP',
          'description': '***S**ystème **A**utmatisé de **J**urisprudence **P**énale*.\n\n**SAJP** est un service de JuriSys®, votre système de traitement de documents et actes juridiques sécurisé.\n\n:ring_buoy: Pour toute demande de support technique merci de joindre __Jordan Walpole__.\n\n━━━━━━━━━━━━━━━\n:mega: **NOUVELLE DECISION PENALE**\n━━━━━━━━━━━━━━━',```

'fields': [
            {
              'name': ':card_box: Identification Procédure',
              'value': 'N°TAJ: ' + casier,
              'inline': true
            },
            {
              'name': ':judge: Magistrat du siège',
              'value': prenomJuge + ' ' + nomJuge + ' ' + gradeJuge,
              'inline': true
            },
            {
              'name': ':police_officer: OPJ/APJ en charge',
              'value': ':construction:*En développement...*:construction:'
            },
            {
              'name': '⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼⎼',
              'value': 'ㅤ'
            },
            {
              'name': ':identification_card: Identité du mise en cause',
              'value': prenomMisEnCause + ' ' + nomMisEnCause,
              'inline': true
            },
            {
              'name': ':telephone_receiver: Contact mis en cause',
              'value': ':construction:*En développement...*:construction:',
              'inline': true
            },
            {
              'name': ':mag:Chef(s) d\'inculpation',
              'value': chefs
            },
            {
              'name': ':crossed_swords: Condamnation',
              'value': sanctionCourte,
              'inline': true
            },
            {
              'name': ':page_facing_up: Original de la décision',
              'value': '[Cliquer ici]' + '(' + pdfFile.getUrl + ')',
              'inline': true
            }
          ],
          'color': '#429bff',
          'footer': {
            'text': ':scales: JuriSys® SAJP® | ALPHA VO.4'
          },
          'timestamp': 1710164479319
        }]
      };```

// Option de requête
      let params = {
        method: 'post',
        headers: {
          'Content-Type': 'application/json'
        },
        payload: JSON.stringify(discordEmbed)
      };
    
      // Envoi de la requête à Discord
      UrlFetchApp.fetch(discordWebhookUrl, params);
    
    }```

Je ne comprend pas mon erreur...

[floral bolt]

La réponse dit que le embed est vide

Donc il y a une erreur dans l’envoi 😉

[misty pulsar]

J'avoue que je suis un peu perdu 😅

Si tu as le temps de m'aider je suis pas contre ...

Surtout que je suis deg, c'est le dernier truc que j'ai à fix, après j'ai terminé mon script xD

[lapis onyx]

console.log(JSON.stringify(discordEmbed))

[woven cosmos]

j'ai légalement le droit d'obtenir l'adresse ip de ceux passant sur mon site ?
pas pour les enregistrer dans une bdd mais juste pour le mettre dans le local storage du navigateur comme ça jpeux verif s'il sont déjà passer sur le site juste avec un if

[past nimbus]

Oui

[glass cargo]

Ben déjà, par défaut, le serveur web l’enregistre dans les logs d’accès (du moins pour nginx)

Il faut juste que tu pense à le préciser dans ta politique de confidentialité

[thorn saffron]

Salut !
J'ai un problème avec requestAnimationFrame (API Canvas). J'aimerais ajouter des arguments à la fonctions, mais je sais pas comment faire et Google ne m'a pas trop aidé || 😅 ||.
Comment faire ?

[crisp dune]

dmd à chat gpt

tu lui envoie la doc si il trouve pas

[floral bolt]

C’est pas trop le principe du serveur ça …

[floral bolt]

Tu cherches à faire quoi enfaite ?

[autumn tendon]

il a dit demande à ChatGPT sur un serveur entre-aide 😂

[autumn tendon]

et pour ta question, essaye de checker là : https://developer.mozilla.org/fr/docs/Web/API/Canvas_API

y'a un tutoriel canvas

[thorn saffron]

C'est toujours de là où je part...

Y'a rien pour mon problème.

[autumn tendon]

aie

je work pas sur les canvas

donc je connais pas trop le sujet

[thorn saffron]

draw(scene, tileset, sprite) {
  let ctx = scene.canvas.getContext("2d");
  ctx.drawImage(tileset.image, tileset.left(sprite), tileset.top(sprite), tileset.blockWidth, tileset.blockHeight, this.posX, this.posY, this.width, this.height);
}
    
beginDraw(scene, tileset, sprite) { this.drawAnimation = requestAnimationFrame(this.draw); }

Je veux que ça exécute draw ||Lui n'est pas beuggé|| en boucle. C'est tout.

[glass cargo]

while (true) {
  draw()
}

[thorn saffron]

Oui, certes, mais requestAnimationFrame est optimisé pour (https://developer.mozilla.org/fr/docs/Web/API/window/requestAnimationFrame). Sinon, c'était effectivement le while ma 1ere idée.

[glass cargo]

Honnêtement, je te fais confiance, j’ai jamais utilisé canva 😅

[thorn saffron]

Nan, y'a pas de mal !

[timid loom]

Tu peux sans doute t'en sortir avec un truc qui ressemble à ça

beginDraw(scene, tileset, sprite) {
  this.drawAnimation = requestAnimationFrame(() => {
    this.draw(scene, tileset, sprite);
    this.beginDraw(scene, tileset, sprite);
  });
}

Leur code d'exemple repose sur le même principe :

const element = document.getElementById("un-élément-à-animer");
let debut, tempsPrecedent;
let fini = false;

function iteration(chrono) {
  if (debut === undefined) {
    debut = chrono;
  }
  const ecoule = chrono - debut;

  if (tempsPrecedent !== chrono) {
    // Math.min() est utilisée ici afin de s'assurer
    // que l'élément s'arrête exactement à 200px
    const compteur = Math.min(0.1 * ecoule, 200);
    element.style.transform = `translateX(${compteur}px)`;
    if (compteur === 200) fini = true;
  }

  if (ecoule < 2000) {
    // On arrête l'animation après 2 secondes
    tempsPrecedent = chrono;
    if (!fini) {
      window.requestAnimationFrame(iteration);
    }
  }
}

window.requestAnimationFrame(iteration);

Ici, la section avec le if (ecoule < 2000) { ... } rééxécute le callback iteration et permet de boucler récursivement ; le code que je t'ai donné fait la même chose mais en fournissant une fonction anonyme en callback ce qui te permet de passer des paramètres à tes fonctions.

Il se peut que tu rencontre cette erreur cependant : https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Errors/Too_much_recursion

Il faudra que tu regarde comment faire pour exécuter la fonction en boucle sans passer par de la récursion mais c'est généralement possible, juste pas toujours "trivial"

Le plus simple ça sera peut-être de faire ce qui est suggéré ici : https://stackoverflow.com/a/159777

[thorn saffron]

Merci !

J'essaie tt à l'heure et je te dis.

[thorn saffron]

Ca marche, merci !!!!!!!!!!!

[timid loom]

Tant mieux 👌
Hésite pas à expérimenter avec les notions de récursivité dans le futur ça pourra te servir

[thorn saffron]

Ok!

[celest cliff]

Bonjour !
Est ce que quelqu'un pourrait expliquer comment marche le flux de données en react? J'ai regardé la vidéo de grafikart mais ça ne m'eclaire pas ..
merci d'avance

[strange thicket]

Hello, il y a des dev react native par ici ?
En gros je requête mon API via axios et en dev tout marche bien, par contre quand je compile l'APK ça marche plus

[floral bolt]

Si tu appels localhost c’est normal 🙂

[strange thicket]

Nop j'appel une API bel est bien déployé en pre-prod ^^

J'ai plusieurs pistes, je passe par des secrets et un secure storage pour stocker les clés d'api ça vient peut-être de là

Ou alors il me manque un certificat TLS

[floral bolt]

J’avais eu le même soucis avec des variable d’environnements

[strange thicket]

Le pb c'est que je vois pas trop comment debug

Vu que la request est pas émise bahhhhhh

[strange thicket]

Tu avais mis en env var l'URL de l'API ?

[floral bolt]

Oui

[strange thicket]

Et comment avais-tu résolu le soucis du coup ?

[floral bolt]

En enlevant les env 😄

[celest cliff]

bonjour , est ce que qql sait pq ma console est remplie d'erreurs ? ( par exemple la ya 10 fois la même erreur )

[thorn saffron]

Parce-que la fonction est appellé plusieurs fois je pense.

[celest cliff]

ah effectivement merci

[wild orbit]

Hello, j'ai un petit probléme, j'ai mon fichier js "modal-exemple.js" qui n'arrive pas a acceder au path par aller dans le fichier "storage/data.json".

[wild orbit]

?

[queen ocean]

Ton chemin est pas bon en gros

[wild orbit]

oui je sais, mais justement, quelle est le bon chemin ?

[queen ocean]

./src/storage/data.json

[neat vale]

Bonjour, je bosse sur un projet pour mon ecole pour faire une application VueJS. Je me demandais comment j’allais faire mon back sachant que c’est une appli en temps réel où les utilisateurs sont connectés à des sockets communs. Je vois souvent dans les projets qu’il y a une appli back et une appli front utilisant différents framework. Hors je cherche la simplicité et l’efficacité d’où le choix de VueJS pour le front.

Que me conseillerez-vous ?

Comment s’y prendre est-ce que je fais le tout au même endroit où dois-je compartimenter le back et le front ? Si oui comment la connexion entre le back et le front se fait ?

Sachez que j'ai fait des recherches, ce sont des questions aux quels je n'ai pas réussi à avoir une réponse claire pour pouvoir prendre une décision. Je préfère demander à ceux qui ont l'expérience pour m'aiguiller.

[noble mountain]

Pour te donner une réponse détaillée en rapport avec mon expérience et de ce que j'ai pu voir, je peux te donner cette réponse là :

Pour ton projet d'appli VueJS, séparer le front du back, c'est vraiment la meilleure approche pour plusieurs raisons. Voici pourquoi c'est super important et comment ça peut faire une grosse différence pour ton projet.

Quand tu sépares le front et le back, tu organises ton projet en deux grandes parties qui communiquent entre elles via des API. Cela rend ton code plus clair parce que chaque partie a son propre rôle bien défini : le front s'occupe de tout ce qui est interaction avec l'utilisateur, tandis que le back gère la logique métier, l'accès aux données, etc. Cela simplifie beaucoup le développement et le debug, car tu sais exactement où aller pour modifier une fonctionnalité spécifique.

Avoir le front et le back séparés facilite énormément la maintenance et les mises à jour. Imaginons que tu veuilles changer de techno côté front ou ajouter des fonctionnalités back-end ; si tout est séparé, tu peux le faire sans impacter l'autre partie. Cela te permet d'être plus agile et de répondre plus vite aux besoins de ton projet ou aux retours des utilisateurs.

Séparer le front du back ajoute une couche de sécurité à ton appli. Tu peux, par exemple, mieux contrôler l'accès aux données sensibles en ne les exposant jamais directement au front-end. Tout passe par des API qui peuvent être sécurisées avec des tokens d'authentification, des vérifications de permissions, etc. Cela réduit le risque de failles de sécurité exploitables.

Si dans le futur, ton appli doit monter en charge, avoir une séparation claire entre front et back te facilitera la vie. Tu pourras scaler les parties indépendamment selon leurs besoins. Par exemple, si ton interface utilisateur devient plus complexe et requiert plus de ressources, tu pourras scaler le front sans toucher au back, et vice versa.
Séparer le front et le back te donne une flexibilité incroyable en termes de choix technologiques. Tu peux choisir les outils les plus adaptés pour chaque partie de ton projet. Par exemple, VueJS est génial pour le front, mais pour le back, tu pourrais opter pour Node.js, Express, ou même FastAPI si tu es plus à l'aise avec Python. Cette flexibilité te permet d'optimiser chaque partie de ton application pour les meilleures performances et la meilleure expérience utilisateur.

Chercher la simplicité et l'efficacité, c'est crucial, mais ça ne veut pas dire qu'il faut précipiter les choses ou compromettre la qualité du projet

Les autres pourront compléter. Je pense que j'ai oublié beaucoup de choses mais tu as les gros points important par rapport à ta question

[neat vale]

D'accord merci ça m'aide beaucoup à comprendre, je vois. Étant donné que l'on a 3 mois faire ce projet, on m'a conseillé Adonis et d'utiliser TypeScript. Ce que j'ai du mal à concevoir c'est les calls API comment ils se font à quel endroit, à quel moment ? Je me projette difficilement, car avec les frameworks js ou ts on est souvent éparpillé et libre.

[noble mountain]

Tu vas d'abord définir des routes qui correspondent à différentes actions que ton application peut effectuer. Ces routes seront définies dans des fichiers de route, souvent dans le dossier routes de ton projet Adonis.

Chaque route sera liée à une fonction spécifique dans un contrôleur. Les contrôleurs contiennent la logique pour répondre aux appels API. Par exemple, si tu as une route pour récupérer la liste des utilisateurs, tu auras un contrôleur qui contiendra la logique pour interroger la base de données et renvoyer les données des utilisateurs.

Du côté de ton application VueJS, tu vas faire des appels HTTP à ces routes définies dans ton back-end AdonisJS pour récupérer des données ou effectuer des actions. Ces appels peuvent être déclenchés par des interactions utilisateur, comme cliquer sur un bouton, ou par des événements dans le cycle de vie des composants VueJS, comme le montage d'un composant.

Une fois que l'API back-end a traité la demande, elle renvoie une réponse (généralement au format JSON) que ton application VueJS peut alors utiliser pour mettre à jour l'interface utilisateur, afficher les données, etc.

C'est du MVC comme fait Next.js, Laravel et d'autres frameworks.

[neat vale]

Yes je vois d'accord donc pour le back on est sur du Model Controller et sur le front on a les données modélisés et la vue

et il ya des astuces pour mettre en commun la modélisation des données ?

par exemple je souhaite typé mes données vu que c'est possible en TypeScript, afin d'être sûr d'avoir un objet du même type et accéder aux méthodes de celui-ci ect ?

d'habitude comment s'organise le front et le back dans ce cas de figure

car il s'agit d'une communication de données bilatérales à certains moments

d'où l'intention de typer mes données correctement avec des comons classes (c'est comme ça que je faisais en Java)

(un package comon et dedans toutes les classes communes lorsque j'avais une partie client et une partie server)

[noble mountain]

D'abord, une chose super pratique avec TypeScript, c'est qu'on peut définir des modèles ou des interfaces pour nos données. Du coup, si tu veux être sûr que tes données respectent un certain format ou une certaine structure à travers ton appli, tu peux définir ces structures sous forme d'interfaces ou de classes dans TypeScript. Par exemple, si tu as un objet utilisateur, tu définis une interface User avec toutes les propriétés attendues et leurs types. Comme ça, que ce soit côté front ou back, tu peux t'assurer que tes utilisateurs seront toujours manipulés de la même manière.

Pour la partie partage de ces types entre le front et le back, y a plusieurs façons de le faire. Si ton front et ton back sont dans le même repo (monorepo), tu peux simplement avoir un dossier types ou models à la racine de ton projet, où tu stockes tous ces types TS. Ensuite, tu les importes là où tu en as besoin, que ce soit côté front ou back. Cela rend les choses super pratiques et centralisées.

Si par contre, ton front et ton back sont dans des repos séparés, là ça devient un peu plus compliqué mais pas impossible. Une solution serait de créer un package npm privé contenant tous tes modèles TypeScript partagés. Tu le publies ensuite dans un registre npm (privé ou public, selon tes besoins de confidentialité), et tu l'installes comme dépendance dans tes projets front et back. Cela demande un peu plus de setup initial, mais c'est hyper efficace pour garder tout synchronisé.

Pour ce qui est de la communication de données bilatérale, surtout en temps réel, utiliser des sockets c'est super, mais ça ajoute une couche de complexité pour s'assurer que les données échangées sont bien du type attendu. Là encore, TS peut t'aider. En définissant des types ou interfaces pour les messages échangés via les sockets, tu peux t'assurer que les données envoyées et reçues sont correctement typées. Cela te permet de profiter du système de types de TS pour sécuriser et documenter la communication entre ton front et ton back.

En gros, l'idée c'est de vraiment tirer parti de typescript pour définir des structures de données communes et les partager entre ton front et ton back. Cela demande un peu d'organisation et parfois de setup technique, mais les bénéfices en termes de maintenabilité, de sécurité et de clarté du code sont énormes. Et puis, c'est assez similaire à ce que tu faisais en Java, donc ça devrait te parler.

Et tu ferras gaffe ton portfolio que tu as fais, je sais pas si il est terminé ou non, mais, il est pas du tout adapté sur les écrans mac

[autumn tendon]

pc portable non plus apparament

le texte je le vois en gigantesque

[neat vale]

je sais j'ai pas fait le responsive en tout cas j'avais commencé

pourtant sur les écrans 1920*1080 ça marche chez moi

[violet knot]

1920*1080 != pas responsif

pas tout le monde a la fenetre en plein ecrans

[noble mountain]

Personnellement écran macbook c'est 1440*900

[celest cliff]

Bonjour ! Est-ce-que quelqu'un saurait pourquoi ma navbar nbe marche pas ? :

import { BrowserRouter , Route , Switch } from 'react-router-dom'
import Home from './pages/Home'
import Portfolio from './pages/Portfolio'
import Contact from './pages/Contact'
import Knowledges from './pages/Knowledges'
import NotFound from './pages/NotFound'


const App = () => {
  return (
    <>
      <BrowserRouter>
      <Switch>
          <Route exact path='/' component={Home} />
          <Route path='/competences' component={Knowledges} />
          <Route path='/portfolio' component={Portfolio} />
          <Route path='/contact' component={Contact} />
          <Route component={NotFound} />
      </Switch>
      </BrowserRouter>
    </>
  );
};

export default App; ```

[past nimbus]

https://reactrouter.com/en/main/components/routes#routes

<Route path='/contact' element={<Contact />} />

[drowsy ocean]

Salut, je rencontre un pb avec la lib koffi et une dll, si il y a des gens qui ont déjà fait affaire a cette lib j'ai besoin de vous !

[noble mountain]

Pose ton problème directement

Ce sera plus simple ^^

[drowsy ocean]

Bah en gros j'essaye d'exécuter la fonction pcap_findalldevs de wpcap.dll et de récupérer sa sortie mais impossible de la récup

[noble mountain]

C'est-à-dire ? Y a plus de détails ?

[drowsy ocean]

Bah tout simplement j'arrive a exécuter la fonction mais je n'arrive pas récupérer son return avec koffi
https://www.tcpdump.org/manpages/pcap_findalldevs.3pcap.html

[noble mountain]

Et ton code ça donne quoi ?

[drowsy ocean]

import koffi from 'koffi';

const libpcap = koffi.load('C:/Windows/System32/Npcap/wpcap.dll');

const sockaddr = koffi.struct('sockaddr', {
    sa_family: 'ushort',
    sa_data: 'char[14]',
});

const pcap_addr = koffi.struct('pcap_addr', {
    next: 'pcap_addr *',
    addr: sockaddr,
    netmask: sockaddr,
    broadaddr: sockaddr,
    dstaddr: sockaddr,
});

const pcap_if_t = koffi.struct('pcap_if_t', {
    next: 'pcap_if_t *',
    name: 'char *',
    description: 'char *',
    addresses: pcap_addr,
    flags: 'uint',
});

const pcap_init = libpcap.func('int pcap_init(unsigned int opts, char *errbuf)');
const pcap_findalldevs = libpcap.func('int pcap_findalldevs(pcap_if_t **alldevsp, char *errbuf)');
//const pcap_freealldevs = libpcap.func('void pcap_freealldevs(pcap_if_t *alldevs)');

const errbuf = Buffer.alloc(2048);
let alldevsp = {};

const init = pcap_init(0, errbuf);
const find = pcap_findalldevs(koffi.as(alldevsp, 'pcap_if_t *'), errbuf);

console.log(`init: ${init}`);
console.log(`find: ${find}`);

console.log(`errbuf: ${errbuf.toString()}`);
console.log(alldevsp);

[noble mountain]

Premier truc que je vois, c'est que tu initialises alldevsp comme un objet vide.. Tu as besoin d'un pointeur vers un pointeur de pcap_if_t

[drowsy ocean]

Et ça donne quoi en code ?

[noble mountain]

Alors attend je me tord un peu la tête histoire de comprendre

Koffi fonctionne de manière similaire à ffi et tu peux juste pas passer par un objet vide. Tu dois créer un buffer qui peut agir comme un pointeur vers un pointeur

Et j'essaie de look pour le code

Enfaite, tu veux une référence vers une zone de la mémoire qui pourra stocker l'adresse de la structure pcap_if_t

[drowsy ocean]

Ouais c'est ce qu'il me semblais mais j'ai l'impression que koffi nous donne pas les outils pour lire cette zone

J'ai vu sur un forum de 2013 que certains utilisais la lib ref mais je pense qu'elle est déprécié

[noble mountain]

// Créer un pointeur vers un pointeur (pcap_if_t **)
const pcap_if_tPtrPtr = ref.refType(ref.refType(pcap_if_t));

// Allouer de la mémoire pour le pointeur vers le pointeur
let alldevsp = ref.alloc(pcap_if_tPtrPtr);

// La mémoire en 8 octets, tout dépend de l'architecture 
let alldevsp = Buffer.alloc(8); // 8 pour du 64 bits

let alldevspBuffer = Buffer.alloc(8); 
const find = pcap_findalldevs(koffi.ref(alldevspBuffer), errbuf);

tu dois créer un buffer qui peut agir comme un pointeur vers un pointeur.

Ensuite, lorsque tu passes alldevsp à la fonction pcap_findalldevs, tu passes réellement un buffer qui agit comme pcap_if_t **. Après l'appel de la fonction, ce buffer contient l'adresse de la structure pcap_if_t.

Tu dois passer ce buffer à pcap_findalldevs. Après l'appel de la fonction, alldevsp devrait contenir l'adresse mémoire de la structure pcap_if_t retournée par la fonction. Ensuite, tu pourrais utiliser les méthodes fournies par koffi pour accéder à cette structure et itérer sur la liste des interfaces.

Ce que chatgpt m'a dit car côté js jsp du tout

J'essaie de voir ce qui y'a

C'est vachement restreint

[drowsy ocean]

Et avec koffi tu pense que c'est pas possible de le faire directement ? parce que ref utilise gyp-node et j'ai pas envie de l'utiliser

[noble mountain]

Avec les buffer de njs pour le coup

[drowsy ocean]

yes ducoup je reviens sur un pb que j'ai, je reçois des données mais elle sont impossible a traiter + elle changent alors que ça doit être une valeur fixe de mes devices:

[noble mountain]

Données non interprétables pour le coup

Fin une mauvaise interprétation des données

Dans tous les cas, il y aura une mauvaise interprétation si tes pointeurs sont pas correctement utilisés

[noble mountain]

T'es sur de la taille de ton buffer?

Lorsque tu passes alldevsp à pcap_findalldevs, tu dois passer l'adresse du buffer, pas le buffer lui-même

[drowsy ocean]

Oui meme si je le met a 2000000 ça marche pas

[noble mountain]

Après pour le coup moi j'te dirais d'utiliser un .ref

[drowsy ocean]

Mouais ref je suis vraiment pas chaud, normalement koffi a prévu quelque chose pour ça mais j'ai pas encore trouver

le .as de koffi etait prometteur

[noble mountain]

koffi.as(alldevsp, 'pcap_if_t *')

C'est sensé le faire par rapport au message que j'ai mis

Mais faut s'assurer que c'est bien le cas

[drowsy ocean]

c'est ce que je fait de base

mais c'est pas pour autant que ça marche alors jsp

[noble mountain]

https://koffi.dev/pointers?highlight=pointer

[drowsy ocean]

Ouais mais je vois toujours pas

[drowsy ocean]

C'est bon, j'ai enfin trouver !

[alpine bane]

Bonjour, je viens de commencer à apprendre à coder en JavaScript. Voici mon code, il doit servir à calculer l'IMC d'une personne.
Cependant, sur mon site quand je rentre des valeur dans mes input et que je click sur le bouton Calculer mon IMC il m'affiche toujours la même catégorie de poids. Pouvez vous m'aider à trouver l'erreur. je vous remercie.

@moi si vous avez trouvé

Voici le code

[noble mountain]

Pour l’instant la seule chose je vois c’est les var et functions

@alpine bane l'expression 18.5<=IMC<25 est l'erreur

D'après toi pourquoi elle fonctionne pas

[alpine bane]

Je pense a cause du = ?

[noble mountain]

En gros, 18.5<=IMC<25 est évaluée en deux parties

Premièrement, 18.5<=IMC est évalué, ce qui peut être true ou false

Jusque la tu me suis ?

[alpine bane]

oui

[noble mountain]

Puis, parce que true est considéré comme 1 et false comme 0 en JavaScript, l'expression devient 1<25 ou 0<25

les deux donnant true, indépendamment de la valeur de IMC

[alpine bane]

ok c'est pour cela que cela mets a chaque fois corpulence normal

[noble mountain]

En gros, ça signifie que cette condition sera toujours vraie pour tout IMC supérieur à 18.5, et le code n'exécutera jamais les blocs de conditions suivants

[alpine bane]

ok

j'ai enfin compris

je te remercie

[noble mountain]

Du coup, dit moi comment tu dois le modifier ton code ?

[alpine bane]

je pense en faisant plusieurs fonction qui s'active par rapport a la valeur de IMC ?

[noble mountain]

Non du tout même pas besoin

[alpine bane]

ah

je fais comment alors ?

[noble mountain]

18.5<=IMC<25

C'est l'erreur

[alpine bane]

oui

ah

[noble mountain]

Fin celui à 25-30-35-40

Sont les erreurs

Mais si tu corriges celui à 25

Tu auras les erreurs sur la deuxième et ainsi de suite

[alpine bane]

on peut faire : 18.5<IMC , IMC<25 ?

[alpine bane]

oui ça j'ai compris

[noble mountain]

Tu y es presque mais tu dois utiliser un opérateur logique

à la place de la virgule

[alpine bane]

& ?

[noble mountain]

Presque

[alpine bane]

and ?

[noble mountain]

&&

[alpine bane]

ah

[noble mountain]

18.5 <= IMC && IMC < 25

[alpine bane]

ok je teste ça de suite

je te remercie en tous cas

[noble mountain]

En gros ça donne ça :

if (IMC < 18.5) {
        Text = "Insuffisance pondérale";
    } else if (IMC >= 18.5 && IMC < 25) {
        Text = "Corpulence normale";
    } else if (IMC >= 25 && IMC < 30) {
        Text = "Surpoids";
    } else if (IMC >= 30 && IMC < 35) {
        Text = "Obésité modérée";
    } else if (IMC >= 35 && IMC < 40) {
        Text = "Obésité sévère";
    } else {
        Text = "Obésité morbide";
    }

[alpine bane]

oui c'est ça

merci !

[noble mountain]

Pas de soucis, si ça a permis de te débloquer et de comprendre 🙂

[alpine bane]

oui j'ai compris et appris !

je te remercie

aurais tu des exercices ou des choses a rajouter a mon code ?
comme ça j'apprends d'autre chose et je m'entraine.

[noble mountain]

Pour le coup pas spécialement après, essaie de créer une validation des entrées, des conversions d'unités, des conseils de santé en fonction de la catégorie d'IMC

Des petites choses comme ça

C'est comme ça que tu apprendras

En faisant des petites choses et en créant plus de fonctionnalités même si inutile dans ton projet mais des trucs tout bête qui vont te permettre de te créer la logique, de retenir, etc...

[alpine bane]

ok juste c'est quoi "une validations des entrées" ? c'est si j'appuie sur entrée sa calcule directement l'IMC ?

[alpine bane]

ok je vais faire ça

[noble mountain]

Ajoutez une validation pour s'assurer que l'utilisateur entre des nombres valides pour le poids et la taille. Par exemple, vérifiez que les valeurs ne sont pas négatives et ne sont pas nulles

[alpine bane]

apres si tu as un autre projet je veux bien

[alpine bane]

ah ok

je vais essayer

je te remercie

[noble mountain]

Pas de soucis ! Hésite pas à poster tes questions, etc... J'y répondrais et les autres membres de ce discord y répondront aussi !

[alpine bane]

ok merci, je n'hésiterais pas !

[floral bolt]

J'ai des petites idée si tu veux

• calculatrice
• Todo
• Chronomètre
• Generateur de mot de passe

[alpine bane]

ok je pensais faire Calculatrice

ou un calculateur de moyenne

et c'est quoi un Todo ?

@floral bolt

[floral bolt]

todolist

[alpine bane]

ah ok cela peut être bien

[frank sparrow]

fait un switch case

@alpine bane

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch

[cyan iron]

Plutôt cette partie 👀
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch#an_alternative_to_if...else_chains

[slim anvil]

😵‍💫

ca manque d'un else if

[noble mountain]

Petit miss seulement x)

[slim anvil]

@alpine bane pour les conditions je te conseille de toujours rester a 2 , if et else, allez on peut pousser a 3 en rajoutant un else if mais ensuite stop
Si tu en as plus c'est que tu n'utilises pas ce qu'il faut, une condition comme son nom l'indique c'est

SI....
SINON...

si tu commences a rajouter des
SI...
SINON SI...
SINON SI....
SINON SI...
SINON

tu devrais t'orienter vers un switch et dans certains cas un Dict 👍

[alpine bane]

Ok je vais essayer

[alpine bane]

Ok je vais me renseigner la dessus

Merci pour vos conseils

[noble mountain]

Après c'est le genre de choses comme les scoops etc quand j'ai mis je vois des functions et var que tu vois après pour optimiser pour le coup

En débutant tu peux pas te permettre de t'éparpiller partout

Au moins qu'il comprenne son code quoi

Si il faut qu'il passe par la alors go et il verra plus tard avec l'expérience ^^

[slim anvil]

ce que j'ai dis c'est pas s'éparpiller partout, c'est juste le principe meme d'une condition 🤔 pas sur de comprendre ou tu veux en venir

[noble mountain]

Pour un débutant, il est crucial de commencer avec des concepts simples et de construire progressivement une compréhension des structures plus complexes. La simplicité aide à la compréhension et à la maintenance du code, ça deviendra naturel avec l'expérience après c'est ça que je veux dire

C'est déjà un très bon début pour commencer et il approfondira ces détails la plus tard

[hasty shoal]

Hello, quelqu'un saurait m'expliquer comment je peux mettre mon site sur github sans que les clé d'API soient visibles ? J'ai testé plein de truc mais je me perd un peu. Thanks !

[noble mountain]

Avec le gitignore ?

Tu le met pas directement visible sur ton code tu mets dans un .env et hop

[oak turret]

Pour répondre concrètement avec ce qu'a dit Vrizix :

Tu fais un .env

API_KEY="TON API KEY"

Tu fais un .env.example avec le même contenu mais sans les valeurs qui lui est accordé au push (pour que tu le c/c en .env en prod)

Dans ton code tu modifies les valeurs par process.env.VALEUR_DU_ENV donc pour l'api key : process.env.API_KEY

Et dans ton .gitignore

.env

Et voilà, tout est good

[hasty shoal]

@oak turret oui c'est ce que j'ai fait mais je sais pas pourquoi ça ne veut pas, il ne reconnait pas "process" justement alors que j'ai bien fait npm i dotenv

[oak turret]

il faut l'initialiser

require('dotenv').config()

https://www.npmjs.com/package/dotenv

[noble mountain]

require('dotenv').config();

ou
import dotenv from 'dotenv';
dotenv.config();

Mais le premier en général suffit largement

[hasty shoal]

quand je fais la version avec le require, il ne reconnais pas require justement

[hasty shoal]

je vais jeter un oeil à ça

[oak turret]

si t'es en ES6

import 'dotenv/config'

[noble mountain]

import dotenv from 'dotenv';
dotenv.config();

pour es6

Ptn mais @oak turret arrête d'être plus rapide que moi stp 😢

[oak turret]

[hasty shoal]

j'ai vrmt l'impression d'avoir 2 de QI alors que c'est hyper simple, juste ça ne veut pas mdr

[noble mountain]

Comment ça

[oak turret]

fait voir ton code

[noble mountain]

Envoie ton code

'-'

[oak turret]

mdrr

[noble mountain]

Copieur

[oak turret]

qui est vraiment le copieur, je me le demande

[noble mountain]

[hasty shoal]

ouais alors dcp faut que je remodifie mes dernieres retouches

import { initializeApp } from "https://www.gstatic.com/firebasejs/10.9.0/firebase-app.js";
import { getDatabase, ref, set, child } from "https://www.gstatic.com/firebasejs/10.9.0/firebase-database.js";

const firebaseConfig = {
    apiKey: process.env.apiKey,
    authDomain: process.env.authDomain,
    databaseURL: process.env.databaseURL,
    projectId: process.env.projectId,
    storageBucket: process.env.storageBucket,
    messagingSenderId: process.env.messagingSenderId,
    appId: process.env.appId,
    measurementId: process.env.measurementId
};

const app = initializeApp(firebaseConfig);
const db = getDatabase(app);```

je sais plus comment on formatte en js sorry avec les couleurs

[noble mountain]

ton .env est bien à la racine et tout hein ?

[hasty shoal]

yes

et il est dans le .gitignore dcp

[noble mountain]

Et ta quoi comme erreur ? xd

c'est process tjr qui est pas reconnu

[hasty shoal]

Failed to resolve module specifier "dotenv/config". Relative references must start with either "/", "./", or "../".

alors que j'ai fait comme je disais "npm i dotenv" dans le dossier de mon projet quoi

parce que ça me mets bien le bon chemin pourtant

[noble mountain]

T'essaie de le run sur un navigateur ?

[hasty shoal]

oui je fais live server

[noble mountain]

C'est pas compatible du coup ... Les navigateurs ne peuvent pas exécuter de tels modules directement et n'ont pas accès au système de fichiers de l'utilisateur pour des raisons de sécurité

[hasty shoal]

je suis censé faire comment du coup ?

[noble mountain]

essaie de le node app.js

[hasty shoal]

ok ça devra me donner quoi ?

ça me donne ça

[noble mountain]

ça interprète ton script quoi voit ce que ça te met

[glass cargo]

NodeJS utilise CommonJS par défaut, donc c'est :

require("dotenv").config()```

[hasty shoal]

là solution que j'avais trouvé c'est de mettre type="module" dans mon html mais dcp c'est pas possible de ce que tu me disais

[glass cargo]

Oui aussi x)

[noble mountain]

Sauf qu'il reconnait pas require

XD

Essaie de renommer ton app.js en app.mjs

et sinon oui, type="module" dans ton package.json

[hasty shoal]

ça je le modifie comment en require ?

[noble mountain]

npm i firebase

import { initializeApp } from "firebase/app";
import { getDatabase } from "firebase/database";

Il me semble

Après c'est bien comme il est

[hasty shoal]

ok ok

nn il aime pas le import

[noble mountain]

met l'extension de ton fichier en .mjs

[hasty shoal]

ok

[noble mountain]

ou alors comme j'ai mis " et sinon oui, type="module" dans ton package.json "

[hasty shoal]

comment je le lance dcp mtn ?

[hasty shoal]

j'en ai pas de package.json"

[noble mountain]

node app.mjs

[noble mountain]

ahhh

[hasty shoal]

il a pas l'air de kiffé

[noble mountain]

C'est normal ^^

l'importation de modules depuis une URL avec le schéma https:, ce qui n'est pas pris en charge par défaut dans Node.js

npm i firebase

import { getDatabase, ref, set, child } from "firebase/database";

[hasty shoal]

comme ça ?

[noble mountain]

Non tu enlèves le lien

Il aime pas les liens 😉

tant que tu l'as npm i firebase

c'est bon

[hasty shoal]

là il kiffe pas le require

du dotenv

[noble mountain]

import dotenv from 'dotenv';
dotenv.config();

[hasty shoal]

c'est dejà mieux mais nouvelle erreur dcp

je sais pas si tu auras la solution

alors que mon code est là

[noble mountain]

Toutes tes clés sont bonnes ? Tu es sûr ?

Fait voir tout le code

ton .env est sensé ressembler à ça dcp :

apiKey=ton_api_key
authDomain=ton_auth_domain
databaseURL=ta_database_url
projectId=id_de_ton_projet
storageBucket=ton_storage_bucket
messagingSenderId=ton_messaging_sender_id
appId=ton_app_id
measurementId=ton_measurement_id

[hasty shoal]

oui oui il ressemble à ça

ah non mdrrr

[noble mountain]

bah voilà 😉

[hasty shoal]

j'ai tt en MAJ

[noble mountain]

C'est pour ça

Tu dois remettre exactement comme c'est écris

[hasty shoal]

ouais ok c'est bon, j'ai juste un autre prblm

[noble mountain]

Vas-y

[hasty shoal]

je fais des document.getElementById mais dcp j'ai l'erreur ReferenceError: document is not defined

genre :

import dotenv from 'dotenv';
dotenv.config();
import { initializeApp } from "firebase/app";
import { getDatabase, ref, set, child } from "firebase/database";

const firebaseConfig = {
    apiKey: process.env.apiKey,
    authDomain: process.env.authDomain,
    databaseURL: process.env.databaseURL,
    projectId: process.env.projectId,
    storageBucket: process.env.storageBucket,
    messagingSenderId: process.env.messagingSenderId,
    appId: process.env.appId,
    measurementId: process.env.measurementId
};

const app = initializeApp(firebaseConfig);
const db = getDatabase(app);

document.getElementById("submitButton").addEventListener('click', function () {
    event.preventDefault();

    const date = new Date();
    const currentDate = `${date.getDate().toString().padStart(2, '0')}/${(date.getMonth() + 1).toString().padStart(2, '0')}/${date.getFullYear()} ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}:${date.getSeconds().toString().padStart(2, '0')}`;

    set(ref(db, 'users/' + document.getElementById('firstName').value + " " + document.getElementById('lastName').value + " " + document.getElementById('postalCode').value),
        {
            prenom: document.getElementById('firstName').value,
            nom: document.getElementById('lastName').value,
            email: document.getElementById('email').value,
            quantity: document.getElementById('quantity').value,
            postalCode: document.getElementById('postalCode').value,
            dateEnvoi: currentDate
        }).then(() => {
            console.log("Données envoyées avec succès !");
            // Masquer le formulaire et afficher la page de confirmation
            document.getElementById('confirmationPage').classList.remove('hidden');
            document.getElementById('formPage').style.display = 'none';
            alert("Envoi réussi")
        });
})
```

[noble mountain]

c'est normal, c'est un élément DOM seulement éxécutable sur un navigateur

Node.js ne peut pas le reconnaître

[hasty shoal]

hmmm

[noble mountain]

Tu mélanges le côté serveur et côté client

[hasty shoal]

dcp je bouge le listener dans mon script.js ?

yes c'est ce que je viens de me dire

et comment j'appelle mes values de l'autre côté dcp ?

[noble mountain]

Bah en gros tu sépares simplement les deux : server.js par exemple pour firebase et ton code avec les document etc dans un client.js par exemple que tu inclus dans ton HTML

donc oui ton idée de ton script.js fonctionne

[hasty shoal]

donc dcp je vais avoir un scrpit.js, un server.js, et un client.js ?

ou je peux mettre scrpit et client juste dans le script.js ?

[noble mountain]

Nan mais genre tout ce qui est côté client de ton app.js tu l'enlèves et tu le mets dans ton script.js

[hasty shoal]

ouais je comprends bien mais là je fais pas encore la diff entre quoi va de quel côté

[hasty shoal]

dans ça dcp

[noble mountain]

document.getElementById("submitButton").addEventListener('click', function () {
    event.preventDefault();

    const date = new Date();
    const currentDate = `${date.getDate().toString().padStart(2, '0')}/${(date.getMonth() + 1).toString().padStart(2, '0')}/${date.getFullYear()} ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}:${date.getSeconds().toString().padStart(2, '0')}`;

    set(ref(db, 'users/' + document.getElementById('firstName').value + " " + document.getElementById('lastName').value + " " + document.getElementById('postalCode').value),
        {
            prenom: document.getElementById('firstName').value,
            nom: document.getElementById('lastName').value,
            email: document.getElementById('email').value,
            quantity: document.getElementById('quantity').value,
            postalCode: document.getElementById('postalCode').value,
            dateEnvoi: currentDate
        }).then(() => {
            console.log("Données envoyées avec succès !");
            // Masquer le formulaire et afficher la page de confirmation
            document.getElementById('confirmationPage').classList.remove('hidden');
            document.getElementById('formPage').style.display = 'none';
            alert("Envoi réussi")
        });
})

Tu enlèves ça tu le sépares

C'est côté client

ça :

import dotenv from 'dotenv';
dotenv.config();
import { initializeApp } from "firebase/app";
import { getDatabase, ref, set, child } from "firebase/database";

const firebaseConfig = {
    apiKey: process.env.apiKey,
    authDomain: process.env.authDomain,
    databaseURL: process.env.databaseURL,
    projectId: process.env.projectId,
    storageBucket: process.env.storageBucket,
    messagingSenderId: process.env.messagingSenderId,
    appId: process.env.appId,
    measurementId: process.env.measurementId
};

const app = initializeApp(firebaseConfig);
const db = getDatabase(app);

C'est côté serveur et ne doit pas être exécuté dans le navigateur

[hasty shoal]

ok ok et ça c'est bon du coup :

[noble mountain]

non tu dois pas mettre ton app.mjs

[hasty shoal]

ça marche

[noble mountain]

il doit pas être exécuté sur ton html

[hasty shoal]

oui je suis con tu viens de me le dire

du coup c'est ce que je me disais, le set n'est plus reconnu, sans doute prcq mon app.mjs n'est pas relié ?

[noble mountain]

tu dois mettre le CDN de firebase dans ton .html

[hasty shoal]

cdn ?

[noble mountain]

<script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-database.js"></script>

c'est ça un CDN

[hasty shoal]

ok je vais essayer de trouver le html de firebase

[noble mountain]

nan mais

dans ton html de ton site

Je veux dire

[hasty shoal]

ah okk

[noble mountain]

Tu dois l'ajouter à ton index.html ou jsp comment tu l'as appelé

[hasty shoal]

le set n'est tjrs pas défini quand je fais ça

je devrait le mettre dans le head ?

[noble mountain]

Ah bah biensur

[hasty shoal]

okay

[noble mountain]

Toutes les initialisations comme ça c'est dans le <head>

[hasty shoal]

ça ne veut tjrs pas

[noble mountain]

Tu dois mettre ton code d'initialisation de ton firebase dans ton script.js

[hasty shoal]

les deux dernières lignes :

?

[noble mountain]

const firebaseConfig = {
    apiKey: process.env.apiKey,
    authDomain: process.env.authDomain,
    databaseURL: process.env.databaseURL,
    projectId: process.env.projectId,
    storageBucket: process.env.storageBucket,
    messagingSenderId: process.env.messagingSenderId,
    appId: process.env.appId,
    measurementId: process.env.measurementId
};

const app = initializeApp(firebaseConfig);

envoie ton script.js je te le fais ce sera plus simple

[hasty shoal]

du coup c'est ce que tu m'a fais bouger tt à l'heure :

const db = getDatabase(app);

document.getElementById("submitButton").addEventListener('click', function () {
    event.preventDefault();

    const date = new Date();
    const currentDate = `${date.getDate().toString().padStart(2, '0')}/${(date.getMonth() + 1).toString().padStart(2, '0')}/${date.getFullYear()} ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}:${date.getSeconds().toString().padStart(2, '0')}`;

    set(ref(db, 'users/' + document.getElementById('firstName').value + " " + document.getElementById('lastName').value + " " + document.getElementById('postalCode').value),
        {
            prenom: document.getElementById('firstName').value,
            nom: document.getElementById('lastName').value,
            email: document.getElementById('email').value,
            quantity: document.getElementById('quantity').value,
            postalCode: document.getElementById('postalCode').value,
            dateEnvoi: currentDate
        }).then(() => {
            console.log("Données envoyées avec succès !");
            // Masquer le formulaire et afficher la page de confirmation
            document.getElementById('confirmationPage').classList.remove('hidden');
            document.getElementById('formPage').style.display = 'none';
            alert("Envoi réussi")
        });
})

fin y'a tt le reste qui gère mon html mais c'est pas censé affecté quoi que ce soit dans mon prblm

[noble mountain]

Je finis ma pause clope et je te le fais en rapide

[hasty shoal]

t'inquiète pas ! c'est deja hyper gentil t'en fais pas

[noble mountain]

window.addEventListener('DOMContentLoaded', (event) => {
  const firebaseConfig = {
      apiKey: process.env.apiKey,
      authDomain: process.env.authDomain,
      databaseURL: process.env.databaseURL,
      projectId: process.env.projectId,
      storageBucket: process.env.storageBucket,
      messagingSenderId: process.env.messagingSenderId,
      appId: process.env.appId,
      measurementId: process.env.measurementId
  };

  // Initialisez Firebase
  firebase.initializeApp(firebaseConfig);
  const db = firebase.database();

  document.getElementById("submitButton").addEventListener('click', function (event) {
      event.preventDefault();

      const date = new Date();
      const currentDate = `${date.getDate().toString().padStart(2, '0')}/${(date.getMonth() + 1).toString().padStart(2, '0')}/${date.getFullYear()} ${date.getHours().toString().padStart(2, '0')}:${date.getMinutes().toString().padStart(2, '0')}:${date.getSeconds().toString().padStart(2, '0')}`;
      
      const firstName = document.getElementById('firstName').value;
      const lastName = document.getElementById('lastName').value;
      const postalCode = document.getElementById('postalCode').value;

      const userRef = firebase.database().ref('users/' + firstName + " " + lastName + " " + postalCode);

      userRef.set({
          prenom: firstName,
          nom: lastName,
          email: document.getElementById('email').value,
          quantity: document.getElementById('quantity').value,
          postalCode: postalCode,
          dateEnvoi: currentDate
      }).then(() => {
          console.log("Données envoyées avec succès !");
          // Masquer le formulaire et afficher la page de confirmation
          document.getElementById('confirmationPage').classList.remove('hidden');
          document.getElementById('formPage').style.display = 'none';
          alert("Envoi réussi");
      }).catch((error) => {
          console.error("Erreur lors de l'envoi des données : ", error);
          alert("Échec de l'envoi");
      });
  });
});

Normalement, c'est sensé être good avec ça

[hasty shoal]

tout les trucs comme ça "votre-apiKey" j'en fais quoi ?

[noble mountain]

apiKey: process.env.apiKey,
authDomain: process.env.authDomain,
databaseURL: process.env.databaseURL,
projectId: process.env.projectId,
storageBucket: process.env.storageBucket,
messagingSenderId: process.env.messagingSenderId,
appId: process.env.appId,
measurementId: process.env.measurementId

Je te l'ai modifié dans le code

Juste que je garde les explications que je fais de côté pour des sortes de cours

Et je trouvais intéressant ton cas xD

[hasty shoal]

ça marche

mais dcp j'ai re la même erreur, "process is not defined"

[hasty shoal]

fin dcp ça c'est script.js ou app.mjs ?

[noble mountain]

dans le script.js mais c'est normal j'ai merdé att

[hasty shoal]

okay

[noble mountain]

c'est des clés publiques ou privée ?

[hasty shoal]

jsp c'est firebase qui me les donne pour mettre dans mon code

mais le but c'était de les cacher dcp

[noble mountain]

Je réfléchis comment on peut faire ça facilement

Tu utilises pas express ou de frameworks ?

Mais en soit en général on utilise les clés publiques pour les mettre côté client

Ils seront accessibles

[hasty shoal]

ouais mais là ça craint si je mets les clés de ma base de données mdr

[hasty shoal]

nope

[noble mountain]

Mais les clés firebase il me semble en soit qu'elles sont publiques

[hasty shoal]

ah ouais ?

[noble mountain]

Yep

@oak turret j'te tag pour poser la question jsp si tu sais mais normalement les clés api firebase sont publiques ?

[hasty shoal]

genre ma clé d'api et tout le reste peu importe si tt le monde les voit ???

[noble mountain]

Bah les publiques, oui

[hasty shoal]

ouais, bah je sais pas quoi faire dcp

[noble mountain]

" Les clés API de Firebase sont conçues pour être publiquement visibles et utilisées dans le code client "

[hasty shoal]

donc tout ça depuis le début j'ai pas besoin de les cacher ??? prcq pour moi n'importe qui peut ecrire dans ma bdd dcp

[slim anvil]

non de memoire c'est uniquement pour te faire reconnaitre

[noble mountain]

Si vous utilisez l'authentification Firebase par mot de passe et que quelqu'un met la main sur votre clé API, il ne pourra accéder à aucune base de données de votre projet Firebase ni aux données Cloud Storage tant que ces données sont protégées par les règles de sécurité Firebase . Ils pourraient cependant utiliser votre clé API pour accéder aux points de terminaison d'authentification de Firebase et effectuer des demandes d'authentification sur votre projet.

https://firebase.google.com/docs/projects/api-keys?hl=fr

[slim anvil]

tu crains rien, mais faut toujours faire attention au reste

[noble mountain]

Ils peuvent brute-force

Mais faut le sécuriser en gros

[hasty shoal]

c'est quoi "le reste"

[slim anvil]

ce qu'il a ecrit en haut

[hasty shoal]

cad ?

[noble mountain]

@hasty shoal

Pour éviter la possibilité qu'une personne utilise à mauvais escient une clé API pour tenter une attaque par force brute, vous pouvez resserrer le quota par défaut des points de terminaison identitytoolkit.googleapis.com pour refléter les attentes normales de trafic de votre application. Sachez que si vous resserrez ce quota et que votre application gagne soudainement des utilisateurs, vous risquez d'obtenir des erreurs de connexion jusqu'à ce que vous augmentiez le quota. Vous pouvez modifier les quotas d'API de votre projet dans la console Google Cloud

[hasty shoal]

ouais ok docn ej peux revenir à mon code inital où je cherchais pas à cacher quoi que ce soit ?

[noble mountain]

En soit oui, après on rendu plus lisible ton code et tout c'est tjr bien ^^

[hasty shoal]

ouais ça c'est une autre histoire que je sais pas régler mdrr

[noble mountain]

mais en gros avec le code que je t'ai passé, c'est fonctionnel et c'est une bonne manière ^^

Après en général au début de t'es projets hésite pas à npm init ^^

pour avoir ton package.json et tout

[hasty shoal]

ouais mais là mon code c'est devenu un de ces bordel dcp

[noble mountain]

D'ou le but de faire attention dès le début à bien tout initialiser et ranger tes scripts, etc...

[hasty shoal]

ouais ouais j'avais pas prévu ça c'est la première fois que je le fais

[noble mountain]

Bah encore " pire ", quand tu commences et que c'est la première fois faut y réfléchir

ça prend forcément plus de temps mais au moins c'est structuré

[hasty shoal]

ok donc histoire que j'ai un modèle bien clean, je mets quoi dans le app.mjs ?

et dans mon script ?

[noble mountain]

dans ton app.mjs

et ce que je t'ai envoyé dans ton script.js

[noble mountain]

..

[hasty shoal]

il reconnait pas firebase dcp

[noble mountain]

<script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.0/firebase-database.js"></script>
<script src="client.js" type="module"></script>

dans ton index.html

C'est bon @hasty shoal ?

[hasty shoal]

là j'ai juste remis comme j'avais fait avant de demander de l'aide, et ça marche mais j'arrive pas à bien séparer tout, fin là je vois un "client.js" dans ce que tu m'envoies ??

@noble mountain

[noble mountain]

Oui mais c'est script.js jsp j'ai mis client.js en parlant du côté client

[slim anvil]

a ce rythme fais le de ton coté

[noble mountain]

xd

[hasty shoal]

quand je mets les codes aux endroits où tu m'as dit

[hasty shoal]

c'est pas prcq y'a du coté client et serveur au meme endroit ?

[glass cargo]

La bdd dans le client

Je connais pas firebase, mais rassure moi, la connexion se fait pas dans le browser

[hasty shoal]

ok bah jsuis perdu alors

[noble mountain]

nop

Côté serveur

[glass cargo]

ok autant pour moi x)

[woven cosmos]

Ya pas besoin de demander a l'utilisateur pour pouvoir enregistrer tout ce qu'il tape sur son clavier sur le site dans le cas ou c'est stocker nul part autre que sur une variable qui s'efface a chaque chargement de la page non ?

Sachant que ya aucune page de connexion ou truc du genre

C'est juste pour cacher un easter egg

Légalement c'est bon ?

[floral bolt]

Tu peux checker certaines lettres

Après récupérer tout ce que la personne écris c’est pas ouf

Mais regarde les rgpd

[slim anvil]

oui y a pas de soucis

pas besoin de demander, c'est comme ca qu'on fait pour des easter egg genre Konami code etc

[floral bolt]

C’est pas du troll ?

[slim anvil]

Non, c'est juste une variable coté front ou tu stock les event de key et qui sera reset si tu refresh donc bon

tu demandes pas aux gens leurs autorisations pour faire des onClick

donc onKeyPress ca reste un event navigateur, il le stock temporairement (sur la session de la tab finalement) donc sans pression

(faut que j'arrete de troll sinon on me croit jamais enfaite merci du conseil snox )

[floral bolt]

Ahah, les trucs des rgpd me perdent complètement

[slim anvil]

rgpd c'est surtout tout ce qui va etre tracking, analytics et ce que tu sauvegardes de ton coté

tu vois par exemple un site pour convertir un timestamp en vrai il a pas besoin de te demande l'autorisation de quoi que ce soit car tu as ecris dans l'input, car il a pas de raison de save quoi que ce soit (dans un cas super simple)

si la il se limite a le stock dans un tableau qui est reset, c'est good! (pour l'instant, on sait jamais ce que ca peut donner par la suite )

[woven cosmos]

Ok mrc

Mais ducoups pour l'ip ça serait pas pareil dans le fond ? Si c'est stocké en local et reset a chaque chargement

[slim anvil]

ça je peux pas te le confirmer, comme c'est de la data du user, bonne question
je dirai non a premiere vue, mais renseigne toi pour etre sur

[woven cosmos]

Top thx

L'un de met but premier concrètement ct de compter le nombre de personnes différentes a avoir cliqué sur x bouton sur mon site et pour ça je voulait juste get l'ip et envoyé +1 dans ma bdd , et mettre leurs ip dans leurs local storage du navigateur, comme ça si elle y est déjà ça envoie pas +1

Je pendais procéder ainsi car ça me paraissait assez simple

Mais jviens de me rendre compte que j'en avais pas besoin enft peut-être

[queen ocean]

https://zozimus.com/how-to-track-a-button-click-event-in-google-analytics-using-google-tag-manager/ 👀

[keen narwhal]

Bonsoir alors je cherche a faire une commande pour mon bot discord en JS qui consiste a faire !addrole role et que sa ajoute instantanément le role a la personne qui a écris le message j'ai une première version mais la le role est déja écris dans le code

@queen ocean toi tu as l'air chaud en dev discord ^^

[buoyant compass]

Faut ajouter un argument !addrole @keen narwhal @role

Ton role name va etre = à message.member[2] dcp pas loin de sa

J'ai jamais touché à djs mais sa doit pas etre loin de la vérité

[keen narwhal]

Donc je fais quoi la ? xD Je débute en JS j'ai pas trop compris

Tu veux que je fasse un argument !addrole ?

[buoyant compass]

Ben en gros ta commande c est si je veux te rajouter un role

!addrole @keen narwhal @role

Ya deux arguments dans la commande, ton pseudo et le role

[keen narwhal]

Non enfaite je veux que la personne qui écrivent !addrole lenomrole l'ai directmeent pas besoin de mention n'y rien

[buoyant compass]

Le deuxième argument tu le stockes dans ta variable roleName

Ah c est pas une cmd pour modo

[keen narwhal]

Oui

[buoyant compass]

Ben dcp ya juste besoin de ma mention du rôle

[keen narwhal]

Ce serait le meme principe que un reaction role

[buoyant compass]

Jsp comment sa marche sans mention le rôle mais sa doit etre sensible à la casse donc jsp

Tu peux essayet

[keen narwhal]

je veux juste trouver un moyen de remplacer sa
const roleName = 'role';
const roleToAdd = message.guild.roles.cache.find(role => role.name === roleName);

par le truc ecris

[buoyant compass]

Ben ça va etre ton roleName c est tout

Const roleName = message.member[1]

Jsp comment on récupère un argument sur djs

[keen narwhal]

Bah jsp pas non plus je débute en JS et en plus sur le dev discord ahah ^^

[buoyant compass]

const roleName = args[0] à l epoque je crois

[keen narwhal]

Alors j'ai fais la modif dcp et quand je fais la commande sans le nom du role sa me met bien un message Le rôle spécifié n'existe pas. mais si je met le role rien ne se passe

[buoyant compass]

    // Vérifier si la commande est 'addrole'
    if (command === 'addrole') {
        // Vérifier si l'utilisateur a mentionné un rôle
        if (!args.length) {
            return message.reply('Tu dois spécifier le nom du rôle à ajouter !');
        }

        // Récupérer le nom du rôle à ajouter (en supprimant le préfixe '!')
        const roleName = args[0];

        // Récupérer le rôle depuis le serveur
        const role = message.guild.roles.cache.find(role => role.name === roleName);

        // Vérifier si le rôle existe
        if (!role) {
            return message.reply('Ce rôle n\'existe pas sur ce serveur !');
        }

        // Ajouter le rôle à l'utilisateur qui a envoyé la commande
        message.member.roles.add(role)
            .then(() => {
                message.reply(`Le rôle "${roleName}" a été ajouté avec succès !`);
            })
            .catch(error => {
                console.error('Une erreur s\'est produite lors de l\'ajout du rôle :', error);
                message.reply('Une erreur s\'est produite lors de l\'ajout du rôle.');
            });
    }
});

Sa doit etre un truc du style

@keen narwhal

[keen narwhal]

Alors ok mais comment je modifie mopn code actuel avec sa ducoup xD

Déso je suis vraiment débutant la dedans dmr

[buoyant compass]

Edit v edt tout

Ton roleName tu mets args[0]
( c est ptet 1)

Et essaie sa déjà

[keen narwhal]

Sa marche pas ou alors je suis un boulet pour ajustez mon code xD

rien ne se passe

[buoyant compass]

Erreur dans le code ?

Apres jai pas touché à du djs depuis la V12 mtn on fait ptet plus comme ça

[buoyant compass]

Dans ton terminal ya rien ?

[keen narwhal]

clc le bot mdrr

[buoyant compass]

Pg l erreur du terminal je veux

Yen a pas ?

[keen narwhal]

non il y avait rien

[buoyant compass]

Là hange juste ligne 10
= args[0]

Et fais en dessous console.log(roleName)

Normalement t auras un log

Je veux savoir c est quoi

Ptn si on m'avait dit j allais aider qqun à 23h20 sur du djs 🤣

[keen narwhal]

mais il y a rien mdrrr

j'ai bien le console log pourtany

[buoyant compass]

Ya quoi dedans

Le consolelog

Yest ecrit quoi

[keen narwhal]

non j'ai mis le console log mais il y a rien justement mdr

[buoyant compass]

Remet ton clde d avant

Le tout debut

Lui

Et tu changes ce que je t ai dit

Oublies le mien

[keen narwhal]

att je suis con

j'avais pas changer mon nom de commande dans le main js

ducoup sa me fais bien une erreur

[buoyant compass]

Montre

[keen narwhal]

Alors c'est bizarre sa me fais pas d'erreur quand je fais !addrole le nomdurole mais parcontre quand je fais juste !addrole sa me fais un ererreur

[buoyant compass]

Bon

Tu vois sq

[keen narwhal]

Quoi ?

[buoyant compass]

Supprimes la ligne 9

Là

Tu la degage et tu retest

[keen narwhal]

Sa marche même plus quand je le démarre mdr

[buoyant compass]

Montre

[keen narwhal]

Ah non c'est bon j'avais pas delet un }

[buoyant compass]

🤣

Apprends JS avant de faire un bot après stp

[keen narwhal]

non toujours rien la ligne 9 on est d'accord c'est bien
if (command === 'addrole') {

Ahahah ^^

[buoyant compass]

Oui

Erreur

?

[keen narwhal]

pareil rien quand je fais !addrole lenomrole par contre si je fais juste !addrole

[buoyant compass]

Bon

Je vais te le redire

Pour la 6e fois

Tu reprends ton code de base

Et à la place de const roleName = 'role'

Tu mets const roleName = args[0]
Et en dessous console.log(roleName)

[keen narwhal]

oki

Et bah rien non plus j'ai repris mon code de base et juste modifié ce que tu ma dit et rien quand je fais !addrole monrole

😕

Donc franchement je sais pas

[queen ocean]

Si tu veux faire ta commande en mentionnant le role dedans genre !addrole @membre alors tu remplaces :

const roleName = 'role'
const roleToAdd = message.guild.roles.cache.find(role => role.name === roleName);

Et a la place tu mets :

const roleToAdd = message.mentions.roles.first()

[keen narwhal]

@queen oceanMerci de ta réponse je l'ai fais et non rien je ne se passe

même pas un message d'erreur

[queen ocean]

🤔

[queen ocean]

ajoute un console.log(roleToAdd)

[keen narwhal]

zut trompé xd

[queen ocean]

ha bah c'est pour ca

[keen narwhal]

quoi

[queen ocean]

Change ta condition

if (message.content === "!addrole")

Et a la place tu met

if (message.content.startsWith("!addrole")

Après tu devrais te renseigner pour faire un command handler plus propre, mais bon pas grave tu regarderas ca plus tard

@keen narwhal

[keen narwhal]

mais j'ai une erreur

[queen ocean]

laquelle ?

ha bah ca c'est ta gestion des commandes justement

ta suivit un tuto de base ?

[keen narwhal]

Oui

[queen ocean]

lequel ?

[keen narwhal]

J'ai fais jusqu'au handler de commande

Mais pourquoi ma toute première commande ou je mettez le role dans le code marcher et celui la non ?

[queen ocean]

Recommence les vidéos, ta du mal copier quelque chose

[keen narwhal]

Ah ouais ? Pourtant comme je te le disais certaine de mes commandes marcher

Bizarre

[queen ocean]

renvoie ton fichier de la commande 🤔

[keen narwhal]

j'ai re regarder tout le code de la vidéo tout est bon normalement

@queen ocean je déco si tu trouve dit le moi ^^

en tout cas merci

[grand kindle]

Salut, je viens de recommencer le JS (ça fait +de 4 ans donc autant vous dire que j'ai tout oublié), donc je recommence tout et j'ai du mal sur certaines notions. quelqu'un de qualifié peut-il me donner un coup de pouce ? 🥹

[keen narwhal]

@queen ocean Bonjour, aurais tu trouvez une solution ?

J'ai chercher des solution et je crois juste que le bot ne capte pas le rôle enfaîte

[queen ocean]

Non j'ai pas regardé, envoie un zip ou un git du dossier et je regarde ce soir si j'ai le temps

[keen narwhal]

Ok je te ferais sa ! Merci en tout cas de prendre de ton temps pour m'aider ahah

[keen narwhal]

@queen ocean Ducoup j'ai recommencer de zero le bot donc j'ai le fichier main.js le loadCommand.js et le addrole.js

main.js

loadCommand.js

La je pense que les bases sont propres enfin je crois , donc la ducoup je crée un addrole.js dans le dossier commands et utils

[floral bolt]

C’est quoi ton soucis enfaite ?

[buoyant compass]

que commands non ?

je t'aurai conseillé de prendre une base de bot déjà existante

mais surtout d'apprendre JS

[keen narwhal]

Oui c'est prévu sa ^^

[buoyant compass]

et pourquoi pas à lire une doc

ben tu aurais du prévoir avant de commencer...

C'est comme si jte faisais lire un roman alors que je t'ai pas appris à lire

[keen narwhal]

Oui enfin je voulais pas apprendre tout un langage juste pour faire deux trois commandes a la con sur un truc discord

Tu as une base de bot ou pas ducoup ?

[buoyant compass]

ben t'as appris à lire pour lire 2-3 livres à la con en français 😂

[buoyant compass]

github

[keen narwhal]

xDD

[buoyant compass]

pour faire ça github

et copies colle

mais crée pas sa sert à rien

ou BDFD

ou tu invites un bot déjà existant

[keen narwhal]

@buoyant compass Alors ducoup j'ai repris mon ancien bot d'hier j'ai tester la commande et sa marche

...

Je ne sais pas comment

mais sa marche mdrr

[buoyant compass]

ben je savais que mon truc marchait

sa fait longtemps j'ai pas fait de djs mais qd meme

[keen narwhal]

c'est avec ton truc et celui de @queen ocean

le combo à fonctionner

[buoyant compass]

ben oui

Maintenant @keen narwhal
=> https://developer.mozilla.org/fr/docs/Web/JavaScript

[keen narwhal]

Oui ^^

[buoyant compass]

https://grafikart.fr/formations/formation-javascript

si tu pref

[keen narwhal]

En tout cas merci de votre aide à vous deux

[buoyant compass]

de rien

[keen narwhal]

C'est quoi le mmieux apprendre en vidéo ou des sites ?

[buoyant compass]

moi jpref la doc

mais j'ai vu les vidéos

[autumn tendon]

Bonjour!
J'ai un problème avec mon bot je crois
J'aimerais que quand dans le menu choose_language, quand je choisit exit_lang, ça nous rammène à choose config, comment puis-je faire ?

Mon code :

const { ActionRowBuilder, StringSelectMenuBuilder, StringSelectMenuOptionBuilder, SlashCommandBuilder, EmbedBuilder } = require('discord.js');

module.exports = {
    data: new SlashCommandBuilder()
        .setName('configure')
        .setDescription(`Configure the bot to have a nice use!`),

    async execute(interaction) {
        const select_language = new StringSelectMenuBuilder()
            .setCustomId('choose_language')
            .setPlaceholder('Choose A Language!')
            .addOptions(
                new StringSelectMenuOptionBuilder()
                    .setLabel('Français')
                    .setDescription('Changer la langue du bot en français.')
                    .setEmoji('🇫🇷')
                    .setValue('french_lang'),
                new StringSelectMenuOptionBuilder()
                    .setLabel('English')
                    .setDescription('Change the bot language to english.')
                    .setEmoji('🇺🇸')
                    .setValue('english_lang'),
                new StringSelectMenuOptionBuilder()
                    .setLabel('Exit')
                    .setDescription('Return to the config menu.')
                    .setEmoji('◀️')
                    .setValue('exit_lang'),
            );

        const select_config = new StringSelectMenuBuilder()
            .setCustomId('choose_config')
            .setPlaceholder('Choose A Configuration Option')
            .addOptions(
                new StringSelectMenuOptionBuilder()
                    .setLabel('🏳️ - Languages Settings')
                    .setDescription('Language Configuration')
                    .setValue('config_flag')
            );
            
        const row_lang = new ActionRowBuilder()
            .addComponents(select_language);

        const row_config = new ActionRowBuilder()
            .addComponents(select_config);

        const configEmbed = new EmbedBuilder()
            .setColor("#00FF00")
            .setTitle("Configuration Panel")
            .setDescription(" ⚙️ - What do you want to configure?");

        const langEmbed = new EmbedBuilder()
            .setColor("#00FF00")
            .setTitle("🏳️ - Language Settings");

        await interaction.reply({ embeds: [configEmbed], components: [row_config], ephemeral: true });

        const filter = (interaction) => interaction.customId === 'choose_config';

        const collector = interaction.channel.createMessageComponentCollector({ filter, time: 15000 });

        collector.on('collect', async (interaction) => {
            if (interaction.values[0] === 'config_flag') {
                await interaction.update({ embeds: [langEmbed], components: [row_lang] });
            } else if (interaction.values[0] === 'exit_lang') {
                await interaction.update({ embeds: [configEmbed], components: [row_config] })
  .catch(console.error);

            }
        });
    }
}

(j'ai pas mis de comments sur cette comande déso )

[celest cliff]

Hello
J'ai un problème avec ErrorBoundary en react, dans mon code j'ai volontairement mis une variable qui n'existe pas dans un children de l'error boundary , mais le fallback ne s'affiche pas ..

import { ErrorBoundary } from "./components/ErrorBoundary"

function App() {


  return <div>
    <ErrorBoundary fallback={<p>Je suis une erreur</p>}>
      Lorem ipsum dolor sit amet consectetur adipisicing elit. Quo, consequuntur iure! Perferendis optio at voluptatem cum vitae nesciunt repudiandae neque, exercitationem nostrum maiores temporibus, eveniet explicabo sequi obcaecati beatae repellat.
      <button>{login}</button>
    </ErrorBoundary>
  </div>
}

export default App

en l'occurence le "je suis une erreur" ne s'affiche pas
merci d'avance

[buoyant compass]

ton login s'affiche ?

@celest cliff

[cursive sail]

@autumn tendon

Ton components bg

[autumn tendon]

hm??

Comment ça mes components

[autumn tendon]

ouais? ils ont quoi

[cursive sail]

Ah merde j'avais mal compris mdrr

Je pensais que tu voulais pas que ça te ramène à select_config

[autumn tendon]

ok ok