Is there a way to display custom discord stuff on a website?

I've recently started learning front-end web development (html, css, js) and as a learning project I started making a website for our friends group discord server using React. I wanted to have 3 things from our server.

1. I wanted to display the user with most minutes spent in a voice channel on the server

2. I wanted to display the user with most messages sent in any channel on the server

3. I wanted to display all online members with a particular role from the server

How would I go about this? Could it be done?

I've lightly touched what APIs are and am not really sure how I would implement something like this. I've tried looking at Discords developer documentation and its rather overwhelming.

Youtube and Google weren't much help or maybe I'm not sure what I should be looking for.

Also their own discord widget could maybe replace what I want with number 3, is the widget maybe customizable?

Any help, especially in a 'explain it to me like I'm 5' manner, is much appreciated.
Cheers!

For the specific statistics you need, there aren’t actually endpoints that provide this info! It is possible to get all the info you need, but it’ll be a long process to get it.

1:
I don’t believe discord keeps logs of how much time a user has spent in a voice channel. To monitor this, you would probably need to set up a bot and have it constantly run.

2: Again, there isn’t an API endpoint that monitors this. You could fetch messages individually from each channel, but this is very API intensive (and will probably get stopped by a rate limit of some sort).

3: Hooray! Finally something we can use! Using the HTTP endpoint List Guild Members which contains an array of people in your server. Each member has a roles object, which you can interate through to get the role. You’ll need to register an application at https://discord.com/developers/applications and follow the Getting Started docs tutorial to get ready for using the API. Best of luck!