Skip to content

Commit d0cb045

Browse files
committed
refactor: rename plugin folder
1 parent aa497d3 commit d0cb045

38 files changed

Lines changed: 24 additions & 50 deletions

README.md

Lines changed: 22 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,13 @@ A monorepo template for creating plugins for [Better-Stack](https://github.com/b
66

77
This repository provides:
88
- A complete plugin development environment
9-
- Starter plugin (`todo-plugin`) that you'll modify and publish to npm
9+
- Starter plugin (`plugin`) that you'll modify and publish to npm
1010
- Shared UI components package
1111
- Next.js example application showing plugin integration
1212
- E2E testing setup with Playwright
1313
- TypeScript configuration and ESLint setup
1414

15-
**Getting Started:** Clone this repository, modify the `todo-plugin` package to match your needs, update the package name in `package.json`, and publish it to npm under your own account.
15+
**Getting Started:** Clone this repository, modify the `plugin` package to match your needs, update the package name in `package.json`, and publish it to npm under your own account.
1616

1717
## Getting Started
1818

@@ -56,68 +56,42 @@ The example Next.js application will be available at `http://localhost:3000`.
5656
```
5757
plugin-starter/
5858
├── packages/
59-
│ ├── todo-plugin/ # Your plugin (modify this and publish to npm)
59+
│ ├── plugin/ # Your plugin (modify this and publish to npm)
6060
│ │ ├── src/
6161
│ │ │ ├── api/ # Backend plugin (API endpoints)
6262
│ │ │ ├── client/ # Client plugin (React components, routes)
6363
│ │ │ ├── schema.ts # Database schema definition
6464
│ │ │ └── types.ts # TypeScript types
6565
│ │ └── package.json # Update name here before publishing
66-
│ ├── ui/ # Shared UI components (shadcn/ui)
67-
│ └── eslint-config/ # Shared ESLint configuration
66+
│ ├── ui/ # Shared UI components (shadcn/ui)
67+
│ └── eslint-config/ # Shared ESLint configuration
6868
├── examples/
69-
│ └── nextjs/ # Next.js example app showing plugin usage
70-
├── e2e/ # End-to-end tests
71-
└── package.json # Root package.json with workspace scripts
69+
│ └── nextjs/ # Next.js example app showing plugin usage
70+
├── e2e/ # End-to-end tests
71+
└── package.json # Root package.json with workspace scripts
7272
```
7373

7474
## Tutorial: Building Your Better-Stack Plugin
7575

76-
This tutorial walks you through customizing the `todo-plugin` to build your own Better-Stack plugin. You'll modify the existing plugin and publish it to npm under your own account.
76+
This tutorial walks you through customizing the `plugin` to build your own Better-Stack plugin. You'll modify the existing plugin and publish it to npm under your own account.
7777

7878
### Step 1: Update Package Configuration
7979

80-
First, update `packages/todo-plugin/package.json` with your own package name and npm account:
80+
First, update `packages/plugin/package.json` with your own package name and npm account:
8181

8282
```json
8383
{
8484
"name": "@your-username/your-plugin-name",
8585
"version": "0.0.1",
86-
"type": "module",
87-
"scripts": {
88-
"build": "unbuild",
89-
"dev": "unbuild --watch",
90-
"typecheck": "tsc --project tsconfig.json --noEmit",
91-
"lint": "eslint . --max-warnings 0"
92-
},
93-
"sideEffects": ["./dist/style.css"],
94-
"exports": {
95-
"./css": "./dist/style.css",
96-
"./api": {
97-
"types": "./dist/api/index.d.ts",
98-
"import": "./dist/api/index.mjs",
99-
"default": "./dist/api/index.mjs"
100-
},
101-
"./client": {
102-
"types": "./dist/client/index.d.ts",
103-
"import": "./dist/client/index.mjs",
104-
"default": "./dist/client/index.mjs"
105-
}
106-
},
107-
"peerDependencies": {
108-
"@btst/stack": "catalog:",
109-
"@tanstack/react-query": ">=5.66.0",
110-
"react": ">=18.0.0",
111-
"zod": ">=3.24.0"
112-
}
86+
... rest of package.json
11387
}
11488
```
11589

11690
**Note:** Make sure to update all references to `@btst/todo-plugin` throughout the codebase to match your new package name.
11791

11892
### Step 2: Define Your Database Schema
11993

120-
Modify `packages/todo-plugin/src/schema.ts` to define your database models. The existing file shows how to define models:
94+
Modify `packages/plugin/src/schema.ts` to define your database models. The existing file shows how to define models:
12195

12296
```typescript
12397
import { createDbPlugin } from "@btst/stack/plugins/api"
@@ -147,7 +121,7 @@ Update the plugin name and model definitions to match your use case.
147121

148122
### Step 3: Update TypeScript Types
149123

150-
Modify `packages/todo-plugin/src/types.ts` to match your data models:
124+
Modify `packages/plugin/src/types.ts` to match your data models:
151125

152126
```typescript
153127
export type Todo = {
@@ -160,7 +134,7 @@ export type Todo = {
160134
161135
### Step 4: Build the Backend Plugin
162136
163-
Modify `packages/todo-plugin/src/api/backend.ts`:
137+
Modify `packages/plugin/src/api/backend.ts`:
164138
165139
```typescript
166140
import { type Adapter, defineBackendPlugin, createEndpoint } from "@btst/stack/plugins/api"
@@ -272,7 +246,7 @@ The `src/api/index.ts` file already exports everything you need.
272246
273247
### Step 5: Build the Client Plugin
274248
275-
Modify `packages/todo-plugin/src/client/client.tsx`:
249+
Modify `packages/plugin/src/client/client.tsx`:
276250
277251
```typescript
278252
import { createApiClient, defineClientPlugin, createRoute } from "@btst/stack/plugins/client"
@@ -358,7 +332,7 @@ export const todoPluginClientPlugin = (config: TodoPluginClientConfig) =>
358332
})
359333
```
360334

361-
Modify `packages/todo-plugin/src/client/hooks.tsx`:
335+
Modify `packages/plugin/src/client/hooks.tsx`:
362336

363337
```typescript
364338
"use client"
@@ -405,7 +379,7 @@ The `src/client/index.ts` file already exports everything you need.
405379

406380
### Step 6: Create Page Components
407381

408-
Modify `packages/todo-plugin/src/client/pages/todos-list/todos-list-page.tsx`:
382+
Modify `packages/plugin/src/client/pages/todos-list/todos-list-page.tsx`:
409383

410384
```typescript
411385
"use client"
@@ -436,7 +410,7 @@ export function TodosListPageComponent() {
436410

437411
### Step 7: Add Styles
438412

439-
Modify `packages/todo-plugin/src/style.css` to add your plugin-specific styles:
413+
Modify `packages/plugin/src/style.css` to add your plugin-specific styles:
440414

441415
```css
442416
/* Your plugin-specific styles */
@@ -447,7 +421,7 @@ Modify `packages/todo-plugin/src/style.css` to add your plugin-specific styles:
447421

448422
### Step 8: Configure Build
449423

450-
The `packages/todo-plugin/build.config.ts` file is already configured:
424+
The `packages/plugin/build.config.ts` file is already configured:
451425

452426
```typescript
453427
import { defineBuildConfig } from "unbuild"
@@ -527,7 +501,7 @@ pnpm --filter @your-username/your-plugin-name typecheck
527501
pnpm --filter @your-username/your-plugin-name lint
528502

529503
# Publish to npm (make sure you're logged in: npm login)
530-
cd packages/todo-plugin
504+
cd packages/plugin
531505
npm publish --access public
532506
```
533507

@@ -624,15 +598,15 @@ pnpm e2e:smoke
624598

625599
## Reference Implementation
626600

627-
The `todo-plugin` package is your starting point and serves as a complete reference implementation. Study it to understand:
601+
The `plugin` package is your starting point and serves as a complete reference implementation. Study it to understand:
628602
- Database schema definition
629603
- Backend API endpoints
630604
- Client-side React components
631605
- React Query hooks
632606
- Route configuration
633607
- SSR and meta generation
634608

635-
Modify the `todo-plugin` to build your own plugin, then publish it to npm under your own account.
609+
Modify the `plugin` to build your own plugin, then publish it to npm under your own account.
636610

637611
## License
638612

File renamed without changes.
File renamed without changes.
File renamed without changes.

0 commit comments

Comments
 (0)