Skip to content

Commit 5021f14

Browse files
Copilothotlong
Copilot
and
hotlong
committed
Convert to multi-package monorepo with npm workspaces and add comprehensive examples
Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>
1 parent f05f8c8 commit 5021f14

30 files changed

+1992
-71
lines changed

‎README.md‎

Lines changed: 123 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# ObjectStack Starter Template
22

3-
A starter template for building [ObjectStack](https://objectstack.ai) applications. This template demonstrates the basic structure and conventions for creating metadata-driven low-code applications using the ObjectStack framework.
3+
A multi-package starter template for building [ObjectStack](https://objectstack.ai) applications. This monorepo demonstrates the structure and conventions for creating metadata-driven low-code applications using the ObjectStack framework, with multiple examples covering different use cases.
44

55
[![TypeScript](https://img.shields.io/badge/TypeScript-5.3-blue.svg)](https://www.typescriptlang.org/)
66
[![ObjectStack Spec](https://img.shields.io/badge/@objectstack/spec-0.3.3-green.svg)](https://www.npmjs.com/package/@objectstack/spec)
@@ -15,84 +15,136 @@ A starter template for building [ObjectStack](https://objectstack.ai) applicatio
1515
git clone https://github.com/objectstack-ai/objectstack-starter.git
1616
cd objectstack-starter
1717

18-
# Install dependencies
18+
# Install dependencies (installs all workspace packages)
1919
npm install
2020

21-
# Build the project
21+
# Build all packages
2222
npm run build
2323
```
2424

25+
### Running Examples
26+
27+
This template includes multiple example applications demonstrating different use cases:
28+
29+
```bash
30+
# Run the basic example (core objects)
31+
npm run example:basic
32+
33+
# Run the e-commerce example
34+
npm run example:ecommerce
35+
36+
# Run the blog example
37+
npm run example:blog
38+
39+
# Run the CRM example
40+
npm run example:crm
41+
```
42+
2543
### Development
2644

2745
```bash
28-
# Watch mode - automatically rebuild on changes
46+
# Watch mode - automatically rebuild all packages on changes
2947
npm run dev
3048

49+
# Build specific package
50+
npm run build:core
51+
npm run build:examples
52+
3153
# Type checking
3254
npm run type-check
3355

3456
# Clean build artifacts
3557
npm run clean
3658
```
3759

38-
### Running the Example
60+
## 📦 What's Included
3961

40-
The template includes an example file demonstrating how to use the defined objects and views:
62+
This starter template is organized as a monorepo with multiple packages:
4163

42-
```bash
43-
# Build the project
44-
npm run build
64+
### Package: @objectstack-starter/core
4565

46-
# Run the example
47-
node dist/example.js
48-
```
66+
Core package with base objects and views:
4967

50-
This will show you how to import and work with the ObjectStack definitions.
68+
**Data Objects:**
69+
- **Project Task** - Task management with status, priority, assignments, and time tracking
70+
- **Contact** - Contact management with CRM capabilities
5171

52-
## 📦 What's Included
72+
**UI Views:**
73+
- Task list view (grid)
74+
- Task kanban board
75+
- Contact list view (grid)
76+
- Main app definition
5377

54-
This starter template includes:
78+
### Package: @objectstack-starter/examples
5579

56-
### Data Objects (`src/data/`)
80+
Example applications demonstrating different use cases:
5781

58-
- **Project Task** (`project-task.object.ts`) - Task management with status, priority, assignments, and time tracking
59-
- **Contact** (`contact.object.ts`) - Contact management with CRM capabilities
82+
**E-commerce:**
83+
- Product object - Product catalog management
84+
- Order object - Order processing and tracking
85+
- Product and order list views
6086

61-
### UI Views (`src/ui/`)
87+
**Blog:**
88+
- Blog Post object - Content management
89+
- Author object - Author management
90+
- Blog post and author list views
6291

63-
- **Task Views** (`task.view.ts`)
64-
- Grid view for task lists
65-
- Kanban board for visual task management
66-
- **Contact Views** (`contact.view.ts`)
67-
- Grid view for contact management
68-
- **App Definition** (`app.ts`) - Main application structure and navigation
92+
**CRM:**
93+
- Account object - Business account management
94+
- Opportunity object - Sales pipeline tracking
95+
- Account list view, opportunity list/kanban views
6996

7097
### Configuration
7198

72-
- `objectstack.config.ts` - ObjectStack manifest with app metadata, navigation, and permissions
73-
- `tsconfig.json` - TypeScript configuration
74-
- `package.json` - Project dependencies and scripts
99+
- `package.json` - Workspace configuration
100+
- `packages/*/tsconfig.json` - TypeScript configuration per package
101+
- `packages/*/package.json` - Package dependencies and scripts
75102

76103
## 🏗️ Project Structure
77104

78105
```
79-
objectstack-starter/
80-
├── src/
81-
│ ├── data/ # Data object definitions
82-
│ │ ├── project-task.object.ts
83-
│ │ └── contact.object.ts
84-
│ ├── ui/ # UI views and app definitions
85-
│ │ ├── task.view.ts
86-
│ │ ├── contact.view.ts
87-
│ │ └── app.ts
88-
│ ├── system/ # System configurations (future)
89-
│ ├── ai/ # AI agents and prompts (future)
90-
│ ├── api/ # API definitions (future)
91-
│ └── index.ts # Main export file
92-
├── objectstack.config.ts # ObjectStack manifest
93-
├── tsconfig.json # TypeScript configuration
94-
├── package.json # Project configuration
95-
└── README.md # This file
106+
objectstack-starter/ # Monorepo root
107+
├── packages/
108+
│ ├── core/ # @objectstack-starter/core
109+
│ │ ├── src/
110+
│ │ │ ├── data/ # Core data objects
111+
│ │ │ │ ├── project-task.object.ts
112+
│ │ │ │ └── contact.object.ts
113+
│ │ │ ├── ui/ # Core UI views
114+
│ │ │ │ ├── task.view.ts
115+
│ │ │ │ ├── contact.view.ts
116+
│ │ │ │ └── app.ts
117+
│ │ │ ├── objectstack.config.ts
118+
│ │ │ ├── example.ts
119+
│ │ │ └── index.ts
120+
│ │ ├── package.json
121+
│ │ ├── tsconfig.json
122+
│ │ └── README.md
123+
│ │
124+
│ └── examples/ # @objectstack-starter/examples
125+
│ ├── src/
126+
│ │ ├── data/ # Example data objects
127+
│ │ │ ├── product.object.ts # E-commerce
128+
│ │ │ ├── order.object.ts # E-commerce
129+
│ │ │ ├── blog-post.object.ts # Blog
130+
│ │ │ ├── author.object.ts # Blog
131+
│ │ │ ├── account.object.ts # CRM
132+
│ │ │ └── opportunity.object.ts # CRM
133+
│ │ ├── ui/ # Example UI views
134+
│ │ │ ├── ecommerce.view.ts
135+
│ │ │ ├── blog.view.ts
136+
│ │ │ └── crm.view.ts
137+
│ │ ├── basic-example.ts
138+
│ │ ├── ecommerce-example.ts
139+
│ │ ├── blog-example.ts
140+
│ │ ├── crm-example.ts
141+
│ │ └── index.ts
142+
│ ├── package.json
143+
│ ├── tsconfig.json
144+
│ └── README.md
145+
│
146+
├── package.json # Workspace root configuration
147+
└── README.md # This file
96148
```
97149

98150
## 📚 ObjectStack Concepts
@@ -186,37 +238,48 @@ This project is licensed under the MIT License - see the LICENSE file for detail
186238

187239
## 🌟 Features
188240

241+
- ✅ Monorepo structure with npm workspaces
242+
- ✅ Multiple packages: core and examples
189243
- ✅ TypeScript support with strict type checking
190244
- ✅ Based on the latest @objectstack/spec (v0.3.3)
191-
- ✅ Example data objects following ObjectStack conventions
192-
- ✅ Example UI views (grid and kanban)
245+
- ✅ Core objects: Task and Contact management
246+
- ✅ E-commerce example: Product and Order management
247+
- ✅ Blog example: Post and Author management
248+
- ✅ CRM example: Account and Opportunity tracking
249+
- ✅ Multiple view types (grid and kanban)
193250
- ✅ Proper project structure and configuration
194251
- ✅ Ready to extend with AI, API, and System protocols
195252

196253
## 🔧 Extending This Template
197254

198-
### Adding a New Object
255+
### Adding a New Object to Core Package
199256

200-
1. Create a new file in `src/data/` (e.g., `account.object.ts`)
257+
1. Create a new file in `packages/core/src/data/` (e.g., `account.object.ts`)
201258
2. Define your object following the Data Protocol
202-
3. Export it from `src/index.ts`
203-
4. Add navigation for it in `objectstack.config.ts`
259+
3. Export it from `packages/core/src/index.ts`
260+
4. Add navigation for it in `packages/core/src/objectstack.config.ts`
204261

205-
### Adding a New View
262+
### Adding a New View to Core Package
206263

207-
1. Create a new file in `src/ui/` (e.g., `account.view.ts`)
264+
1. Create a new file in `packages/core/src/ui/` (e.g., `account.view.ts`)
208265
2. Define your view following the UI Protocol
209-
3. Export it from `src/index.ts`
266+
3. Export it from `packages/core/src/index.ts`
210267

211-
### Adding AI Capabilities
268+
### Creating a New Example Package
212269

213-
1. Create files in `src/ai/` for agents and prompts
214-
2. Use the AI Protocol from `@objectstack/spec/ai`
270+
1. Create a new directory in `packages/` (e.g., `packages/my-example`)
271+
2. Add `package.json` with dependencies
272+
3. Create `src/` directory with objects and views
273+
4. Add example runner files
274+
5. Update workspace configuration in root `package.json`
215275

216-
### Adding API Endpoints
276+
### Adding More Examples to Examples Package
217277

218-
1. Create files in `src/api/` for endpoint definitions
219-
2. Use the API Protocol from `@objectstack/spec/api`
278+
1. Create new object files in `packages/examples/src/data/`
279+
2. Create corresponding view files in `packages/examples/src/ui/`
280+
3. Create example runner file (e.g., `my-example.ts`)
281+
4. Export from `packages/examples/src/index.ts`
282+
5. Add script to `packages/examples/package.json`
220283

221284
## 💡 Tips
222285

‎package.json‎

Lines changed: 17 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,23 @@
11
{
22
"name": "objectstack-starter",
33
"version": "0.1.0",
4-
"description": "ObjectStack Starter Template - A metadata-driven low-code platform starter",
4+
"description": "ObjectStack Starter Template - A metadata-driven low-code platform starter (Multi-package Monorepo)",
55
"type": "module",
6-
"main": "dist/index.js",
7-
"types": "dist/index.d.ts",
6+
"private": true,
7+
"workspaces": [
8+
"packages/*"
9+
],
810
"scripts": {
9-
"build": "tsc",
10-
"dev": "tsc --watch",
11-
"clean": "rm -rf dist",
12-
"type-check": "tsc --noEmit"
13-
},
14-
"dependencies": {
15-
"@objectstack/spec": "^0.3.3"
11+
"build": "npm run build --workspaces",
12+
"build:core": "npm run build -w @objectstack-starter/core",
13+
"build:examples": "npm run build -w @objectstack-starter/examples",
14+
"dev": "npm run dev --workspaces --if-present",
15+
"clean": "npm run clean --workspaces --if-present",
16+
"type-check": "npm run type-check --workspaces",
17+
"example:basic": "npm run example:basic -w @objectstack-starter/examples",
18+
"example:ecommerce": "npm run example:ecommerce -w @objectstack-starter/examples",
19+
"example:blog": "npm run example:blog -w @objectstack-starter/examples",
20+
"example:crm": "npm run example:crm -w @objectstack-starter/examples"
1621
},
1722
"devDependencies": {
1823
"@types/node": "^20.10.0",
@@ -25,7 +30,8 @@
2530
"objectstack",
2631
"low-code",
2732
"metadata-driven",
28-
"starter-template"
33+
"starter-template",
34+
"monorepo"
2935
],
3036
"license": "MIT"
3137
}

‎packages/core/README.md‎

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
# @objectstack-starter/core
2+
3+
Core package for ObjectStack Starter - includes base objects and views for task and contact management.
4+
5+
## What's Included
6+
7+
### Data Objects
8+
9+
- **Project Task** (`project_task`) - Task management with status, priority, assignments, and time tracking
10+
- **Contact** (`contact`) - Contact management with CRM capabilities
11+
12+
### UI Views
13+
14+
- **Task Views**
15+
- Grid view for task lists
16+
- Kanban board for visual task management
17+
- **Contact Views**
18+
- Grid view for contact management
19+
- **App Definition** - Main application structure and navigation
20+
21+
## Installation
22+
23+
```bash
24+
npm install @objectstack-starter/core
25+
```
26+
27+
## Usage
28+
29+
```typescript
30+
import {
31+
config,
32+
projectTaskObject,
33+
contactObject,
34+
taskListView,
35+
taskKanbanView,
36+
contactListView,
37+
mainApp
38+
} from '@objectstack-starter/core';
39+
40+
console.log('Task Fields:', Object.keys(projectTaskObject.fields));
41+
console.log('Contact Fields:', Object.keys(contactObject.fields));
42+
```
43+
44+
## API
45+
46+
### Exports
47+
48+
- `config` - ObjectStack manifest configuration
49+
- `projectTaskObject` - Project task data object definition
50+
- `contactObject` - Contact data object definition
51+
- `taskListView` - Task grid view definition
52+
- `taskKanbanView` - Task kanban view definition
53+
- `contactListView` - Contact grid view definition
54+
- `mainApp` - Main application definition
55+
56+
### Type Exports
57+
58+
Re-exports all types from `@objectstack/spec`:
59+
- `Data` - Data Protocol types
60+
- `UI` - UI Protocol types
61+
- `System` - System Protocol types
62+
- `AI` - AI Protocol types
63+
- `API` - API Protocol types
64+
65+
## Development
66+
67+
```bash
68+
# Build the package
69+
npm run build
70+
71+
# Watch mode
72+
npm run dev
73+
74+
# Type checking
75+
npm run type-check
76+
77+
# Clean build artifacts
78+
npm run clean
79+
```
80+
81+
## License
82+
83+
MIT

0 commit comments

Comments
 (0)