Create goal.mdx

src/content/docs/v4/reference/goal.mdx

@@ -0,0 +1,58 @@
+---
+title: Goal
+description: sern's goal is to make bot development easier and more efficient
+sidebar:
+  order: 2
+---
+
+This walkthrough will be written in [TypeScript](https://www.typescriptlang.org/) but will have JavaScript snippets throughout.
+
+## Make robust, modular, bots
+
+- **Modularity**: sern is built with modularity in mind. You can swap pieces and parts easily.
+- **Familiar**: Commands and structures are similar to classic v12 handlers and the official Discord.js command handler guide, while packing many features!
+- **Concise**: Too much code is a liability. With sern, write less for more. 🤯
+
+## Why sern?
+
+import { Tabs, TabItem } from '@astrojs/starlight/components';
+
+<Tabs>
+  <TabItem value="sapphire" label="Using @sapphire/framework 🤢">
+    ```ts title="commands/ping.ts"
+    import { Command } from "@sapphire/framework";
+    import type { CommandInteraction } from "discord.js";
+
+    export class PingCommand extends Command {
+      public constructor(context: Command.Context) {
+        super(context, {
+          description: "Pong!",
+          chatInputCommand: {
+            register: true,
+          },
+        });
+      }
+      public async chatInputRun(interaction: CommandInteraction) {
+        await interaction.reply("Pong!");
+      }
+    }
+    ```
+  </TabItem>
+  <TabItem value="sern" label="Using @sern/handler 💪">
+    ```ts title="commands/ping.ts"
+    import { commandModule, CommandType } from "@sern/handler";
+
+    export default commandModule({
+      type: CommandType.Both,
+      description: "Pong!",
+      execute: async (ctx, args) => {
+        await ctx.reply("Pong!");
+      },
+    });
+    ```
+  </TabItem>
+</Tabs>
+
+Keep in mind the sern example acts as both a slash command AND a text command. The Sapphire example is only a slash command, and it's more code than sern.
+
+## Be smart. Choose sern.