.gitignore

@@ -0,0 +1,21 @@
+# build output
+dist/
+# generated types
+.astro/
+
+# dependencies
+node_modules/
+
+# logs
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+
+
+# environment variables
+.env
+.env.production
+
+# macOS-specific files
+.DS_Store

.vscode/extensions.json

@@ -0,0 +1,4 @@
+{
+  "recommendations": ["astro-build.astro-vscode"],
+  "unwantedRecommendations": []
+}

.vscode/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "command": "./node_modules/.bin/astro dev",
+      "name": "Development server",
+      "request": "launch",
+      "type": "node-terminal"
+    }
+  ]
+}

README.md

@@ -0,0 +1,54 @@
+# Starlight Starter Kit: Basics
+
+[![Built with Starlight](https://astro.badg.es/v2/built-with-starlight/tiny.svg)](https://starlight.astro.build)
+
+```
+npm create astro@latest -- --template starlight
+```
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/starlight/tree/main/examples/basics)
+[![Open with CodeSandbox](https://assets.codesandbox.io/github/button-edit-lime.svg)](https://codesandbox.io/p/sandbox/github/withastro/starlight/tree/main/examples/basics)
+[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/withastro/starlight&create_from_path=examples/basics)
+[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fwithastro%2Fstarlight%2Ftree%2Fmain%2Fexamples%2Fbasics&project-name=my-starlight-docs&repository-name=my-starlight-docs)
+
+> 🧑‍🚀 **Seasoned astronaut?** Delete this file. Have fun!
+
+## 🚀 Project Structure
+
+Inside of your Astro + Starlight project, you'll see the following folders and files:
+
+```
+.
+├── public/
+├── src/
+│   ├── assets/
+│   ├── content/
+│   │   ├── docs/
+│   └── content.config.ts
+├── astro.config.mjs
+├── package.json
+└── tsconfig.json
+```
+
+Starlight looks for `.md` or `.mdx` files in the `src/content/docs/` directory. Each file is exposed as a route based on its file name.
+
+Images can be added to `src/assets/` and embedded in Markdown with a relative link.
+
+Static assets, like favicons, can be placed in the `public/` directory.
+
+## 🧞 Commands
+
+All commands are run from the root of the project, from a terminal:
+
+| Command                   | Action                                           |
+| :------------------------ | :----------------------------------------------- |
+| `npm install`             | Installs dependencies                            |
+| `npm run dev`             | Starts local dev server at `localhost:4321`      |
+| `npm run build`           | Build your production site to `./dist/`          |
+| `npm run preview`         | Preview your build locally, before deploying     |
+| `npm run astro ...`       | Run CLI commands like `astro add`, `astro check` |
+| `npm run astro -- --help` | Get help using the Astro CLI                     |
+
+## 👀 Want to learn more?
+
+Check out [Starlight’s docs](https://starlight.astro.build/), read [the Astro documentation](https://docs.astro.build), or jump into the [Astro Discord server](https://astro.build/chat).

astro.config.mjs

@@ -0,0 +1,53 @@
+// @ts-check
+import { defineConfig } from 'astro/config';
+import starlight from '@astrojs/starlight';
+
+// https://astro.build/config
+export default defineConfig({
+	site: 'https://selfhost-hub.com',
+	integrations: [
+		starlight({
+			title: 'SelfHost-Hub',
+			social: [{ icon: 'github', label: 'GitHub', href: 'https://github.com/songtianlun/selfhost-hub' }],
+			sidebar: [
+				{
+					label: 'Tools',
+					autogenerate: { directory: 'tools' },
+				},
+				{
+					label: 'Services',
+					autogenerate: { directory: 'services' },
+				},
+				{
+					label: 'Guides',
+					items: [
+						// Each item here is one entry in the navigation menu.
+						{ label: 'Example Guide', slug: 'guides/example' },
+					],
+				},
+				{
+					label: 'Reference',
+					autogenerate: { directory: 'reference' },
+				},
+			],
+			defaultLocale: 'root',
+			locales: {
+				// 简体中文文档在 `src/content/docs/` 中。
+				root: {
+					label: '简体中文',
+					lang: 'zh-CN',
+				},
+				// en in `src/content/docs/en/`
+				'en': {
+					label: 'English',
+					lang: 'en',
+				},
+				// 简体中文文档在 `src/content/docs/zh-cn/` 中。
+				// 'zh-cn': {
+				//   label: '简体中文',
+				//   lang: 'zh-CN',
+				// },
+			  },
+		}),
+	],
+});

docs/blog/index.md

@@ -1,2 +0,0 @@
-# Blog
-

docs/index.md

@@ -1,17 +0,0 @@
-# Welcome to MkDocs
-
-For full documentation visit [mkdocs.org](https://www.mkdocs.org).
-
-## Commands
-
-* `mkdocs new [dir-name]` - Create a new project.
-* `mkdocs serve` - Start the live-reloading docs server.
-* `mkdocs build` - Build the documentation site.
-* `mkdocs -h` - Print help message and exit.
-
-## Project layout
-
-    mkdocs.yml    # The configuration file.
-    docs/
-        index.md  # The documentation homepage.
-        ...       # Other markdown pages, images and other files.

docs/services/analytics/plausible.md

@@ -1,11 +0,0 @@
----
-title: Plausible Analytics
-tags:
-  - Analytics
-  #  - Self-hosted
-  - Docker
-  #  - Privacy-focused
----
-
-Plausible Analytics 是一款注重隐私的开源网站分析工具...
-

docs/services/networking/.meta.yml

@@ -1,5 +0,0 @@
-# docs/services/networking/.meta.yml
-tags:
-  - Networking
-  - Self-hosted
-

docs/tutorials/posts/build-home-theater.md

@@ -1,18 +0,0 @@
----
-date: 2024-01-15 # 文章发布日期，必需
-title: 如何搭建开源家庭影院 # 文章标题 (也可通过 H1 标题自动获取)
-categories:
-  - 家庭影院
-  - 教程
-tags:
-  - Jellyfin
-  - Docker
-  - Raspberry Pi
-authors:
-  - john_doe # 作者 ID (需在.authors.yml 中定义)
----
-
-# 如何搭建开源家庭影院
-
-本文将介绍如何使用 Jellyfin...
-

mkdocs.yml

@@ -1,66 +0,0 @@
-# yaml-language-server: $schema=https://squidfunk.github.io/mkdocs-material/schema.json
-site_name: SelfHost-Hub
-site_url: https://selfhost-hub.com
-theme:
-  name: material
-  language: zh
-  logo: assets/logo.png
-  favicon: assets/favicon.ico
-  palette: 
-    # Palette toggle for automatic mode
-    - media: "(prefers-color-scheme)"
-      toggle:
-        icon: material/brightness-auto
-        name: Switch to light mode
-    - scheme: default # 浅色模式配置
-      media: "(prefers-color-scheme: light)"
-      primary: brown
-      accent: deep orange
-      toggle: # 切换按钮配置
-        icon: material/weather-night 
-        name: 切换到深色模式
-    - scheme: slate # 深色模式配置
-      media: "(prefers-color-scheme: dark)"
-      primary: black
-      accent: deep purple
-      toggle:
-        icon: material/weather-sunny
-        name: 切换到浅色模式
-  features:
-    # 启用 Section Index Pages 功能 。这允许将一个 index.md 文件直接关联到一个导航分区
-    - navigation.indexes
-plugins:
-  - tags
-  - blog
-  - rss:
-      match_path: tutorials/posts/.* # 仅包含教程/博客文章
-      date_from_meta:
-        as_creation: date # 使用文章的 date front matter 作为发布日期
-      categories: # 在 feed 中包含分类和标签
-        - categories
-        - tags
-extra:
-  alternate:
-    - name: 简体中文
-      link: /
-      lang: zh
-    - name: English
-      link: /en/ 
-      lang: en
-nav:
-  - 首页: index.md
-  - 服务:
-    - services/index.md # 服务板块索引页
-    - 分析工具:
-      - services/analytics/index.md # 分类索引页 (可选)
-      - Plausible: services/analytics/plausible.md
-      - Umami: services/analytics/umami.md
-    - 网络工具:
-      - services/networking/index.md # 分类索引页 (可选)
-      - ZeroTier: services/networking/zerotier.md
-      - Tailscale: services/networking/tailscale.md
-  - 教程与博客:
-    - tutorials/index.md # 博客索引页 (通常由 blog 插件自动处理)
-    - 搭建家庭影院: tutorials/posts/build-home-theater.md
-  - 标签索引: tags.md
-  - 致谢: acknowledgements.md

package.json

@@ -1,9 +1,17 @@
 {
-  "name": "mkdocs",
-  "version": "1.0.0",
-  "private": true,
+  "name": "selfhost-hub",
+  "type": "module",
+  "version": "0.0.1",
   "scripts": {
-    "dev": "mkdocs serve",
-    "build": "python3 -m mkdocs build -d public"
+    "dev": "astro dev",
+    "start": "astro dev",
+    "build": "astro build",
+    "preview": "astro preview",
+    "astro": "astro"
+  },
+  "dependencies": {
+    "@astrojs/starlight": "^0.33.0",
+    "astro": "^5.5.3",
+    "sharp": "^0.32.5"
   }
 }

public/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><path fill-rule="evenodd" d="M81 36 64 0 47 36l-1 2-9-10a6 6 0 0 0-9 9l10 10h-2L0 64l36 17h2L28 91a6 6 0 1 0 9 9l9-10 1 2 17 36 17-36v-2l9 10a6 6 0 1 0 9-9l-9-9 2-1 36-17-36-17-2-1 9-9a6 6 0 1 0-9-9l-9 10v-2Zm-17 2-2 5c-4 8-11 15-19 19l-5 2 5 2c8 4 15 11 19 19l2 5 2-5c4-8 11-15 19-19l5-2-5-2c-8-4-15-11-19-19l-2-5Z" clip-rule="evenodd"/><path d="M118 19a6 6 0 0 0-9-9l-3 3a6 6 0 1 0 9 9l3-3Zm-96 4c-2 2-6 2-9 0l-3-3a6 6 0 1 1 9-9l3 3c3 2 3 6 0 9Zm0 82c-2-2-6-2-9 0l-3 3a6 6 0 1 0 9 9l3-3c3-2 3-6 0-9Zm96 4a6 6 0 0 1-9 9l-3-3a6 6 0 1 1 9-9l3 3Z"/><style>path{fill:#000}@media (prefers-color-scheme:dark){path{fill:#fff}}</style></svg>

requirements.txt

@@ -1,6 +0,0 @@
-mkdocs
-mkdocs-material
-mkdocs-rss-plugin
-#Add pip package if needed
-#mkdocs-bootswatch
-#mkdocs-minify-plugin

src/content.config.ts

@@ -0,0 +1,7 @@
+import { defineCollection } from 'astro:content';
+import { docsLoader } from '@astrojs/starlight/loaders';
+import { docsSchema } from '@astrojs/starlight/schema';
+
+export const collections = {
+	docs: defineCollection({ loader: docsLoader(), schema: docsSchema() }),
+};

src/content/docs/guides/example.md

@@ -0,0 +1,11 @@
+---
+title: Example Guide
+description: A guide in my new Starlight docs site.
+---
+
+Guides lead a user through a specific task they want to accomplish, often with a sequence of steps.
+Writing a good guide requires thinking about what your users are trying to do.
+
+## Further reading
+
+- Read [about how-to guides](https://diataxis.fr/how-to-guides/) in the Diátaxis framework

src/content/docs/index.mdx

@@ -0,0 +1,36 @@
+---
+title: Welcome to Starlight
+description: Get started building your docs site with Starlight.
+template: splash
+hero:
+  tagline: Congrats on setting up a new Starlight project!
+  image:
+    file: ../../assets/houston.webp
+  actions:
+    - text: Example Guide
+      link: /guides/example/
+      icon: right-arrow
+    - text: Read the Starlight docs
+      link: https://starlight.astro.build
+      icon: external
+      variant: minimal
+---
+
+import { Card, CardGrid } from '@astrojs/starlight/components';
+
+## Next steps
+
+<CardGrid stagger>
+	<Card title="Update content" icon="pencil">
+		Edit `src/content/docs/index.mdx` to see this page change.
+	</Card>
+	<Card title="Add new content" icon="add-document">
+		Add Markdown or MDX files to `src/content/docs` to create new pages.
+	</Card>
+	<Card title="Configure your site" icon="setting">
+		Edit your `sidebar` and other config in `astro.config.mjs`.
+	</Card>
+	<Card title="Read the docs" icon="open-book">
+		Learn more in [the Starlight Docs](https://starlight.astro.build/).
+	</Card>
+</CardGrid>

src/content/docs/reference/example.md

@@ -0,0 +1,13 @@
+---
+title: Example Reference
+description: A reference page in my new Starlight docs site.
+---
+
+Reference pages are ideal for outlining how things work in terse and clear terms.
+Less concerned with telling a story or addressing a specific use case, they should give a comprehensive outline of what you're documenting.
+
+## Further reading
+
+- Read [about reference](https://diataxis.fr/reference/) in the Diátaxis framework
+
+- [Awesome-Selfhosted](https://github.com/awesome-selfhosted/awesome-selfhosted)

src/content/docs/services/umami.md

@@ -0,0 +1,15 @@
+---
+title: Umami
+description: A guide in my new Starlight docs site.
+sidebar:
+    badge:
+        text: Docker
+        variant: tip
+---
+
+Guides lead a user through a specific task they want to accomplish, often with a sequence of steps.
+Writing a good guide requires thinking about what your users are trying to do.
+
+## Further reading
+
+- Read [about how-to guides](https://diataxis.fr/how-to-guides/) in the Diátaxis framework

src/content/docs/tools/docker.md

@@ -0,0 +1,14 @@
+---
+title: Docker
+description: A guide in my new Starlight docs site.
+badge:
+    text: New
+    variant: tip
+---
+
+Guides lead a user through a specific task they want to accomplish, often with a sequence of steps.
+Writing a good guide requires thinking about what your users are trying to do.
+
+## Further reading
+
+- Read [about how-to guides](https://diataxis.fr/how-to-guides/) in the Diátaxis framework

src/content/docs/tools/example.md

@@ -0,0 +1,11 @@
+---
+title: Example Guide
+description: A guide in my new Starlight docs site.
+---
+
+Guides lead a user through a specific task they want to accomplish, often with a sequence of steps.
+Writing a good guide requires thinking about what your users are trying to do.
+
+## Further reading
+
+- Read [about how-to guides](https://diataxis.fr/how-to-guides/) in the Diátaxis framework

tsconfig.json

@@ -0,0 +1,5 @@
+{
+  "extends": "astro/tsconfigs/strict",
+  "include": [".astro/types.d.ts", "**/*"],
+  "exclude": ["dist"]
+}