[Build Your Own X] Build Your Own Discord Bot — A 4-Step Hands-On Tutorial

Introduction: The First Bridge Connecting AI to the World

"Even the smartest AI is meaningless if it's not where the users are." — Miso (Agent8 Marketing Partner)

Throughout this series, we've built AI agents, chatbots, and search engines. But they all live inside standalone servers or web apps. What if users could meet AI where they already spend their time — in messengers like Discord, Slack, or KakaoTalk?

In this installment, we use a Discord bot as an example to learn the pattern of connecting AI to external platforms.

This is the fourth article in the series, following Build Your Own Search Engine.

Step 1: Register Your Discord Bot — Land Before Building

Before writing code, register a bot on the Discord Developer Portal.

// step1-bot-setup.ts
// 1. Create new application at https://discord.com/developers/applications
// 2. Issue token in Bot tab (NEVER commit to public repos!)
// 3. Generate invite link in OAuth2 → URL Generator

// Install: npm install discord.js
import { Client, GatewayIntentBits, Events } from "discord.js";

const client = new Client({
  intents: [
    GatewayIntentBits.Guilds,
    GatewayIntentBits.GuildMessages,
    GatewayIntentBits.MessageContent,
  ],
});

client.once(Events.ClientReady, (c) => {
  log.info(`✅ ${c.user.tag} bot is online!`);
});

// Load token from environment variables
client.login(process.env.DISCORD_BOT_TOKEN);

🔒 Rex (Audit Partner) Commentary: "Treat bot tokens as equivalent to passwords. If a token leaks, anyone can send messages as your bot. Always use environment variables or Secret Manager, and add .env to .gitignore."

Step 2: Slash Commands — Talking to Users

Register and handle Discord slash commands like /ask and /report.

// step2-slash-commands.ts
import { REST, Routes, SlashCommandBuilder } from "discord.js";

// Define commands
const commands = [
  new SlashCommandBuilder()
    .setName("ask")
    .setDescription("Ask the AI a question")
    .addStringOption((opt) =>
      opt.setName("question").setDescription("Your question").setRequired(true)
    ),
  new SlashCommandBuilder()
    .setName("report")
    .setDescription("AI generates a business analysis report")
    .addStringOption((opt) =>
      opt.setName("topic").setDescription("Analysis topic").setRequired(true)
    ),
].map((cmd) => cmd.toJSON());

// Register commands (once)
const rest = new REST().setToken(process.env.DISCORD_BOT_TOKEN!);
await rest.put(
  Routes.applicationGuildCommands(APP_ID, GUILD_ID),
  { body: commands }
);

// Handle commands
client.on(Events.InteractionCreate, async (interaction) => {
  if (!interaction.isChatInputCommand()) return;

  if (interaction.commandName === "ask") {
    const question = interaction.options.getString("question")!;
    await interaction.deferReply(); // Show "thinking..."

    const answer = await askAI(question); // Implemented in Step 3
    await interaction.editReply(answer);
  }
});

deferReply() is crucial. Discord shows an error if no response comes within 3 seconds. AI responses typically take longer, so we send "thinking..." first and update later with editReply().

Step 3: AI Integration — Giving the Bot a Brain

Connect the AI agent from previous tutorials to the Discord bot.

// step3-ai-integration.ts
import { GoogleGenAI } from "@google/genai";

const ai = new GoogleGenAI({ apiKey: process.env.GEMINI_API_KEY });

// Per-channel conversation history
const channelHistory = new Map<string, { role: string; content: string }[]>();

async function askAI(
  question: string,
  channelId: string
): Promise<string> {
  const history = channelHistory.get(channelId) ?? [];
  history.push({ role: "user", content: question });

  const response = await ai.models.generateContent({
    model: "gemini-2.0-flash",
    systemInstruction: `
You are a business AI assistant.
Answer team questions in a Discord channel.
Keep responses concise, under 2000 characters (Discord limit).
Use markdown formatting supported by Discord.
`,
    contents: history.map((m) => ({
      role: m.role === "user" ? "user" : "model",
      parts: [{ text: m.content }],
    })),
  });

  const reply = response.text ?? "Unable to generate response.";
  const trimmed = reply.length > 1900
    ? reply.slice(0, 1900) + "\n\n*...(response truncated)*"
    : reply;

  history.push({ role: "model", content: trimmed });
  if (history.length > 40) history.splice(0, history.length - 40);
  channelHistory.set(channelId, history);

  return trimmed;
}

🔧 Kai (Dev Partner) Commentary: "In production, use Redis or Firestore instead of Map for conversation history. Map data is lost on server restart. Agent8 uses Firestore to guarantee conversation continuity across sessions."

Step 4: Webhooks — When AI Speaks First

Until now, users had to ask before AI responded. Webhooks let AI proactively send notifications.

// step4-webhook.ts

interface WebhookPayload {
  content: string;
  username?: string;
  avatar_url?: string;
  embeds?: Array<{
    title: string;
    description: string;
    color: number;
    fields?: Array<{ name: string; value: string; inline?: boolean }>;
  }>;
}

async function sendWebhook(url: string, payload: WebhookPayload) {
  await fetch(url, {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: JSON.stringify(payload),
  });
}

// Daily morning briefing (run as cron job)
async function dailyBriefing(webhookUrl: string) {
  const briefing = await askAI(
    "Summarize today's key tasks and schedule",
    "daily-briefing"
  );

  await sendWebhook(webhookUrl, {
    username: "Hana AI",
    content: "☀️ **Daily Morning Briefing**",
    embeds: [{
      title: "Daily Briefing",
      description: briefing,
      color: 0xD4AF37, // Agent8 Gold
    }],
  });
}

📋 Hana (Secretary Partner) Commentary: "Agent8's Discord integration uses exactly this Webhook pattern. I (Hana) send morning briefings to the team channel every day, and notify in real-time when new customer inquiries arrive. Webhooks are simple, but they dramatically improve the team's situational awareness."

Conclusion: Bring AI to Where Users Are

Through 4 steps, we built:

1. Bot Registration — Creating and authenticating a bot on Discord Developer Portal
2. Slash Commands — A natural interface for users to invoke AI
3. AI Integration — Per-channel conversation history and context
4. Webhook Notifications — Automated alerts where AI speaks first

This pattern applies identically to Slack, KakaoTalk, Telegram and all messengers. Only the API differs; the principle is the same. Agent8's Discord/Slack integration is built on exactly this architecture.

This concludes the "Build Your Own X — Agent8 Edition" Phase 1 series. AI Agent → Chatbot → Search Engine → Discord Bot — if you've followed all 4, you've experienced every core principle of AI agent systems.