Skip to content

Commit b530c1a

Browse files
Add multi-root documentation structure with sidebar tabs navigation
Co-authored-by: xuyushun441-sys <255036401+xuyushun441-sys@users.noreply.github.com>
1 parent 3acc2c5 commit b530c1a

5 files changed

Lines changed: 168 additions & 4 deletions

File tree

MULTI_ROOT_STRUCTURE.md

Lines changed: 164 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
# Multi-Root Documentation Structure
2+
3+
This documentation site uses a **multi-root structure** powered by Fumadocs, allowing different documentation sections to be organized independently while providing seamless navigation between them.
4+
5+
## Overview
6+
7+
The site is organized into three independent documentation roots:
8+
9+
### 1. **Framework** (`/framework`)
10+
- **Purpose**: Core ObjectStack framework documentation
11+
- **Content**: Complete technical specification for ObjectStack platform
12+
- **Sections**:
13+
- Concepts (Architecture, Core Values, Enterprise Patterns)
14+
- Creator Layer (SDK, CLI)
15+
- Governance Layer (Deployment)
16+
- Execution Layer (ObjectQL, ObjectUI, ObjectOS)
17+
- Specifications
18+
19+
### 2. **Guides** (`/guides`)
20+
- **Purpose**: Practical tutorials and step-by-step guides
21+
- **Content**: How-to guides for building with ObjectStack
22+
- **Planned Sections**:
23+
- Getting Started Tutorial
24+
- Building Your First Application
25+
- Advanced Patterns and Best Practices
26+
- Integration Guides
27+
- Migration Guides
28+
29+
### 3. **API** (`/api`)
30+
- **Purpose**: Complete API reference documentation
31+
- **Content**: Detailed API documentation for all components
32+
- **Planned Sections**:
33+
- ObjectQL API Reference
34+
- ObjectUI API Reference
35+
- ObjectOS API Reference
36+
- Protocol Specifications
37+
- SDK Documentation
38+
39+
## Directory Structure
40+
41+
```
42+
content/
43+
├── docs/ # Legacy docs (kept for backward compatibility)
44+
├── framework/ # Framework documentation root
45+
│ ├── concepts/
46+
│ ├── creator-layer/
47+
│ ├── governance-layer/
48+
│ ├── execution-layer/
49+
│ └── specifications/
50+
├── guides/ # Guides documentation root
51+
│ └── index.mdx
52+
└── api/ # API documentation root
53+
└── index.mdx
54+
55+
packages/site/
56+
└── app/[lang]/
57+
├── docs/ # Legacy docs route
58+
├── framework/ # Framework route
59+
├── guides/ # Guides route
60+
└── api/ # API route
61+
```
62+
63+
## Technical Implementation
64+
65+
### Source Configuration
66+
67+
Each root has its own source loader defined in `packages/site/lib/source.ts`:
68+
69+
```typescript
70+
// Framework source
71+
export const frameworkSource$ = loader({
72+
baseUrl: '/framework',
73+
source: { files: [...frameworkSource.files] },
74+
i18n,
75+
});
76+
77+
// Guides source
78+
export const guidesSource$ = loader({
79+
baseUrl: '/guides',
80+
source: { files: [...guidesSource.files] },
81+
i18n,
82+
});
83+
84+
// API source
85+
export const apiSource$ = loader({
86+
baseUrl: '/api',
87+
source: { files: [...apiSource.files] },
88+
i18n,
89+
});
90+
```
91+
92+
### Sidebar Tabs
93+
94+
The sidebar tabs enable navigation between roots. Configuration in `docs.site.json`:
95+
96+
```json
97+
{
98+
"layout": {
99+
"sidebar": {
100+
"tabs": [
101+
{
102+
"title": "Framework",
103+
"url": "/framework",
104+
"description": "ObjectStack Framework Documentation"
105+
},
106+
{
107+
"title": "Guides",
108+
"url": "/guides",
109+
"description": "Practical guides and tutorials"
110+
},
111+
{
112+
"title": "API",
113+
"url": "/api",
114+
"description": "Complete API reference"
115+
}
116+
]
117+
}
118+
}
119+
}
120+
```
121+
122+
### Routes
123+
124+
Each root has its own Next.js App Router structure:
125+
126+
- `/[lang]/framework/[[...slug]]/page.tsx` - Framework pages
127+
- `/[lang]/guides/[[...slug]]/page.tsx` - Guides pages
128+
- `/[lang]/api/[[...slug]]/page.tsx` - API pages
129+
130+
## Adding Content
131+
132+
### Adding to Framework
133+
134+
Add MDX files to `content/framework/` and update the corresponding `meta.json` files.
135+
136+
### Adding to Guides
137+
138+
Add MDX files to `content/guides/` and update `meta.json`.
139+
140+
### Adding to API
141+
142+
Add MDX files to `content/api/` and update `meta.json`.
143+
144+
## Benefits
145+
146+
1. **Separation of Concerns**: Different documentation types are cleanly separated
147+
2. **Independent Navigation**: Each root has its own navigation tree
148+
3. **Scalability**: Easy to add new documentation roots in the future
149+
4. **Maintainability**: Clear structure makes it easier to maintain large documentation sets
150+
5. **User Experience**: Tab-based navigation provides intuitive switching between sections
151+
152+
## Migration Notes
153+
154+
- The legacy `/docs` route is maintained for backward compatibility
155+
- Existing documentation has been copied to `/framework`
156+
- New content should be added to the appropriate root
157+
158+
## Future Expansion
159+
160+
The multi-root structure can easily accommodate additional documentation sections:
161+
- **Examples** - Code examples and demos
162+
- **Blog** - Technical blog posts and updates
163+
- **Community** - Community guides and contributions
164+
- **Changelog** - Version history and release notes

