diff --git a/packages/docs-new/src/docs/buttons.md b/packages/docs-new/src/docs/buttons.md
new file mode 100644
index 0000000..e20136a
--- /dev/null
+++ b/packages/docs-new/src/docs/buttons.md
@@ -0,0 +1,9 @@
+---
+order: 3
+title: Buttons
+description: Using button components
+---
+
+# Buttons
+
+todo
diff --git a/packages/docs-new/src/docs/embeds.md b/packages/docs-new/src/docs/embeds.md
new file mode 100644
index 0000000..3ff694a
--- /dev/null
+++ b/packages/docs-new/src/docs/embeds.md
@@ -0,0 +1,9 @@
+---
+order: 2
+title: Embeds
+description: Using embed components
+---
+
+# Embeds
+
+todo
diff --git a/packages/docs-new/src/docs/getting-started.md b/packages/docs-new/src/docs/getting-started.md
new file mode 100644
index 0000000..5d5bb55
--- /dev/null
+++ b/packages/docs-new/src/docs/getting-started.md
@@ -0,0 +1,44 @@
+---
+order: 0
+meta:
+  title: Getting Started
+  description: Learn how to get started with Reacord.
+---
+
+# Getting Started
+
+This guide assumes some familiarity with JavaScript, [React](https://reactjs.org), [Discord.js](https://discord.js.org) and the [Discord API](https://discord.dev). Keep these pages as reference if you need it.
+
+**Note:** Ensure your project has support for running code with JSX. I recommend using [esno](https://npm.im/esno).
+
+## Install
+
+```bash
+# npm
+npm install reacord discord.js
+
+# yarn
+yarn add reacord discord.js
+
+# pnpm
+pnpm add reacord discord.js
+```
+
+## Setup
+
+Create a Discord.js client and a Reacord instance:
+
+```js
+// main.js
+import { Client } from "discord.js"
+import { ReacordDiscordJs } from "reacord"
+
+const client = new Client()
+const reacord = new ReacordDiscordJs(client)
+
+client.on("ready", () => {
+  console.log("Ready!")
+})
+
+await client.login(process.env.BOT_TOKEN)
+```
diff --git a/packages/docs-new/src/docs/select-menu.md b/packages/docs-new/src/docs/select-menu.md
new file mode 100644
index 0000000..91e2420
--- /dev/null
+++ b/packages/docs-new/src/docs/select-menu.md
@@ -0,0 +1,8 @@
+---
+title: Select Menus
+description: Using select menu components
+---
+
+# Select Menus
+
+todo
diff --git a/packages/docs-new/src/docs/sending-messages.md b/packages/docs-new/src/docs/sending-messages.md
new file mode 100644
index 0000000..e4efb16
--- /dev/null
+++ b/packages/docs-new/src/docs/sending-messages.md
@@ -0,0 +1,87 @@
+---
+order: 1
+title: Sending Messages
+description: Sending messages by creating Reacord instances
+---
+
+# Sending Messages with Instances
+
+You can send messages via Reacord to a channel like so.
+
+<details>
+  <summary>In case you're unaware, click here to see how to get a channel ID.</summary>
+
+1. Enable "Developer Mode" in your Discord client settings.
+   ![Enabling developer mode](/images/developer-mode.png)
+1. Right click any channel, and select "Copy ID".
+![Copying the channel ID](/images/copy-channel-id.png)
+</details>
+
+```jsx
+const channelId = "abc123deadbeef"
+
+client.on("ready", () => {
+  reacord.send(channelId, "Hello, world!")
+})
+```
+
+The `.send()` function creates a **Reacord instance**. You can pass strings, numbers, or anything that can be rendered by React, such as JSX!
+
+Components rendered through this instance can include state and effects, and the message on Discord will update automatically.
+
+```jsx
+function Uptime() {
+  const [startTime] = useState(Date.now())
+  const [currentTime, setCurrentTime] = useState(Date.now())
+
+  useEffect(() => {
+    const interval = setInterval(() => {
+      currentTime(Date.now())
+    }, 3000)
+    return () => clearInterval(interval)
+  }, [])
+
+  return <>this message has been shown for {currentTime - startTime}ms</>
+}
+
+client.on("ready", () => {
+  reacord.send(channelId, <Uptime />)
+})
+```
+
+The instance can be rendered to multiple times, which will update the message each time.
+
+```jsx
+const Hello = ({ subject }) => <>Hello, {subject}!</>
+
+client.on("ready", () => {
+  const instance = reacord.send(channel)
+  instance.render(<Hello subject="World" />)
+  instance.render(<Hello subject="Moon" />)
+})
+```
+
+## Cleaning Up Instances
+
+If you no longer want to use the instance, you can clean it up in a few ways:
+
+- `instance.destroy()` - This will remove the message.
+- `instance.deactivate()` - This will keep the message, but it will disable the components on the message, and no longer listen to user interactions.
+
+By default, Reacord has a max limit on the number of active instances, and deactivates older instances to conserve memory. This can be configured through the Reacord options:
+
+```js
+const reacord = new ReacordDiscordJs(client, {
+  // after sending four messages,
+  // the first one will be deactivated
+  maxInstances: 3,
+})
+```
+
+## Discord Slash Commands
+
+<aside className="opacity-75 italic">
+This section also applies to other kinds of application commands, such as context menu commands.
+</aside>
+
+todo