CODEWITHSUNDEEP
javascriptnode.jsreactjsdiscorddiscord.js
user9837619
user9837619

Reputation:

discordjs bot (Nodejs) how to add data to DOM with reactjs

I'm working on a simple React app which uses a discord Bot to handle some data.

the bot works like a charm, (https://discord.js.org/#/)

What I'm trying to figure out is how I can I take the data from the bot to show it on my React web page.

here's a portion of code for you to understand (123 being the default value):

<div className="dataDiscord">
   <span id="count" className="ncount"><DiscordBot count=" 123" /></span>
   <p>Members</p>
</div>

So the bot is online and the react fragment is supposed to return the total member count of the discord server,

client.on('ready', function () {
   var count=client.guilds.get(guildID).memberCount;
   console.log(count);
});

a console.log of count will return "9" as there are 9 people registered in the discord server, but I can't seem to access the data outside of this particular function to show it on my website...

I've tried several methods that always returned "undefined", so I'm stuck here for now, would be glad if someone could help me on this

Upvotes: 0

Views: 920

Answers (1)

Pierre Capo
Pierre Capo

Reputation: 1053

It seems that you are facing an issue with the concept of asynchronous code in JavaScript.

You got to know that the client has to collect the data from discord, and it takes some milisecond to do it. The issue is that most of the code outside of your function has run before you have received your entire data.

I can advice you to read this article first which is a great resource for understanding asynchron code in JavaScript :

Understanding Asynchronicity in JavaScript

Upvotes: 1

Related Questions