From 3b97c97e1e60b644dbf0877e328eeeb35c244fd9 Mon Sep 17 00:00:00 2001 From: Multinite <145994855+Multinite@users.noreply.github.com> Date: Mon, 9 Dec 2024 15:33:15 +1000 Subject: [PATCH] docs: minor improvements to the `your-first-plugin` guide (#827) --- .../content/docs/guides/your-first-plugin.mdx | 72 ++++++++----------- 1 file changed, 29 insertions(+), 43 deletions(-) diff --git a/docs/content/docs/guides/your-first-plugin.mdx b/docs/content/docs/guides/your-first-plugin.mdx index bc1772c62d..a7aeef9eca 100644 --- a/docs/content/docs/guides/your-first-plugin.mdx +++ b/docs/content/docs/guides/your-first-plugin.mdx @@ -15,21 +15,7 @@ This guide assumes you have setup the basics - In this guide, we’ll create a **birthday plugin** - - - - - - - - - - - - to keep track of user birth dates. - +In this guide, we’ll create a **birthday plugin** to keep track of user birth dates. @@ -68,9 +54,9 @@ Although this does nothing, you have technically just made yourself your first p ### Defining a schema -In order to save each user's birthday data, we must create a schema on top of the `user` model. +In order to save each user’s birthday data, we must create a schema on top of the `user` model. -By creating a schema here, this also allows Better-Auth's CLI to generate the schemas required to update your database. +By creating a schema here, this also allows Better-Auth’s CLI to generate the schemas required to update your database. You can learn more about plugin schemas here. @@ -81,17 +67,17 @@ You can learn more about plugin schem export const birthdayPlugin = () => ({ id: "birthdayPlugin", - schema: { - user: { - fields: { - birthday: { - type: "date", // string, number, boolean, date - required: true, // if the field should be required on a new record. (default: false) - unique: false, // if the field should be unique. (default: false) - reference: null // if the field is a reference to another table. (default: null) - }, - }, - }, + schema: {// [!code highlight] + user: {// [!code highlight] + fields: {// [!code highlight] + birthday: {// [!code highlight] + type: "date", // string, number, boolean, date // [!code highlight] + required: true, // if the field should be required on a new record. (default: false) // [!code highlight] + unique: false, // if the field should be unique. (default: false) // [!code highlight] + reference: null // if the field is a reference to another table. (default: null) // [!code highlight] + },// [!code highlight] + },// [!code highlight] + },// [!code highlight] }, } satisfies BetterAuthPlugin); ``` @@ -100,10 +86,10 @@ export const birthdayPlugin = () => ### Authorization logic -For this example guide, we'll setup authentication logic to check and ensure that the user who signs-up is older than 5. +For this example guide, we’ll setup authentication logic to check and ensure that the user who signs-up is older than 5. But the same concept could be applied for something like verifying users agreeing to the TOS or anything alike. -To do this, we'll utilize Hooks, which allows us to run code `before` or `after` an action is performed. +To do this, we’ll utilize Hooks, which allows us to run code `before` or `after` an action is performed. ```ts title="index.ts" export const birthdayPlugin = () => ({ @@ -131,7 +117,7 @@ In our case we want to match any requests going to the signup path: } ``` -And for our logic, we'll write the following code to check the if user's birthday makes them above 5 years old. +And for our logic, we’ll write the following code to check the if user’s birthday makes them above 5 years old. ```ts title="Imports" import { APIError } from "better-auth/api"; import { createAuthMiddleware } from "better-auth/plugins"; @@ -155,18 +141,18 @@ import { createAuthMiddleware } from "better-auth/plugins"; **Authorized!** 🔒 -We've now successfully written code to ensure authorization for users above 5! +We’ve now successfully written code to ensure authorization for users above 5! ## Client Plugin -We're close to the finish line! 🏁 +We’re close to the finish line! 🏁 Now that we have created our server plugin, the next step is to develop our client plugin. -Since there isn't much frontend APIs going on for this plugin, there isn't much to do! +Since there isn’t much frontend APIs going on for this plugin, there isn’t much to do! -First, let's create our `client.ts` file first: +First, let’s create our `client.ts` file first: @@ -187,9 +173,9 @@ export const birthdayClientPlugin = () => { } satisfies BetterAuthClientPlugin; }; ``` -What we've done is allow the client plugin to infer the types defined by our schema from the server plugin. +What we’ve done is allow the client plugin to infer the types defined by our schema from the server plugin. -And that's it! This is all it takes for the birthday client plugin. 🎂 +And that’s it! This is all it takes for the birthday client plugin. 🎂 @@ -200,11 +186,11 @@ Both the `client` and `server` plugins are now ready, the last step is to import ### Server initiation ```ts title="server.ts" import { betterAuth } from "better-auth"; -import { birthdayPlugin } from "./birthday-plugin"; +import { birthdayPlugin } from "./birthday-plugin";// [!code highlight] export const auth = betterAuth({ plugins: [ - birthdayPlugin(), + birthdayPlugin(),// [!code highlight] ] }); ``` @@ -212,17 +198,17 @@ export const auth = betterAuth({ ### Client initiation ```ts title="auth-client.ts" import { createAuthClient } from "better-auth/client"; -import { birthdayClientPlugin } from "./birthday-plugin/client"; +import { birthdayClientPlugin } from "./birthday-plugin/client";// [!code highlight] const authClient = createAuthClient({ plugins: [ - birthdayClientPlugin() + birthdayClientPlugin()// [!code highlight] ] }); ``` ### Oh yeah, the schemas! -Don't forget to add your `birthday` field to your `user` table model! +Don’t forget to add your `birthday` field to your `user` table model! Or, use the `generate` CLI command: ```bash @@ -237,7 +223,7 @@ npx @better-auth/cli@latest generate Congratulations! You’ve successfully created your first ever Better Auth plugin. We highly recommend you visit our plugins documentation to learn more information. -If you have a plugin you'd like to share with the community, feel free to let us know through +If you have a plugin you’d like to share with the community, feel free to let us know through our Discord server, or through a pull-request and we may add it to the community-plugins list! \ No newline at end of file