Skip to content
Docs | Val Town

Discord bot

https://i.postimg.cc/bw5Xj8Rd/ping.gif

Introduction

By the end of this tutorial you will have a Discord bot hosted 24/7, for free, forever, on Val Town, that responds to a basic /ping Slash Command.

Val Town is a social website to write, and deploy JavaScript from the browser.

No prior coding experience required. The vast majority of this tutorial is creating the bot on Discord and pasting your keys into Val Town. The actual coding parts are just clicking Run two times to fork over two pieces of code to your Val Town account.

Video Tutorial

If you prefer videos, here’s this same tutorial in a 3-minute YouTube video.

https://youtu.be/yYXmInPSSfg

Step 1: Create a Discord app

  1. Go to the Discord Developer Portal and select “New Application” in the top right

1.edited.png

  1. Enter a name for your Bot, accept the terms and press Create.

2.png

Step 2: Add the bot to your server

To invite your new bot to your server, you need to generate a link to click on.

  1. Head to the Oauth2 > URL Generator page.
  2. Select the bot scope, then the Send Messages permission.

5.png

  1. Copy the URL at the bottom of the page and paste it into a new browser tab.
  2. Click through the steps until you’re prompted to choose your server and press Continue.

6.png

  1. Press Authorize.

7.png

🎉 Your bot is now a member of your server! Now let’s get it to respond to Slash Commands.

Step 3: Login to Val Town

Val Town is a social website to write, run, and host JavaScript. You can create APIs, scheduled functions, email yourself, and persist small pieces of data — all from the browser and instantly deployed. There is a generous free plan, and no credit card required.

  1. Login or create an account.

Step 4: Save bot secrets

  1. Go to the “General Information” page

3.edited.png

  1. Copy your Application ID
  2. Go to val.town/settings/environment-variables
  3. Create a new environment variable called discordAppId and paste in the value
  4. Copy your Public Key, saving it as discordPublicKey
  5. Go to the Bot page
  6. Click Reset Token and accept the warning

4.edited.png

  1. Copy and paste it in val.town/settings/environment-variables as discordBotToken.

Step 5: Register a new Slash Command

  1. The embedded code below should have your name in the top-left corner. If you see anonymous, refresh this page. If you still see anonymous, ensure you’re logged into Val Town.
  2. Press Run to add the /ping command to your bot.
Register /ping commandRun in Val Town ↗
import { registerDiscordSlashCommand } from "https://esm.town/v/neverstew/registerDiscordSlashCommand";


const result = await registerDiscordSlashCommand(
  Deno.env.get("discordAppId"),
  Deno.env.get("discordBotToken"),
  {
    name: "ping",
    description: "Say hi to your bot",
  },
);
export const registerDiscordCommand = result.json();

Step 6: Listen for Slash Commands

  1. Press Run to listen for Slash Commands and reply.
  1. Next to your val’s name, click 🔒 > Unlisted.
  2. In the val above, in the bottom-left corner of the val, click Script and change it to HTTP.
  3. Click on the URL at the bottom of that val that looks like https://username-handleDiscordInteraction.web.val.run
  4. Visit the General Information page for your bot and paste your copied endpoint into INTERACTIONS ENDPOINT URL and click Save Changes.

9.png

đź’¬ Try it out

Refresh Discord and try out your bot using /ping

Untitled

Further Directions

Now that you have a basic Discord Bot setup, you’ll want to customize it to do exactly what you want. You’ll probably want to:

  1. Register a new Slash Command
  2. Connect your bot to APIs like OpenAI’s GPT or Dall-E

Come join us in the Val Town Discord if you get stuck, have questions, or want to show off your cool new bot!