packages/site/app/[lang]/api/layout.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export default async function Layout({
3434
tabs: siteConfig.layout.sidebar.tabs && siteConfig.layout.sidebar.tabs.length > 0 ?
3535
siteConfig.layout.sidebar.tabs.map(tab => ({
3636
title: tab.title,
37-
url: tab.url,
37+
url: `/${lang}${tab.url}`,
3838
description: tab.description,
3939
})) : undefined,
4040
banner: siteConfig.layout.sidebar.banner ? (

packages/site/app/[lang]/docs/layout.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export default async function Layout({
3434
tabs: siteConfig.layout.sidebar.tabs && siteConfig.layout.sidebar.tabs.length > 0 ?
3535
siteConfig.layout.sidebar.tabs.map(tab => ({
3636
title: tab.title,
37-
url: tab.url,
37+
url: `/${lang}${tab.url}`,
3838
description: tab.description,
3939
})) : undefined,
4040
banner: siteConfig.layout.sidebar.banner ? (

packages/site/app/[lang]/framework/layout.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export default async function Layout({
3434
tabs: siteConfig.layout.sidebar.tabs && siteConfig.layout.sidebar.tabs.length > 0 ?
3535
siteConfig.layout.sidebar.tabs.map(tab => ({
3636
title: tab.title,
37-
url: tab.url,
37+
url: `/${lang}${tab.url}`,
3838
description: tab.description,
3939
})) : undefined,
4040
banner: siteConfig.layout.sidebar.banner ? (

packages/site/app/[lang]/guides/layout.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export default async function Layout({
3434
tabs: siteConfig.layout.sidebar.tabs && siteConfig.layout.sidebar.tabs.length > 0 ?
3535
siteConfig.layout.sidebar.tabs.map(tab => ({
3636
title: tab.title,
37-
url: tab.url,
37+
url: `/${lang}${tab.url}`,
3838
description: tab.description,
3939
})) : undefined,
4040
banner: siteConfig.layout.sidebar.banner ? (

0 commit comments

Comments
 (0)