Understanding the KubeStellar Documentation Architecture
Overview
This documentation website is a separate repository from the main KubeStellar codebase. All the active documentation is now located in this repository. For safety reasons, copies of the docs source may remain in a to-be-deleted folder in the component repositories during a transition period
CODE is in the component repositories
┌─────────────────────────────────────────────────────────────┐
│ Main KubeStellar Repository │
│ github.com/kubestellar/kubestellar │
│ 🗄️kubestellar/ │
│ ├📁 docs/ ← NOT THE ACTIVE DOCS |
| ├──README.md |
| └──content/to-be-deleted │
│ ├── readme.md │
│ ├── architecture.md │
│ ├── direct/ │
│ ├── binding.md │
│ ├── wds.md │
│ └── ... (all previous documentation content) │
│ └── ...(all the active components of the component repo) |
└─────────────────────────────────────────────────────────────┘
DOCUMENTATION/WEBSITE is in the docs repository
┌────────────────────────────────────────────────────────────────|
│ Docs Website Repository (THIS REPO) │
│ github.com/kubestellar/docs |
| │
│ 🗄️docs/ ← this repository root folder │
| ├ 📁 docs/ ← raw MD content source moved from repos |
| | 📁content/ |
| | 📁 a2a/ |
| | 📁 dommon-subs/ |
| | 📁 Community/ |
| | 📁 console/ |
| | 📁 contribution-guidelines/ |
| | 📁 icons/ |
| | 📁 images/ |
| | 📁 klaude/ |
| | 📁 kubeflex/ |
| | 📁 kubestellar/ |
| | 📁 multi-plugin/ |
| | 📁 ui-docs/ |
| | 📁images/ ← image folder for some of the MD files |
| | 📁overrides/ ← master mkdocs layouts (legacy ref only) |
| ├📁 messages ← alternate language files for NEW pages |
| ├📁 src/ ← Source for NEW pages, site nav and layout |
| | ├📁 app/ |
| | | ├📁 docs/ ← layouts to apply to component docs pages |
| | | ├── 📄page-map.ts ← Defines navigation structure │
│ | | ├── 📄layout.tsx ← Nextra theme integration │
| | | └── 📄page.mdx ← Nextra page master │
| | ├📁 components/ │
| | ├📁 config/ │
| | ├📁 hooks/ │
| | ├📁 i18n/ ← configures language support |
| | ├📁 lib/ │
| ├📄CONTRIBUTING.md <----- this file |
| ├📄GOVERNANCE.md |
| ├📄 next.config.ts ← Nextra configuration │
| ├📄 mdx-components.js ← MDX component mappings |
| └── ... (various node.js and next.js etc files) │
└────────────────────────────────────────────────────────────────┘
↓
(Built & Deployed)
↓
┌─────────────────────────────────────────────────────────────┐
│ Live Documentation Website │
│ https://kubestellar.io │
└─────────────────────────────────────────────────────────────┘
Important Concepts:
- ✅ Content is contained in docs/content filetree (this does not generate the navigation)
- ✅ Navigation is defined in
page-map.ts(not auto-generated from files)
How Nextra Integration Works
This documentation site is built using Nextra, a powerful Next.js-based documentation framework that provides:
- Static Site Generation (SSG) for fast loading
- MDX Support for rich, interactive documentation
- Built-in Search functionality
- Theme Customization with dark/light modes
- Automatic Navigation generation
Key Files and Their Roles
-
next.config.ts- Main configuration file that:- Imports and configures Nextra with
nextra()function - Enables LaTeX support for mathematical expressions
- Configures search settings
- Integrates with
next-intlfor internationalization - Sets up redirects for various KubeStellar links
- Imports and configures Nextra with
-
src/app/docs/layout.tsx- Docs layout component that:- Imports
Layoutfromnextra-theme-docs - Imports the Nextra theme styles
- Configures custom navbar, footer, and banner components
- Sets up the sidebar with page map and repository links
- Enables dark mode and collapsible sidebar sections
- Imports
-
src/app/docs/page-map.ts- Navigation structure builder that:- Defines the documentation navigation structure in
NAV_STRUCTURE - Reads documentation files from the local
/docs/content/directory - Constructs hierarchical navigation from the defined structure
- Generates routes for each documentation page
- Creates a mapping between file paths and URL routes
- Note: The file tree structure in /docs/content roughly parallels the navigation created in pagemap.ts but is not identical. As the new site matures many of the differences will be smoothed out
- Using the page-map rather than file structure to generate the
NAV_STRUCTUREsimplifies changing menus for different locales (languages)
- Defines the documentation navigation structure in
-
src/app/docs/[...slug]/page.tsx- Dynamic page renderer that:- Reads MDX and MD content from the local
/docs/content/directory - Compiles and evaluates MDX with custom components
- Processes Jekyll-style includes and template variables
- Supports Mermaid diagrams and custom components
- Handles image path resolution and markdown transformations
- Reads MDX and MD content from the local
-
mdx-components.js- Component mapping file that:- Exports MDX components from Nextra theme
- Allows customization of how markdown elements render
- Enables adding custom React components to MDX files
This page is an import of part of github.com/kubestellar/docs/CONTRIBUTING.md . The complete file is viewable there, or on the Detailed Contribution Guide page in this section of the website. Changes to this page content must be made in CONTRIBUTING.md on GitHub