Build a Discord support bot from scratch

#discord #webdev #javascript

Demo

I always found it annoying when I was following a tutorial, and they didn’t show you what the final result was upfront. Let’s not do that. Here's a video walkthrough of how the Discord support bot will work:

Here’s the TL;DR:

I work for a company called Gadget. We need to start measuring the quality of support we’re giving our users. What gets measured, gets managed.

When a user posts a question in our #help Discord forum channel, and the question gets answered by a Gadget expert, the Discord bot will ask the user to rate the quality of the answer.

Gadget is a platform that handles all the infrastructure (database, backend & frontend deployment) for you. I’m biased, but it’s genuinely the best way to make any kind of web app. Naturally, this Discord bot was made using the Gadget platform.

Create a Discord developer account

Go to discord.com/developers and make your Discord account into a developer account.

Once you've created a developer account, create a new application. I called my app "Gizmo".

Setup Gadget

Instead of making you faff about hosting the Discord bot and writing the code, I made a Gadget project that you can just fork.

That way, your Discord bot is securely hosted and the code to get the bot to interact with users is already written. The code is pretty simple: it sets up a command called /close. The idea is when someone asks a question by making a new thread in the Gadget server’s #help forum channel, and a Gadget expert answers the question, they can close the thread by running the /close command. When this command is run, a message pops up and asking the reader to rate the quality of the answer:

Anyone can vote on the quality of the answer, not just the original poster. This makes sense for us because devs often search through old support tickets to see if someone has run into their issue before. Those devs should be able to give feedback even if they haven’t contributed to the thread.

Fork the project here, then give your application a name. Now you have to connect the Gadget app with the bot you set up on the Discord developer portal. To do that, you need to find the bot’s token.

Go back to the developer portal, then press the “Reset Token” button.

Copy your new token. Go to Gadget, then Settings > Environment Variables and set DISCORD_BOT_TOKEN to the token you just copied.

The last thing you need to do is tell the Gadget app which servers and channels your bot is allowed in. You need the guild ID (server == guild in Discord) and the channels ID. Now that you are registered as a developer, you can right click on the server icon and channel icon to find their respective IDs.

Paste the server ID into DISCORD_GUILD_ID and the channel ID(s) into DISCORD_SUPPORT_CHANNEL_IDS. If you have more than one channel ID, separate them by commas like so:


123,234

Install the Discord bot

Select "OAuth2" from the left menu.

Then in the “OAuth2 URL Generator”, select “bot”, then in “Bot Permissions”, select “Administrator”.

This will give your bot permission to do everything in the server it’s installed in. This is good for testing. If your bot will be used by other servers, narrowing down the permissions to only the essentials might be a good idea. My bot is an internal tool, so it’s not a huge deal.

Copy the generated URL and paste it in a new tab. Select the server where you want to install your bot.

Test the bot

The /close command makes the bot ask the user for feedback. When you run that command, the bot should respond with the following message:

Anyone on the server can rate the quality of the answer, not just the original poster. This /close command only makes sense in forum posts. The /close command won’t execute in normal text channels.

Check the dashboard

The Gadget template doesn’t just host the discord bot, it has a frontend that visualizes the feedback data. Go to the Gadget template and press the play icon to navigate to the Gadget frontend:

Log into the app, then you should see a table with all the customer feedback:

Shazam! You now have a completely customizable Discord support system that is lightweight and free forever.

More ideas

This is just the tip of the iceberg. There are a bunch of features you could add to this project to help your support team go even faster. Here are a few I can think of:

Auth
- The Railway Discord server has this awesome thing where users get access to the community by authenticating via their Railway accounts. This way, everyone on the server is serious enough to create a new account, which filters out most bots and spammers.
Custom ticket management
- Tools like Linear or Zendesk are awesome, but there’s always that one feature that is missing. You can turn this project into a full-blown ticket management software that tracks which questions are still unanswered, and increases the priority of the ticket the longer it stays unanswered.
Monthly reports
- Executives LOVE reports, but they are a pain to make. Making reports is also a distraction from your main job (if making reports is your main job, have mercy on your soul).
- You can automate reports by setting up a Gadget background action that reads the past month’s stats from the Gadget database and sends an automated email to your boss.