AI学习教程网站

基于 Docusaurus 构建的AI学习与工具使用教程网站。

npm install

npm start

访问 http://localhost:3000 查看网站。

npm run build

构建后的文件在 build 目录中。

npm run serve

tutorial-site/
├── docs/                    # 文档目录
│   ├── ai-learning/        # AI学习教程
│   └── tools/              # 工具使用指南
├── blog/                    # 博客文章
├── src/
│   ├── components/         # React 组件
│   │   ├── AdSlot/        # 广告插槽组件
│   │   └── HomepageFeatures/
│   ├── css/                # 自定义样式
│   └── pages/             # 页面组件
├── static/                 # 静态资源
├── docusaurus.config.ts    # Docusaurus 配置
└── sidebars.ts            # 侧边栏配置

1. 在 docs/ 目录下创建 Markdown 文件
2. 更新 sidebars.ts 配置侧边栏

使用 Notion 作为内容管理系统，自动同步到 Docusaurus：

1. 设置 Notion Integration

   • 访问 https://www.notion.so/my-integrations
   • 创建新的 Integration，获取 Token

2. 配置环境变量

   cp env.example .env
   # 编辑 .env 文件，填入你的 NOTION_TOKEN 和 NOTION_ROOT_PAGE_ID

3. 运行同步命令

   npm run sync:notion
   # 或使用 npx 直接运行
   npm run sync:notion:npx

4. 查看详细文档

   • 阅读 notion-sync.md 了解完整配置步骤
   • 支持自动化同步（GitHub Actions）

在 blog/ 目录下创建 Markdown 文件，文件名格式：YYYY-MM-DD-title.md

在 MDX 文件中：

import AdSlot from '@site/src/components/AdSlot';

<AdSlot position="sidebar" enabled={true} />

详细使用说明请查看 src/components/AdSlot/README.md

编辑 docusaurus.config.ts：

• title - 网站标题
• tagline - 网站标语
• url - 网站URL
• baseUrl - 基础路径

1. 复制 ads.config.example.ts 为 ads.config.ts
2. 填入你的广告代码
3. 在文档中使用 AdSlot 组件

• AI基础入门
• 机器学习实战
• 深度学习进阶

• Git使用指南
• VS Code配置
• Docker入门

本项目支持从 Notion 自动同步内容到 Docusaurus，让你可以：

• ✅ 在 Notion 中编写和管理内容
• ✅ 自动转换为 Markdown 格式
• ✅ 保留页面层级结构
• ✅ 支持自动化同步（GitHub Actions）

详细说明请查看: notion-sync.md

• Docusaurus - 文档网站框架
• React - UI框架
• TypeScript - 类型支持
• Markdown/MDX - 内容编写

• Docusaurus 文档
• Docusaurus 博客

MIT