> ## Documentation Index
> Fetch the complete documentation index at: https://discord-markm-docs-lobby-membership-disconnect.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
# Overview of Discord Apps
> Build Discord apps to customize, extend, and enhance Discord for millions of users.
export const YouTubeEmbed = ({src, title = "YouTube video player", showDuration = false, chapters = ""}) => {
const iframeRef = useRef(null);
const detailsRef = useRef(null);
const [duration, setDuration] = useState(null);
const [activeChapter, setActiveChapter] = useState(-1);
const formatDuration = seconds => {
const h = Math.floor(seconds / 3600);
const m = Math.floor(seconds % 3600 / 60);
const s = Math.round(seconds % 60);
const pad = n => String(n).padStart(2, "0");
return h > 0 ? `${h}:${pad(m)}:${pad(s)}` : `${m}:${pad(s)}`;
};
const parsedChapters = useMemo(() => {
if (!chapters) return [];
return chapters.split("\n").map(line => {
const match = line.match(/^\s*[-*•]?\s*(?:(\d+):)?(\d{1,2}):(\d{2})\s*[-–—:]?\s*(\S.*)$/);
if (!match) return null;
const [, h, m, s, chapterTitle] = match;
const seconds = (h ? parseInt(h, 10) * 3600 : 0) + parseInt(m, 10) * 60 + parseInt(s, 10);
return {
seconds,
label: formatDuration(seconds),
title: chapterTitle.trim()
};
}).filter(Boolean);
}, [chapters]);
const jsApiEnabled = showDuration || parsedChapters.length > 0;
useEffect(() => {
if (parsedChapters.length === 0) return;
const onPointerDown = event => {
const details = detailsRef.current;
if (details?.open && !details.contains(event.target)) details.open = false;
};
document.addEventListener("pointerdown", onPointerDown);
return () => document.removeEventListener("pointerdown", onPointerDown);
}, [parsedChapters.length]);
useEffect(() => {
if (!jsApiEnabled) return;
const onMessage = event => {
if (event.origin !== "https://www.youtube.com") return;
if (!iframeRef.current || event.source !== iframeRef.current.contentWindow) return;
let data;
try {
data = JSON.parse(event.data);
} catch {
return;
}
const seconds = data?.info?.duration;
if (typeof seconds === "number" && seconds > 0) setDuration(seconds);
const currentTime = data?.info?.currentTime;
if (typeof currentTime === "number" && parsedChapters.length > 0) {
let index = -1;
for (let i = 0; i < parsedChapters.length; i++) {
if (parsedChapters[i].seconds <= currentTime) index = i;
}
setActiveChapter(index);
}
};
window.addEventListener("message", onMessage);
return () => window.removeEventListener("message", onMessage);
}, [jsApiEnabled, parsedChapters]);
const postToPlayer = payload => {
iframeRef.current?.contentWindow?.postMessage(JSON.stringify(payload), "https://www.youtube.com");
};
const handleLoad = () => {
postToPlayer({
event: "listening",
id: "ytembed",
channel: "widget"
});
};
const seekTo = seconds => {
postToPlayer({
event: "command",
func: "seekTo",
args: [seconds, true]
});
postToPlayer({
event: "command",
func: "playVideo",
args: []
});
};
const embedSrc = jsApiEnabled ? `${src}${src.includes("?") ? "&" : "?"}enablejsapi=1` : src;
return
{(showDuration || parsedChapters.length > 0) &&
{parsedChapters.length > 0 && Chapters
{parsedChapters.map((chapter, index) =>
)}
}
{showDuration && duration !== null &&
Duration: {formatDuration(duration)}
}
}
;
};
export const WrenchIcon = props => ;
export const AppsIcon = props => ;
export const GameControllerIcon = props => ;
export const ShapesIcon = props => ;
export const RobotIcon = props => ;
A **Discord application** is the core entity that represents your integration with the Discord platform. Every bot, Activity, and Social SDK integration is backed by an application registered in the [Discord Developer Portal](https://discord.com/developers/applications).
Applications hold your credentials, OAuth2 settings, bot configuration, and metadata. Whether you're building a simple command-response bot or a full game integration with voice chat and rich presence, it all starts with creating an application.
## The Three Types of Discord Apps
### Bots
Bots are automated user accounts operated by application code. They appear in servers with an `APP` tag and can respond to events, slash commands, and user actions.
Use bots when you want to:
* Add commands, moderation tools, or utilities to a server
* React to events (messages, joins, reactions) in real time
* Build interactive experiences with buttons, menus, and modals
* Post automated updates from external systems
Bots can be **guild-installed** (added to a specific server) or **user-installed** (available everywhere the user goes, without requiring server permissions).
### Activities
Activities are embedded web applications that run inside Discord channels. They're built with the [Embedded App SDK](/developers/developer-tools/embedded-app-sdk) and can be launched by any user in a channel or from a bot with the `LAUNCH_ACTIVITY` interaction callback.
Use Activities when you want to:
* Build a game or interactive experience that runs inside Discord
* Create collaborative tools (watch parties, drawing apps, trivia games)
* Leverage Discord's existing social context: voice, friends, servers
### Social Layer for Games
The [Discord Social SDK](/developers/discord-social-sdk/overview) lets you add Discord-powered social features to your game across PC, mobile, and console. You can integrate individual features alongside your existing social systems or build out a more complete Discord-powered experience.
Use the Social SDK when you want to:
* Add rich presence, friends lists, and voice chat to your game
* Support cross-platform social features with Discord account linking
* Let players interact through Discord without leaving your game
## Where Apps Install
| App Type | Install Target | What It Unlocks |
| - | - | - |
| Bot (guild-installed) | A server | Access to server channels, members, events |
| Bot (user-installed) | A user | Available in DMs, group DMs, and any server |
| Activity | An application | Launchable from any voice channel |
| Social SDK | Your game | Social features embedded in your game client |
## What APIs Can Apps Use?
There are a handful of different APIs that you can pick and choose from based on your app's functionality and which Discord features you want to access. Below is a quick overview of the main APIs on the Discord developer platform, but you can read more details and information about API usage in the [API reference](/developers/reference).
### HTTP API
The **HTTP API** is a REST API that lets you interact and modify core Discord resources like [channels](/developers/resources/channel), [servers (or guilds)](/developers/resources/guild), [users](/developers/resources/user), and [messages](/developers/resources/message#message-object).
Use the HTTP API to:
* Retrieve information about a resource
* Create, update, or delete a resource
Read details about using the HTTP API in the [API reference](/developers/reference#http-api).
### Gateway API
The **Gateway API** is a WebSocket connection between your app and Discord. While it's most commonly used to receive a real-time stream of events from Discord, the connection is bidirectional. Your app can also send events to Discord over the same connection.
Use the Gateway API to:
* Receive real-time events from Discord (messages, member joins, reactions, voice state changes, and more)
* Update your bot's presence and status
* Manage voice state and connect to voice channels
* Perform the connection handshake and manage the lifecycle of your Gateway connection
Read details about using the Gateway API in the [API reference](/developers/reference#gateway-websocket-api).
## Start Building
}>
Build a bot that responds to events, commands, and user interactions in Discord servers.
}>
Add Discord-powered social features to your game using the Discord Social SDK.
}>
Build an embedded web app or game that runs inside Discord voice channels.