Now that we’re ready to start figuring out how we’re going to get some data, we gotta think about how that works.
In Eleventy, data is merged from multiple different sources before the template is rendered. The data is merged in what Eleventy calls the Data Cascade.
Without diving too deep ( don’t worry Ben has you covered with this article to explore more in depth) there are 6 types of data in the cascade as of 1.0 (highest priority to lowest):
Specifically though we’re going to be focusing on fetching data from Discord from a javascript function in a global data file
that we’ll create.
Inside of src/_data
we’ll create a new file named events.js
. Using our environment variables DISCORD_BOT_TOKEN
& DISCORD_GUILD_ID
we can make a fetch to our events endpoint, grab our events, and inject them into our templates.
Our file will look like this:
// src/_data/events.js
const fetch = require('node-fetch');
require("dotenv").config();
module.exports = async function () {
const res = await fetch(`https://discord.com/api/v9/guilds/${process.env.DISCORD_GUILD_ID}/scheduled-events`, {
method: "GET",
headers: {
"Authorization": `Bot ${process.env.DISCORD_BOT_TOKEN}`,
}
})
const data = await res.json()
console.log({data});
return data
}
If all was successful, and you have an event created inside of your server, we should be seeing an object containing the event data.