Node.js is a platform built on Chrome's JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices.

Node.js

discord.js

You'll be learning about collectors, sending custom messages, creating channels and roles, all dynamically. All of the different topics I cover in this course will be a guide for you to use each of these concepts individually so I highly encourage you to take what you learn to build something new and tell me what you build! 

I'll cover how to setup your bot in the discord developer portal then we'll set it up locally. I'll go over how to create a simple chat bot then go into much more detail on how to create slash commands. There is a break on lesson 5 where I'll go over some files that I've copy over from the Discord.js guide. There will be a template you can clone if you don't want to copy the files over yourself but I'll be running through each of them individually so you can understand what's going on.

The Discord.js guide is a super helpful resource when you need more information on specific topics you're struggling with. Discord.js also has a massive Discord channel that's a great place to ask questions that you just can't figure out yourself. The last resource is the Discord status page to check for things like api outages and other issues on Discord's side. All three of these resources will be linked down in the description. 

With that said, thank you for taking my course and let's get to it. 

Resources: 
- Discord.js Guide
    - [https://discordjs.guide/](https://discordjs.guide/)
- Discord Channel
    - [https://discord.com/invite/djs](https://discord.com/invite/djs)
- Discord Status Page
    - [https://discordstatus.com/](https://discordstatus.com/)

discord

Introduction to Build a Book Club Bot with Discord.js

In this lesson, you'll learn how to create and configure a Discord bot.

You will see how to create the bot, select the options you will need, give it the correct amount of permissions, and add it to your server.

Here is the link to the Discord Developer Portal: [https://discord.com/developers/applications](https://discord.com/developers/applications)

Create and Configure a Bot using the Discord Developer Portal

Now that we've set up a bot on our Discord server, let's write some code to get it do some fun stuff.

We're going to set up a new project and use the `Discord.js` library. While setting up this project you'll learn how to properly configure the client and log in to your bot by passing a Discord API token to `client.login`.

Once the project is set up we'll send our first event using the `client.once` and event, and set up some scripts so that we can start the bot using yarn.

Throughout the lesson, you will be introduced to important concepts and best practices for building Discord bots. By the end of the lesson, you will have a basic understanding of how to create a simple bot and be ready to continue building

Send your first Discord.js Bot Event 

Using the Discord.js library, we're going to send our first message command! 

Let's create a classic "hello world" message command and learn how to create a new client instance, enable the necessary gateway intents, listen for specific events, and respond to those events by accessing a "message object" and then sending a message back.

Create your first Discord.js Bot Message Command

In this lesson, you will be setting up the necessary files for your first Discord.js slash command. The goal of this lesson is to give you a solid foundation to build upon as you create your own custom commands for Discord.

We will be importing and using `fs` and `path` to read from the command and events directories, using `Collection` from Discord to store and retrieve your commands, and creating the `Client` using the `GatewayIntentBits. 

Also, we are going to deploy your commands and set up events to execute them properly once they're written.

Setup for Discord.js Slash Commands

Now that our files are set up, we can now write our first Discord.js slash command.

By create custom commands, we extend the functionality of our Discord bot and can make it much more fun and interesting. 

We'll start by creating a new file in the commands folder, importing the slash command builder, and defining the data and execute sections of the command. We'll then register the command and test it in the Discord application.

By the end of this lesson, you'll have a solid understanding of how to create custom slash commands in Discord.js. So get ready to dive in and start building!

Create Your First Discord.js Slash Command

In this lesson, you will learn how to build custom commands that can receive user input.

As a Discord user, you may have noticed that many servers use custom commands to provide information, moderate the chat, or enhance the overall user experience. By learning how to build these custom commands, you'll be able to create a more interactive and dynamic Discord server for your community!

We'll start by introducing the basics of slash commands and how they can be used in a Discord app. You'll then learn how to create a simple command that sends a response back to the user who triggered the command. 

We'll also cover how to make your commands more dynamic by adding arguments.

By the end of the lesson, you'll understand how to receive and respond to input from users and be able to build more sophisticated bots that can interact with your users in meaningful ways.

Receive and Respond to Input From Users with Discord.js Slash Commands

Let's convert our Discord bot to respond with embedded messages.

Embedded messages in Discord are a great way to make your bot's responses look a lot more visually appealing!

We'll create a new command called `/bookclub` that will take in a book title, an author, and the number of hours until the submission deadline from the user. Then, it will `reply` with an object that Discord will automatically convert into an embedded message.

Have a Discord Bot Respond with Embedded Messages

In this lesson, you will be learning how to display relative time in a Discord embedded message using the Unix timestamp. 

We'll be adding a countdown timer to an embedded message to show the time remaining until submissions to a book-club close.

By the end of this lesson, you will have the ability to convert hours into seconds, add it to the current time in the Unix timestamp, and create a variable to store the wait time in seconds to display the short date time and relative time in Discord.

Display Relative Time in a Discord Embedded Message

In this lesson, you will learn how to create custom buttons in Discord.js using `ActionRowBuilder` and `ButtonBuilder`. You will also learn how to style and add text to the button using `ButtonStyle` and the `setEmoji` method.

We'll need to make these buttons for our book-club message to give users the ability to let us know that they want to be a part of the club. 

`ActionRowBuilder` and `ButtonBuilder` are important, here's what they do:

`ActionRowBuilder` is used to create a row of buttons or other action components in a Discord message. This class provides methods for adding buttons, text, and other components to the row, as well as methods for formatting the row.

`ButtonBuilder` is used to create individual buttons within the `ActionRowBuilder`. This class provides methods for setting the text, emoji, style, and other properties of the button.

By using them both, we are able to create a row of buttons exactly how we want them to look!

Create Custom Discord Buttons with ActionRowBuilder and ButtonBuilder

Let's now learn how to create dynamic channels and roles with our Discord bot.

We want to be able to create new roles and channels for the book clubs and their attendants that we create in our server.

We'll be using methods from the `interaction` object to create the role and channel. And, we'll make sure to create both the role and channel each with the correct permissions.

Create Dynamic Channels and Roles with a Discord Bot

Now, let's learn how to add roles to users in a Discord server using a Discord.js collector.

By the end of this lesson, you will be able to create a collector to gather users who click on a specific button, filter out users who do not have a certain role, and add a specific role to the users who meet the filter criteria.

Add Roles to Users using a Discord.js Collector

Disabling buttons can be useful in Discord servers to prevent users from clicking on buttons that are no longer relevant. By disabling a button, you can inform users why the button is no longer clickable and avoid confusion or frustration.

By the end of this lesson, you will be able to create a button that will disable itself when a submissions for a book-club have closed.

Conditionally Disable a Custom Discord Button

The final step we need to take is to deploy our Discord bot to production. We'll be using using GitHub and Railway.app. 

[Railway.app](https://railway.app/) is a deployment platform that allows us to deploy our bot to the cloud. They give you $5 or 500 hours of free usage per month, which probably won't last you the full month, but it's a great way to get started.

Deploy a Discord.js Bot for Production

Learn what a productive developer workflow looks like when building out a Node.js CLI.

Get Started Building CLI Tools with Node.js

In this course, you will learn how to initialize Prisma in a TypeScript Node project, use Prisma Client to create and find records, use Express to create data dynamically, and more

Build a Backend with Prisma in a TypeScript Node Project

Build a blazing fast chat app with Remix and Supabase! This course covers everything you need, from database hosting to authentication and authorization, all with real-time updates

Build a Realtime Chat App with Remix and Supabase

node

Build a Book Club Bot with Discord.js

https://app.egghead.io/api/v1/lessons/discord-introduction-to-build-a-book-club-bot-with-discord-js/subtitles

Lucas: [0:00] Hello. My name is Lucas, and welcome to my course on how to build a Book Club bot using discord.js v14. You will be learning about collectors, sending custom messages, creating channels and roles, all dynamically.

[0:15] All of the different topics I cover in this course will be a guide for you to use each of these concepts individually. I highly encourage you to take what you learn to build something new and tell me what you build.

[0:26] I'll cover how to set up your bot in the Discord developer portal, then we'll set it up locally. I'll go over how to create a simple chatbot, then go into much more detail on how to create slash commands. There is a break on lesson five where I will go over some files that I've copied over from the discord.js guide.

[0:43] There'll be a template that you can clone if you don't want to copy the files over yourself, but I'll be running through each of them individually, so you can understand what's going on. The discord.js guide is a super helpful resource when you need more information on specific topics you're struggling with.

[0:59] Discord.js also has a massive Discord channel that's a great place to ask questions that you just can't figure out yourself. The last resource is the Discord status page to check for things like API outages and other issues on Discord's side. All three of these resources will be linked down in the description. With that said, thank you for taking my course. Let's get to it.

https://app.egghead.io/api/v1/lessons/discord-introduction-to-build-a-book-club-bot-with-discord-js/transcript

https://app.egghead.io/api/v1/lessons/discord-create-and-configure-a-bot-using-the-discord-developer-portal/subtitles

Instructor: [0:01] Navigate to discord.com/developers/applications and click new application. We're going to name our bot. We'll do the best book club bot, accept, then create.

[0:13] It's going to take you to this general information page, which you can fill out if you want to. For our course, it's not really necessary. We're going to go over here on the left and click on bot and add a bot. Yes, do it.

[0:30] Fill my two-factor authentication. Once you've done that, you will see it has generated this page for you. You scroll down, you can see authorization flow. You can see privilege gateway intents.

[0:42] You're not going to need to worry about this unless your bot reaches 100 or more servers. We won't cover that. Next, we need to add our bot to our server. On the left, click OAuth2 URL Generator, select bot.

[1:01] Then now, we need to select the permissions for our bot. We're going to select manage roles, manage channels, read messages, view channels, manage events, and moderate members.

[1:17] Over in our second column, we need to be able to send messages. We're not going to worry about threads or text to speech. We need to be able to manage messages, send embedded links, add reactions, and use slash commands.

[1:35] Now, at the very bottom, it will give you this link. We'll copy this link, come over here, paste that into our search bar at the top, hit enter. Down here, we'll select a server. I'm going to select my personal server, click continue, authorize. I am human.

[1:58] Now, it should be added to your server. Going over to our personal server, you can see right down here the best book club bot just landed. It was added to our server.

https://app.egghead.io/api/v1/lessons/discord-create-and-configure-a-bot-using-the-discord-developer-portal/transcript

https://app.egghead.io/api/v1/lessons/discord-send-your-first-discord-js-bot-event/subtitles

Instructor: [0:00] Now that we've added our bot to our discord server and it's fully configured, we need to add some code to it to make it do some fun stuff. Let's go ahead and make our directory.

[0:12] We'll name it egghead discord bot course, CD into that. Now we're going to run it yarn init -y to go ahead and auto-answer all of the defaults.

[0:33] Go ahead and open it up in VS Code. Let's go ahead and open up our terminal again, and we're going to add in our dependencies. What we're going to add is discord.js.env for environmental variables and nodemon for our development testing.

[1:04] Perfect. Now, let's create a main file where we're going to do our initial stuff, main.js.

[1:15] In here, we're going to import a couple of things from discord.js, const Client, Events, and GatewayIntentBits. We're also going to require our .env. Perfect. Now that that's configured, let's create our client, const client = new Client, intents.

[2:03] This is where we're going to select what permissions we're going to have for our initial commands. First of all, we're going to do, GatewayIntentBits.Guilds.

[2:23] Now that that is set up, we're going to log in as a bot. That will be client.login, and then we're going to need our TOKEN. If we go back over to the developer portal, go over to the bot, hit Reset TOKEN. Yes, we want our TOKEN.

[2:46] Enter your two-factor authentication if you still have it, and that will display your TOKEN. We're going to copy our TOKEN, head back over here. We're going to open up .env file, and we're going to set this to TOKEN, paste in our TOKEN. Head back over to our main file, and we'll add that in here, Process.Env.TOKEN.

[3:19] With all that set up, let's go ahead and send our first event, client.once -- since we always send this once right when we log in, or startup our bot -- Events.ClientReady, c, console.log, Ready! Logged in as, c.user.tag. Let's head over to our package.json file. We're going to add in some scripts.

[4:04] First one is going to be our "start", "node main.js". The second one is going to be our dev. That is going to be using node one, main.js.

[4:20] With all that setup, let's go and start our bot, yarn dev. There we go. Ready! Logged in as the best book club bot.

https://app.egghead.io/api/v1/lessons/discord-send-your-first-discord-js-bot-event/transcript

https://app.egghead.io/api/v1/lessons/discord-create-your-first-discord-js-bot-message-command/subtitles

Instructor: [0:00] Let's go ahead and create a simple message command. First thing's first, we're going to need a couple more gateway intent bits, the first one being MessageContent. The second one is GuildMessages.

[0:29] Down below our event, we're going to create a new client, client on. The difference between once and on is once will only run once. The on means that it is able to be used at any point while our bot is running.

[0:52] This is going to be messageCreate. Message, turn this into a function.

[1:04] Then, if the message.content is equal to $hello, we want to reply to that message with 'world!. One last thing before we set that up, we head back over to our developer portal, over to bot, scroll down to our MessageContent intents.

[1:35] We need to turn this on if we're going to be sending messages this way. Hit save, head back over, save again. Now, if we head back over to our bot and we type $hello, our bot replies with 'world!.

https://app.egghead.io/api/v1/lessons/discord-create-your-first-discord-js-bot-message-command/transcript

https://app.egghead.io/api/v1/lessons/node-js-setup-for-discord-js-slash-commands/subtitles

Instructor: [0:00] This lesson is going to be a bit of a jump from our previous lesson, mainly because I want this course to be focused solely on Discord.js and not all the node that we're throwing in here.

[0:13] We've added in a couple more files and folders, a commands folder, an events folder with a couple of files. We've edited our main JS file. We've added in a deploy commands file.

[0:28] These files are given to us courtesy of the Discord.js guide. I will have that link down below. You'll be able to go there to get even more information. They go really in-depth to do a great job of describing what's going on here, but I'm just going to quickly run through it for this course.

[0:45] If you don't want to have to add all these files yourself, I have a GitHub repo template that will be linked down below that you can just clone and it'll get you right up to speed.

[0:55] We're going to import FS and PATH for reading our command and events directory, and allowing us access to those files and directories. We're going to import collection from Discord, which will be used for storing and retrieving our commands. For creating our client, we are just using the guilds, GatewayIntentBits.

[1:15] Down here, we've attached a commands property to our client to be able to access our commands and other files. This next section here is strictly just for our commands. We're using path to get access to our commands directory, and then we're using FS to filter through each file in our commands directory for every file that ends with JS.

[1:41] Then, we're throwing that through a for loop. For each file in that commands directory, we're going to path to that file, require that path. Then, if there is a data property and execute method in that command, we're going to go ahead and set that command name for each of the commands.

[2:01] Otherwise, we're going to throw this error. Down here, this is going to be for each of our events, like our ready event in the previous lesson. This is almost an exact duplicate of what we did for commands, but I'm, again, going to quickly run through it.

[2:16] We're going to get our events directory, filter through each file that ends with JavaScript for our events directory. Then, each of those files in our events directory, we're going to path to it, require that path.

[2:30] If it is an event that is ran once, we're going to take the name of that event and the rest of our arguments, call execute on our event, while passing in the spread of our arguments.

[2:44] Then, we're going to do the exact same thing for events that are constantly running, not just ran once. Then, lastly, log in as our bot. In our env file, we're going to add in a couple more environmental variables, our client ID, and our guild ID.

[3:02] Our client ID is going to be this application ID right here, offering general information. You can click copy, and paste that in. Then, we have our guild ID, which will be our server ID.

[3:13] If you have the developer mode toggled on in your Discord application, right click on your server, copy ID, and then paste that in here. Now, let's move to the deploy commands file. Again, another file given to us by the Discord.js Guide.

[3:29] We're going to import rest under routes from Discord, require and configure our .env file. We're going to use FS for reading our commands directory, create a commands array.

[3:41] We're going to grab all the command files in the commands directory, filter through that for each file that ends with JS. Then, we're going to grab the slash command builder, the JSON output of that, for each of our commands data for deployment.

[3:56] Then, we're going to construct and prepare an instance of the rest module, and then deploy our commands. In this async function, we're going to add in a try catch, quickly just log out. How many commands we're going to be refreshing?

[4:12] Then, use a put method to fully refresh all the commands in the Guild with the current set. Then, if successful, log that out. Otherwise, console.log your error. Then, over in our events folder, we're going to look at the ready.js file. Import events from Discord.js.

[4:38] We're going to set the name to be ClientReady. This is only going to be ran once. Then, we're going to execute that event by just console logging that we are logged in.

[4:51] Then, we're going to head over to InteractionCreate. This is what is going to help us create our commands. We're going to import events from Discord. The name is going to be Events.InteractionCreate.

[5:05] Then, in our execute method, if the interaction is not a chat input command, just go ahead and return. If it is, get the name of that command.

[5:17] In this if there is no command, go ahead and console.log that, and then return. Otherwise, if there was a command, go ahead and execute that command or console.log out an error. Now, in the next lesson, let's go ahead and build our first command.

https://app.egghead.io/api/v1/lessons/node-js-setup-for-discord-js-slash-commands/transcript

https://app.egghead.io/api/v1/lessons/discord-create-your-first-discord-js-slash-command/subtitles

[0:00] Instructor: To create our first slash command, go up into the commands folder. Create a new file called ping.js, and we're going to import slash command builder. Export that. Then our slash command needs a minimum of two things, data and execute.

[0:23] Inside of data, we're going to create a new slash command builder, and our data needs a minimum of two things. A name, which we will name it "ping," and a description, which we'll just say, replies with "pong."

[0:48] Add our comma. Then, inside of our execute, we're going to pass an interaction and then we're going to reply to that interaction with pong.

[1:05] Go and save that. Open up our terminal. Now, we need to register that command. We're going to run node deploy commands.js, hit enter, and we should see successfully reloaded one application/commands. Start our bot in development, yarn dev.

[1:27] Head over to your Discord application, type /ping. Here is a really interesting thing about slash commands. You can have multiple bots with the same name for a command.

[1:45] On the right here, you can see which bot will run the command. We want to choose the second one since that's the bot that we're running through in this course. Click on that and hit enter. Replies with pong.

https://app.egghead.io/api/v1/lessons/discord-create-your-first-discord-js-slash-command/transcript

https://app.egghead.io/api/v1/lessons/discord-receive-and-respond-to-input-from-users-with-discord-js-slash-commands/subtitles

Instructor: [0:00] Let's get started on our Book-Club Command. In commands, create a new file called bookclub.js, and I'm going to go ahead and paste in the bare bones of our slash command. We're going to set the name to be, Book Club. The description will be, creates a new book club.

[0:20] We want our users to be able to give us input, and for us to be able to do something with that input, such as the title of a book. We're going to give our users the option to input a string. We're going to add string option. This will be a function where we are going to set the name of this option to be, Book.

[0:46] Set the description to be the book, the book club is on. Then down in our Execute, we're going to create a variable called Const Book.

[1:00] Set that to interaction.options.getString. Now this getString, the value, will be what we set the name of our string option up here. It's going to be, Book. Then with that, let's go ahead and reply to that. So interaction.reply.

[1:21] The title of the book is Book. We'll save that, open up our terminal, and now that we've created a new slash command, we're going to need to re-register all of our commands. Node deploy-commands.js, and then let's start our bot and development, yarn dev.

[1:42] Head over to our Discord application, type out book, and then you can see we have our new Book-Club Command. Hit enter, select book, testing.

[1:58] Enter, the title of the book is testing. Let's add in a couple more fields. One for how many people we want, and then another one for when we want the submissions to close. We'll add integer option. This will be another function.

[2:25] Here, we're going to set the name to be, People. Set the description to be how many people you want for the club. Then, our other one will also be an integer option, add integer option, create another function, set the name to be hours, set the description to be, when in hours, you want submissions closed.

[3:12] Down in our Execute, we're going to create two more variables. "Num of people", which will be set to interaction.options.getInteger this time, and that will be people. Then, Const hours=interaction.options.getInteger, and this one will be hours.

[3:47] Last thing we'll add in is author so people know who is wanting to run the book club. We'll create a variable called author, set that to interaction.member.user.username. This is the person who launched the Command.

[4:10] In our interaction reply, I'm just going to paste in a string here. The author is looking for these many people to run a book club on the book, "Book - Submissions end in blank hours."

[4:24] Whenever we are editing our data field, we're going to need to re-register our commands. We'll stop the bot, run our node deploy-commands.js, successfully reloaded, start up our bot development again, head over to our Discord/Application/Book-club, and you can see we have three options available to us.

[4:58] Book, testing, I'm going to hit tab, select people, I want three people, select hours in three hours, hit enter. Mentor hero is looking for three people to run a book club on the book, testing submissions end in three hours.

[5:16] The last thing we want to add in is we don't want people to accidentally skip something. Discord gives us one other field we can add, which is set required true. This way, this option cannot be skipped. We'll go and add that to our other options as well.

[5:41] Re-register our Command, restart our server, restart our bot in development, head back over, type slash, and now you can see instead of it just saying three options, it gives us the three options that we need.

[6:03] If I go ahead and hit enter without filling anything in, it pops up with this option is required, specify a value, testing, and people, it's also expecting an integer. If I type out a string and hit enter, it's going to ask for a valid integer.

[6:22] Three people in three hours, hit enter. Our Command is working as expected.

https://app.egghead.io/api/v1/lessons/discord-receive-and-respond-to-input-from-users-with-discord-js-slash-commands/transcript

https://app.egghead.io/api/v1/lessons/discord-have-a-discord-bot-respond-with-embedded-messages/subtitles

Man 1: [0:00] To create an embedded message, let's create an object with the name of embed message.

[0:09] In here, we're going to add a few things. First thing will be our title with book. We're going to add in an author. That's going to be an object with the name of our author. We're going to add in a description of running a book club on the book, and our variable book.

[0:39] The last thing we'll add in is fields. Fields is going to be an array of a couple of objects. These objects needs a minimum of two things, a name and a value. The name for this one will be amount of people wanted, and the value will be our variable, num of people. Then we're going to add in another object for our hours.

[1:14] Name submissions, close in, hours. The value will be time runs out in our variable hours and hours. Perfect. Now, to send that embedded message, we need to reply to our interaction. Inside the parentheses, we need this to be an object with the key of embeds. The value for that will be our object, embed message.

[1:57] We'll come up here, remove our first message, save, open up our terminal, start our bot. Then we'll head over to discord and run our command. Testing, three people in three hours. Hit enter. There we go. A much nicer message than what we were seeing before.

[2:24] You can see we've got the title, we've got our author. Then we've got our description, running a book club on the book testing. The amount of people wanted were three and submissions close in three. Time runs out in three hours.

[2:41] The last thing I want to add is we could have multiple book clubs running on the same book. To differentiate between the two of those, we'll add in the date to our book, and that'll be added into the title.

[2:58] We'll create a new variable called book club. That equal to a string of book plus book club plus and then we'll do new date for today's date. We'll set that to date string. Come down here to our title, replace that with book club. Save.

[3:28] Our bot is refreshed. Come back over here, run our command again. You can see it's been updated with our new title.

https://app.egghead.io/api/v1/lessons/discord-have-a-discord-bot-respond-with-embedded-messages/transcript

https://app.egghead.io/api/v1/lessons/discord-display-relative-time-in-a-discord-embedded-message/subtitles

[0:00] Instructor: Our message is looking much nicer, but there's one thing I want to do to it. Down here in our submissions, this hours variable is hard-coded. That means our users are going to have to figure out the exact time it ends themselves and it's not going to be immediately apparent.

[0:21] We can display the relative time to our users using the Unix timestamp. Discord has a couple of different ways that we can show the time to our users. I'm going to be using the short date time and the relative time. The short date will be in our name, just to show the exact time that it ends.

[0:41] Then the relative time will be our countdown timer for when the submissions close. The first thing we need to do is convert our hours into seconds by multiplying our hours by 3,600 and set that to a variable. Set that equal to hours times 3,600.

[1:06] Now, we need to add that to the current time in the Unix timestamp to get when submissions will be closed. We'll create a variable called time expires at, set that to new dates, get the time, divide that by 1,000.

[1:29] Now, we need this to be a round number. Put that in parentheses and do math.floor. Then add on our wait time in seconds. Now, down in our fields, we can place this hours with time expires at, we'll add in the Syntax for the short date time.

[1:49] We'll delete hours because that won't be necessary anymore. We'll also delete in because that also won't be necessary. We'll add in the Syntax for the relative time. It's saved, head back over to Discord, run our Command again.

[2:15] Hit enter. There you go, you can see the short time and date. You can also see the relative time down here. Now, I'll wait a minute so that you can see that it actually is the relative time counting down. Now, you can see, time runs out in 59 minutes.

https://app.egghead.io/api/v1/lessons/discord-display-relative-time-in-a-discord-embedded-message/transcript

https://app.egghead.io/api/v1/lessons/discord-create-custom-discord-buttons-with-actionrowbuilder-and-buttonbuilder/subtitles

Instructor: [0:00] Now we need a way for our users to respond to our message to let us know that they want to be a part of the book club. To do that, we're going to use a custom button. To be able to create a custom button, first thing we're going to need to do is add in a couple of imports.

[0:19] Action row builder, button builder, and button style for just a little bit of styling. Come down right below our message, and then we'll create a new action row builder. Set that to a variable called row. On top of that, we're going to add some components.

[0:50] Inside here, we're going to create a new button builder. Here's where we add styling and text to our button. We'll set a custom ID, set that to primary. Then we'll add a style, set style. This will be buttonstyle.primary. Currently, there are five different button styles available.

[1:19] Primary, secondary for gray, a success would be green, danger would be red, and then link would also be gray, but give you an option to click on it to bring you somewhere else. Then we're going to add in an emoji, set emoji. I'm going to do the thumbs-up emoji.

[1:38] Now if you didn't want to use an emoji, you can do text with set label instead of set emoji, but for fun, we'll just use an emoji. Then down in our reply, we'll add in our row. This will be components and the value for that will be our button. We'll save, and then head back to Discord.

[2:03] Do our command again. Hit enter. Now, we can see our button. Obviously, this button doesn't do anything right now but we'll get into that later.

https://app.egghead.io/api/v1/lessons/discord-create-custom-discord-buttons-with-actionrowbuilder-and-buttonbuilder/transcript

https://app.egghead.io/api/v1/lessons/discord-create-dynamic-channels-and-roles-with-a-discord-bot/subtitles

Instructor: [0:01] We'll start off by creating our role, which will be interaction.guild.roles.create. This will be an object. First thing we'll add in is our name for the role, which will be Book Club. Then we need to add in the permissions for that role. This will be an object. First thing will be permissions bitfield. Make sure to import that.

[0:35] On here we'll add Flags.ViewChannel, since we want our users to be able to view channels. Then we need them to be able to send messages. With that created, let's now create our channel, interaction.guild.channels.create.

[0:58] Again, the first thing we'll add in is the name. This will be Book Club, just like before. We'll add in the type. Now, this will be the type of channel. We want this to be a text channel, so channel type, 'GUILD_TEXT'. Make sure to import channel type as well. Then below that, we need to set the permissions.

[1:26] Now, currently, when we create this channel, anyone's going to have access. We only want people in our Book Club to have access to this. We'll first overwrite the permissions, Overwrites. This will be an array of objects. The first object, we want the ID of everybody in our guild, so interaction.guild.id.

[1:55] We want to deny them from being able to view the channel, Flags.ViewChannel. Then, for our second object, we want the ID of our Book Club role. We'll do bookClubRoleId, which, we'll create that variable in just a second, and allow them to be able to send messages and view this channel.

[2:30] All right. Now, let's create that Book Club role ID, const bookClubRoleId. This will be set to interaction.guild.roles.cache.find. This will be a function where we're trying to find the role where the name is equal to Book Club and get the id of that. Now we'll save.

[2:58] If we run this as is, we're going to get an error most of the time. That is because, if you remember a couple of lessons ago, I talked about how Discord.js is promise based. Back up in our Execute, we want to add async. Then we're going to add await to our role creation, await for getting our ID, and await for channel creation.

[3:29] Let's go ahead and save that and head over to the Discord application, where we will run our command again. Testing, one, two, three, with three people and one hours, hit enter.

[3:43] You can see we've created our channel. Click on that. You can see we also have our role created and added to our channel. Then over on the right, you can see which members have been added to this channel.

[3:57] Currently, it's myself and a couple of our other bots that are selected as admins. To prove to you that nobody else can see this, I have another account open right here. I don't see that channel here at all.

https://app.egghead.io/api/v1/lessons/discord-create-dynamic-channels-and-roles-with-a-discord-bot/transcript

https://app.egghead.io/api/v1/lessons/discord-add-roles-to-users-using-a-discord-js-collector/subtitles

Instructor: [0:00] To add our roles to our users, we're going to use a collector. To do that, let's create a variable called Collector. That's going to be set to our finished embed message. We're going to add our Collector onto this message. Let's turn it into a variable-const-finished embed message = interaction.

[0:27] We need to make sure to await this or else it won't work. We will add our create message Component Collector. The reason we're using this specific Collector is because we are using a button, which is our component, as our method of collecting our users.

[0:48] In this Collector, we're going to add three things -- a filter, a max, which will be our number of people, and time, which will be when our Component Collector is finished. This time will be in milliseconds.

[1:06] Wait time in milliseconds. Make sure you spell correctly. Then, let's go and create that first. Wait time in milliseconds, which will be our wait time in seconds times 1,000. Now let's create that filter. Filter will be a function. Inside this function, we need to check if our users have the book club role ID or not.

[1:39] We'll return interaction.guild.members.cache.get(userid). Then check to see if they have the book club role ID. If they don't, that's when we want to return. Then we'll be able to continue on with our Collector.

[2:12] Now let's go ahead and turn our Collector on using Collect. Here, there are two different values we could be adding, it's Collector End. Collect will turn our Collector on, and End will finish our Collector. Turn this into a function. Inside here is where we're going to add the role to our users.

[2:37] First, let's get the ID of our user, and set it to a variable, interaction.guild.members.cache.get(userid). Then with that ID, we can add that book club role using the book club role ID. That's done, but we want to send a message to make sure our users know that they were added to the book club. We'll send a simple reply.

[3:22] Inside this, we'll do i.user.username so that user is printed out, has been added to the book club. Perfect. Now let's turn off our Collector, Collector End. In here, we'll go ahead and console.log.

[3:51] Now let's go and run our command again. Testing, enter, created the channel. You look at my user, you can see I don't have the role added. Thumbs up, Mentor here has been added to the book club. Let's check, I have it. Now let's check on our other user who's not an admin.

[4:18] You can see that the other user was added. We don't see the channel up here, but if we hit the thumbs up, Lucas Mentor has been added to the Book Club. Now I can see this, and I can type.

https://app.egghead.io/api/v1/lessons/discord-add-roles-to-users-using-a-discord-js-collector/transcript

https://app.egghead.io/api/v1/lessons/discord-conditionally-disable-a-custom-discord-button/subtitles

Instructor: [0:00] Everything is currently running as expected. The last thing is if a user clicks this button again, we get left in this loading state and then we finally get this interaction failed. Let's update this a little bit to show that our user has already been added to our book club.

[0:21] Instead of our filter, let's go ahead and take this ID and set it to a variable. We'll call it hasBookClubRoll. Then if the user has the book club roll, we'll reply with, "You've already been added to the book club." Otherwise, return, the user does not have the BookClubRoll. Now, let's go and save this, and give it a shot.

[1:14] No Discord app, let's run our command again. Testing, two, three, four. Three people in three hours. Hit Enter. Here we go. Give it a Thumbs Up, we were added. Let's hit it again. You've already been added to the book club.

[1:31] Quick side note, people can use this to spam your Discord. We don't want people to be able to do this. Inside here, turn this into an object. Content is equal to that. Then, at the end, we can add Ephemeral is True. Now, we do this one more time, we hit Thumbs Up.

[2:11] Now, if we hit Thumbs Up again, we get a private message, you've already been added to the book club. Now, let's check on our other account. We don't see that extra message. We can click this as many times as we want.

[2:29] The last thing is, we want this button to not be able to be clicked once our submissions have closed. To do that, we can create a new button. Let's do that right underneath our Filter. We'll create a new button called Disabled Button. We'll create this basically the exact same way we did with the previous button.

[2:54] We'll set the CustomId to primary, set the style to be ButtonStyle.Primary. Then here, we're going to set a label saying Submissions Closed. And here, we can set Disabled to True. Now, with this button, we can head down into our collector. We can edit our reply.

[3:51] We want our embedded message to be the exact same as it was. Embed message. Our component is going to be our Disabled Button. Now, let's save this. Head back to our Discord application. Run our command one last time.

[4:18] Let's do "two people ends in two hours". Hit enter. I can hit the Thumbs Up here. Let's head over to our other account, and hit Thumbs Up over here. Now, we get our new button that will not let us click on it, and it lets us know why these submissions are closed.

[4:43] If we check our console.log here, we can see Collected Object Map. If we check our console.log here, we can see Collection Object Map. Let's fix that really fast to be Size. Then, let's go ahead and run it one last time, just to double-check.

[5:10] With that, our bot is finished.

https://app.egghead.io/api/v1/lessons/discord-conditionally-disable-a-custom-discord-button/transcript

https://app.egghead.io/api/v1/lessons/discord-deploy-a-discord-js-bot-for-production/subtitles

Instructor: [0:01] Now that our bot is finished, let's deploy it. Over on GitHub, we're going to create a new repository. Paste the name of our book called bot. This will be public. Won't worry about anything else. Create repository.

[0:20] I'm going to go ahead and copy this, head back to our terminal, paste in that, hit enter. Let's do a Git status. We can see we have some files that we don't want to be committed.

[0:41] Let's create a new file called .gitignore. We want to ignore our .env, .vscode, and our node modules. Lastly, our yarn.lock. Save that, get status again, and you can see those files aren't there anymore.

[1:07] Go ahead and add all of them, git commit -m finished bot, and let's go ahead and push. After a quick refresh, we can see that our bot is here, and all of the files are there.

[1:27] Let's head over to railway.app to deploy our bot. This is an app I've used multiple times for deploying bots. It's fairly simple to set up. You'll create an account. We'll head over to Start a New Project, Deploy from GitHub.

[1:47] If you don't have an account, or you just created one, you're going to need to configure your GitHub application so that it has access to your repository. We'll do the-best-book-club-bot, hit enter.

[1:59] Then, we're going to need to add in a couple of variables. These variables are going to be what we put in our env file. The first thing we're going to need is the token. Paste that in, add. We're going to need our client ID.

[2:19] The last thing will be our Guild ID. Now, if we head over to our deployments, we'll see that it's already deployed for us after we added our environmental variables.

[2:37] We'll click on this, and we can see we're logged in. We'll head over to our Discord application. We can see it's still running. Let's give it one quick test, hit enter. Everything is running as expected.

[2:58] One last thing about the Railway app is it does have a starter plan for you. It gives you a lot of free hours that restart each month, but it will not last you the entire month.

[3:09] If you don't want to end up paying, you can use somewhere else, but I personally like to use the Railway app.

https://app.egghead.io/api/v1/lessons/discord-deploy-a-discord-js-bot-for-production/transcript

Build a Book Club Bot with Discord.js

Lucas Minter

You might also like these resources:

Get Started Building CLI Tools with Node.js

Build a Backend with Prisma in a TypeScript Node Project

Build a Realtime Chat App with Remix and Supabase

Course Content

You might also like these resources:

Get Started Building CLI Tools with Node.js

Build a Backend with Prisma in a TypeScript Node Project

Build a Realtime Chat App with Remix and Supabase