feat: 自动化项目丰富 - 添加 CI/CD、实战案例和提示词

## 新增内容

### GitHub Actions 工作流
- ci.yml: Markdown lint、链接检查、项目结构验证
- welcome.yml: 自动欢迎新贡献者
- labeler.yml: PR 自动标签

### Issue 模板
- prompt_contribution.md: 提示词贡献模板
- documentation.md: 文档改进模板
- config.yml: 模板配置（含社区链接）

### 实战案例
- 02-blog-system.md: 个人博客系统（Next.js + MDX）
- 04-cli-tool.md: 命令行工具（Python + Click）
- 05-chrome-extension.md: Chrome 扩展（网页笔记助手）

### 编程提示词
- debug-expert.md: 调试专家提示词
- code-review.md: 代码审查提示词
- architecture-design.md: 架构设计提示词

## 相关 Issues
- #5 完善 Wiki 文档
- #6 添加更多实战案例
- #7 扩充提示词库
- #8 激活社区讨论

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,11 @@
+blank_issues_enabled: true
+contact_links:
+  - name: 💬 Telegram 交流群
+    url: https://t.me/glue_coding
+    about: 加入我们的 Telegram 群组讨论问题
+  - name: 📢 Telegram 频道
+    url: https://t.me/tradecat_ai_channel
+    about: 关注项目更新和资讯
+  - name: 📖 在线提示词表格
+    url: https://docs.google.com/spreadsheets/d/1ngoQOhJqdguwNAilCl1joNwTje7FWWN9WiI2bo5VhpU/edit?gid=2093180351
+    about: 查看和使用提示词库

.github/ISSUE_TEMPLATE/documentation.md

@@ -0,0 +1,29 @@
+---
+name: 文档改进
+about: 报告文档问题或建议改进
+title: "[Docs]: "
+labels: documentation
+assignees: ''
+
+---
+
+**文档位置**
+请提供需要改进的文档路径或链接。
+
+**问题类型**
+- [ ] 内容错误
+- [ ] 内容过时
+- [ ] 内容缺失
+- [ ] 表述不清
+- [ ] 链接失效
+- [ ] 格式问题
+- [ ] 翻译问题
+
+**问题描述**
+清晰描述文档存在的问题。
+
+**建议改进**
+如果有具体的改进建议，请在此描述。
+
+**附加信息**
+任何其他相关信息。

.github/ISSUE_TEMPLATE/prompt_contribution.md

@@ -0,0 +1,38 @@
+---
+name: 提示词贡献
+about: 分享一个有用的提示词
+title: "[Prompt]: "
+labels: prompts, contribution
+assignees: ''
+
+---
+
+**提示词名称**
+给这个提示词起一个简洁的名字。
+
+**提示词分类**
+- [ ] 系统提示词 (system_prompts)
+- [ ] 编程提示词 (coding_prompts)
+- [ ] 用户提示词 (user_prompts)
+- [ ] 辅助提示词 (assistant_prompts)
+- [ ] 元提示词 (meta_prompts)
+
+**提示词内容**
+```
+在这里粘贴你的提示词内容
+```
+
+**使用场景**
+描述这个提示词适用于什么场景。
+
+**效果示例**
+如果可能，提供使用这个提示词的效果示例或截图。
+
+**适用模型**
+- [ ] Claude
+- [ ] GPT
+- [ ] Gemini
+- [ ] 其他: ___
+
+**附加说明**
+任何其他需要说明的内容。

.github/labeler.yml

@@ -0,0 +1,45 @@
+# 文档相关
+documentation:
+  - changed-files:
+      - any-glob-to-any-file:
+          - '**/*.md'
+          - 'docs/**'
+          - 'i18n/**/documents/**'
+
+# 提示词相关
+prompts:
+  - changed-files:
+      - any-glob-to-any-file:
+          - 'i18n/**/prompts/**'
+          - 'libs/external/prompts-library/**'
+
+# 技能相关
+skills:
+  - changed-files:
+      - any-glob-to-any-file:
+          - 'i18n/**/skills/**'
+
+# 工具相关
+tools:
+  - changed-files:
+      - any-glob-to-any-file:
+          - 'libs/**'
+          - 'backups/**'
+
+# 国际化
+i18n:
+  - changed-files:
+      - any-glob-to-any-file:
+          - 'i18n/**'
+
+# CI/CD
+ci:
+  - changed-files:
+      - any-glob-to-any-file:
+          - '.github/**'
+
+# 中文内容
+chinese:
+  - changed-files:
+      - any-glob-to-any-file:
+          - 'i18n/zh/**'

.github/workflows/ci.yml

@@ -0,0 +1,60 @@
+name: CI
+
+on:
+  push:
+    branches: [main, master]
+  pull_request:
+    branches: [main, master]
+
+jobs:
+  lint-markdown:
+    name: Lint Markdown
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+      - name: Install markdownlint-cli
+        run: npm install -g markdownlint-cli
+      - name: Run markdownlint
+        run: markdownlint '**/*.md' --ignore node_modules --ignore libs/external || true
+
+  check-links:
+    name: Check Links
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Link Checker
+        uses: lycheeverse/lychee-action@v1
+        with:
+          args: --verbose --no-progress './**/*.md' --exclude-path libs/external
+          fail: false
+
+  validate-structure:
+    name: Validate Project Structure
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - name: Check required files
+        run: |
+          echo "Checking required files..."
+          files=("README.md" "LICENSE" "CONTRIBUTING.md" "CODE_OF_CONDUCT.md" "AGENTS.md" "CLAUDE.md")
+          for file in "${files[@]}"; do
+            if [ -f "$file" ]; then
+              echo "✓ $file exists"
+            else
+              echo "✗ $file missing"
+            fi
+          done
+      - name: Check i18n structure
+        run: |
+          echo "Checking i18n directories..."
+          for lang in zh en; do
+            if [ -d "i18n/$lang" ]; then
+              echo "✓ i18n/$lang exists"
+            else
+              echo "✗ i18n/$lang missing"
+            fi
+          done

.github/workflows/labeler.yml

@@ -0,0 +1,16 @@
+name: Auto Labeler
+
+on:
+  pull_request:
+    types: [opened, synchronize]
+
+jobs:
+  label:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      pull-requests: write
+    steps:
+      - uses: actions/labeler@v5
+        with:
+          repo-token: "${{ secrets.GITHUB_TOKEN }}"

.github/workflows/welcome.yml

@@ -0,0 +1,42 @@
+name: Welcome New Contributors
+
+on:
+  issues:
+    types: [opened]
+  pull_request:
+    types: [opened]
+
+jobs:
+  welcome:
+    runs-on: ubuntu-latest
+    permissions:
+      issues: write
+      pull-requests: write
+    steps:
+      - uses: actions/first-interaction@v1
+        with:
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
+          issue-message: |
+            👋 感谢您提交第一个 Issue！
+
+            我们非常重视您的反馈。请确保：
+            - 已阅读 [贡献指南](CONTRIBUTING.md)
+            - 提供了足够的上下文信息
+            - 如果是 Bug，请提供复现步骤
+
+            我们会尽快回复您！🚀
+
+            ---
+            Thanks for opening your first issue! We'll get back to you soon.
+          pr-message: |
+            🎉 感谢您提交第一个 Pull Request！
+
+            这是您对本项目的首次贡献，我们非常感激！请确保：
+            - PR 描述清晰说明了改动内容
+            - 代码符合项目规范
+            - 已更新相关文档（如适用）
+
+            我们会尽快审核您的代码！💪
+
+            ---
+            Thanks for your first PR! We'll review it soon.

i18n/zh/documents/实战案例/02-blog-system.md

@@ -0,0 +1,209 @@
+# 实战案例：个人博客系统
+
+> 难度：⭐⭐ 中等 | 预计时间：2-4 小时 | 技术栈：Next.js + MDX
+
+## 🎯 项目目标
+
+构建一个支持 Markdown 的个人博客系统，具备：
+- 文章列表和详情页
+- 标签分类
+- 代码高亮
+- 响应式设计
+
+## 📋 开始前的准备
+
+### 环境要求
+- Node.js 18+
+- 包管理器（npm/pnpm/yarn）
+
+### 第一步：需求澄清
+
+复制以下提示词给 AI：
+
+```
+我想用 Vibe Coding 的方式开发一个个人博客系统。
+
+技术要求：
+- 框架：Next.js 14 (App Router)
+- 内容：MDX 格式的 Markdown 文章
+- 样式：Tailwind CSS
+- 部署：Vercel
+
+功能需求：
+1. 首页显示文章列表（标题、日期、摘要）
+2. 文章详情页（支持代码高亮）
+3. 标签页面（按标签筛选文章）
+4. 关于页面
+
+请帮我：
+1. 确认技术栈是否合适
+2. 生成项目结构
+3. 一步步指导我完成开发
+
+要求：每完成一步问我是否成功，再继续下一步。
+```
+
+## 🏗️ 项目结构
+
+```
+my-blog/
+├── app/
+│   ├── layout.tsx          # 根布局
+│   ├── page.tsx            # 首页
+│   ├── posts/
+│   │   └── [slug]/
+│   │       └── page.tsx    # 文章详情
+│   ├── tags/
+│   │   └── [tag]/
+│   │       └── page.tsx    # 标签页
+│   └── about/
+│       └── page.tsx        # 关于页
+├── components/
+│   ├── Header.tsx
+│   ├── Footer.tsx
+│   ├── PostCard.tsx
+│   └── MDXContent.tsx
+├── content/
+│   └── posts/              # MDX 文章
+│       ├── hello-world.mdx
+│       └── vibe-coding.mdx
+├── lib/
+│   └── posts.ts            # 文章处理逻辑
+└── tailwind.config.js
+```
+
+## 🔧 核心代码片段
+
+### 文章处理逻辑 (lib/posts.ts)
+
+```typescript
+import fs from 'fs'
+import path from 'path'
+import matter from 'gray-matter'
+
+const postsDirectory = path.join(process.cwd(), 'content/posts')
+
+export interface Post {
+  slug: string
+  title: string
+  date: string
+  tags: string[]
+  excerpt: string
+  content: string
+}
+
+export function getAllPosts(): Post[] {
+  const fileNames = fs.readdirSync(postsDirectory)
+  const posts = fileNames
+    .filter(name => name.endsWith('.mdx'))
+    .map(fileName => {
+      const slug = fileName.replace(/\.mdx$/, '')
+      const fullPath = path.join(postsDirectory, fileName)
+      const fileContents = fs.readFileSync(fullPath, 'utf8')
+      const { data, content } = matter(fileContents)
+      
+      return {
+        slug,
+        title: data.title,
+        date: data.date,
+        tags: data.tags || [],
+        excerpt: data.excerpt || content.slice(0, 150),
+        content
+      }
+    })
+    .sort((a, b) => (a.date < b.date ? 1 : -1))
+  
+  return posts
+}
+
+export function getPostBySlug(slug: string): Post | undefined {
+  return getAllPosts().find(post => post.slug === slug)
+}
+```
+
+### 文章卡片组件 (components/PostCard.tsx)
+
+```tsx
+import Link from 'next/link'
+import { Post } from '@/lib/posts'
+
+export function PostCard({ post }: { post: Post }) {
+  return (
+    <article className="border-b border-gray-200 py-6">
+      <Link href={`/posts/${post.slug}`}>
+        <h2 className="text-xl font-bold hover:text-blue-600">
+          {post.title}
+        </h2>
+      </Link>
+      <time className="text-sm text-gray-500">{post.date}</time>
+      <p className="mt-2 text-gray-600">{post.excerpt}</p>
+      <div className="mt-2 flex gap-2">
+        {post.tags.map(tag => (
+          <Link
+            key={tag}
+            href={`/tags/${tag}`}
+            className="text-xs bg-gray-100 px-2 py-1 rounded hover:bg-gray-200"
+          >
+            #{tag}
+          </Link>
+        ))}
+      </div>
+    </article>
+  )
+}
+```
+
+## 📝 示例文章格式
+
+```mdx
+---
+title: "Hello World"
+date: "2024-01-01"
+tags: ["入门", "博客"]
+excerpt: "这是我的第一篇博客文章"
+---
+
+# Hello World
+
+欢迎来到我的博客！
+
+## 代码示例
+
+```javascript
+console.log('Hello, Vibe Coding!')
+```
+
+## 总结
+
+这就是我的第一篇文章。
+```
+
+## 🚀 部署步骤
+
+1. 推送代码到 GitHub
+2. 在 Vercel 导入项目
+3. 自动部署完成
+
+## ✅ 验收清单
+
+- [ ] 首页正确显示文章列表
+- [ ] 点击文章可以进入详情页
+- [ ] 代码块有语法高亮
+- [ ] 标签页面可以筛选文章
+- [ ] 移动端显示正常
+- [ ] 部署到 Vercel 成功
+
+## 🔗 相关资源
+
+- [Next.js 文档](https://nextjs.org/docs)
+- [MDX 文档](https://mdxjs.com/)
+- [Tailwind CSS](https://tailwindcss.com/)
+
+## 💡 进阶挑战
+
+完成基础版本后，可以尝试：
+- 添加搜索功能
+- 添加评论系统（Giscus）
+- 添加 RSS 订阅
+- 添加暗色模式
+- 添加阅读时间估算

i18n/zh/documents/实战案例/04-cli-tool.md

@@ -0,0 +1,298 @@
+# 实战案例：命令行工具
+
+> 难度：⭐⭐ 中等 | 预计时间：1-2 小时 | 技术栈：Python + Click
+
+## 🎯 项目目标
+
+构建一个实用的命令行工具，实现：
+- 文件批量重命名
+- 支持多种命名规则
+- 预览和确认机制
+- 彩色输出
+
+## 📋 开始前的准备
+
+### 环境要求
+- Python 3.8+
+- pip
+
+### 第一步：需求澄清
+
+复制以下提示词给 AI：
+
+```
+我想用 Vibe Coding 的方式开发一个文件批量重命名的命令行工具。
+
+技术要求：
+- 语言：Python 3.8+
+- CLI 框架：Click
+- 输出美化：Rich
+
+功能需求：
+1. 支持多种重命名规则：
+   - 添加前缀/后缀
+   - 替换文本
+   - 序号命名
+   - 日期命名
+2. 预览模式（不实际执行）
+3. 递归处理子目录（可选）
+4. 支持文件类型过滤
+
+请帮我：
+1. 确认技术栈是否合适
+2. 生成项目结构
+3. 一步步指导我完成开发
+
+要求：每完成一步问我是否成功，再继续下一步。
+```
+
+## 🏗️ 项目结构
+
+```
+file-renamer/
+├── renamer/
+│   ├── __init__.py
+│   ├── cli.py              # CLI 入口
+│   ├── core.py             # 核心逻辑
+│   └── rules.py            # 重命名规则
+├── tests/
+│   └── test_core.py
+├── pyproject.toml
+└── README.md
+```
+
+## 🔧 核心代码
+
+### CLI 入口 (renamer/cli.py)
+
+```python
+import click
+from rich.console import Console
+from rich.table import Table
+from .core import FileRenamer
+from .rules import PrefixRule, SuffixRule, ReplaceRule, SequenceRule
+
+console = Console()
+
+@click.group()
+@click.version_option(version='1.0.0')
+def cli():
+    """文件批量重命名工具"""
+    pass
+
+@cli.command()
+@click.argument('directory', type=click.Path(exists=True))
+@click.option('--prefix', '-p', help='添加前缀')
+@click.option('--suffix', '-s', help='添加后缀')
+@click.option('--replace', '-r', nargs=2, help='替换文本 (旧文本 新文本)')
+@click.option('--sequence', '-n', is_flag=True, help='序号命名')
+@click.option('--ext', '-e', multiple=True, help='文件扩展名过滤')
+@click.option('--recursive', '-R', is_flag=True, help='递归处理子目录')
+@click.option('--dry-run', '-d', is_flag=True, help='预览模式')
+def rename(directory, prefix, suffix, replace, sequence, ext, recursive, dry_run):
+    """批量重命名文件"""
+    renamer = FileRenamer(directory, recursive=recursive, extensions=ext)
+    
+    # 添加规则
+    if prefix:
+        renamer.add_rule(PrefixRule(prefix))
+    if suffix:
+        renamer.add_rule(SuffixRule(suffix))
+    if replace:
+        renamer.add_rule(ReplaceRule(replace[0], replace[1]))
+    if sequence:
+        renamer.add_rule(SequenceRule())
+    
+    if not renamer.rules:
+        console.print("[red]错误：请至少指定一个重命名规则[/red]")
+        return
+    
+    # 获取预览
+    changes = renamer.preview()
+    
+    if not changes:
+        console.print("[yellow]没有找到匹配的文件[/yellow]")
+        return
+    
+    # 显示预览表格
+    table = Table(title="重命名预览")
+    table.add_column("原文件名", style="cyan")
+    table.add_column("新文件名", style="green")
+    
+    for old, new in changes:
+        table.add_row(old, new)
+    
+    console.print(table)
+    console.print(f"\n共 [bold]{len(changes)}[/bold] 个文件")
+    
+    if dry_run:
+        console.print("[yellow]预览模式，未执行实际操作[/yellow]")
+        return
+    
+    # 确认执行
+    if click.confirm('确认执行重命名？'):
+        renamer.execute()
+        console.print("[green]✓ 重命名完成！[/green]")
+    else:
+        console.print("[yellow]已取消[/yellow]")
+
+if __name__ == '__main__':
+    cli()
+```
+
+### 核心逻辑 (renamer/core.py)
+
+```python
+import os
+from pathlib import Path
+from typing import List, Tuple
+
+class FileRenamer:
+    def __init__(self, directory: str, recursive: bool = False, extensions: tuple = ()):
+        self.directory = Path(directory)
+        self.recursive = recursive
+        self.extensions = extensions
+        self.rules = []
+    
+    def add_rule(self, rule):
+        self.rules.append(rule)
+    
+    def get_files(self) -> List[Path]:
+        pattern = '**/*' if self.recursive else '*'
+        files = []
+        for path in self.directory.glob(pattern):
+            if path.is_file():
+                if self.extensions:
+                    if path.suffix.lower() in [f'.{e.lower()}' for e in self.extensions]:
+                        files.append(path)
+                else:
+                    files.append(path)
+        return sorted(files)
+    
+    def apply_rules(self, filename: str) -> str:
+        result = filename
+        for rule in self.rules:
+            result = rule.apply(result)
+        return result
+    
+    def preview(self) -> List[Tuple[str, str]]:
+        changes = []
+        for file in self.get_files():
+            old_name = file.stem
+            new_name = self.apply_rules(old_name)
+            if old_name != new_name:
+                changes.append((file.name, new_name + file.suffix))
+        return changes
+    
+    def execute(self):
+        for file in self.get_files():
+            old_name = file.stem
+            new_name = self.apply_rules(old_name)
+            if old_name != new_name:
+                new_path = file.parent / (new_name + file.suffix)
+                file.rename(new_path)
+```
+
+### 重命名规则 (renamer/rules.py)
+
+```python
+from abc import ABC, abstractmethod
+
+class Rule(ABC):
+    @abstractmethod
+    def apply(self, filename: str) -> str:
+        pass
+
+class PrefixRule(Rule):
+    def __init__(self, prefix: str):
+        self.prefix = prefix
+    
+    def apply(self, filename: str) -> str:
+        return f"{self.prefix}{filename}"
+
+class SuffixRule(Rule):
+    def __init__(self, suffix: str):
+        self.suffix = suffix
+    
+    def apply(self, filename: str) -> str:
+        return f"{filename}{self.suffix}"
+
+class ReplaceRule(Rule):
+    def __init__(self, old: str, new: str):
+        self.old = old
+        self.new = new
+    
+    def apply(self, filename: str) -> str:
+        return filename.replace(self.old, self.new)
+
+class SequenceRule(Rule):
+    def __init__(self, start: int = 1, padding: int = 3):
+        self.counter = start
+        self.padding = padding
+    
+    def apply(self, filename: str) -> str:
+        result = f"{str(self.counter).zfill(self.padding)}_{filename}"
+        self.counter += 1
+        return result
+```
+
+## 📦 安装配置 (pyproject.toml)
+
+```toml
+[build-system]
+requires = ["setuptools>=61.0"]
+build-backend = "setuptools.build_meta"
+
+[project]
+name = "file-renamer"
+version = "1.0.0"
+description = "文件批量重命名工具"
+requires-python = ">=3.8"
+dependencies = [
+    "click>=8.0",
+    "rich>=13.0",
+]
+
+[project.scripts]
+renamer = "renamer.cli:cli"
+```
+
+## 🚀 使用示例
+
+```bash
+# 安装
+pip install -e .
+
+# 添加前缀
+renamer rename ./photos --prefix "2024_"
+
+# 替换文本
+renamer rename ./docs --replace "old" "new"
+
+# 序号命名 + 过滤扩展名
+renamer rename ./images --sequence --ext jpg --ext png
+
+# 预览模式
+renamer rename ./files --prefix "backup_" --dry-run
+
+# 递归处理
+renamer rename ./project --suffix "_v2" --recursive
+```
+
+## ✅ 验收清单
+
+- [ ] 命令行帮助信息正确显示
+- [ ] 前缀/后缀功能正常
+- [ ] 替换功能正常
+- [ ] 序号命名功能正常
+- [ ] 预览模式不执行实际操作
+- [ ] 扩展名过滤正常
+- [ ] 递归处理正常
+
+## 💡 进阶挑战
+
+- 添加撤销功能（记录操作日志）
+- 支持正则表达式
+- 添加日期格式化规则
+- 支持配置文件
+- 添加交互式模式

i18n/zh/documents/实战案例/05-chrome-extension.md

@@ -0,0 +1,402 @@
+# 实战案例：Chrome 扩展
+
+> 难度：⭐⭐ 中等 | 预计时间：2-3 小时 | 技术栈：JavaScript + Chrome API
+
+## 🎯 项目目标
+
+构建一个实用的 Chrome 扩展 - **网页笔记助手**：
+- 选中文本快速保存
+- 自动记录来源 URL
+- 本地存储笔记
+- 导出功能
+
+## 📋 开始前的准备
+
+### 环境要求
+- Chrome 浏览器
+- 代码编辑器
+
+### 第一步：需求澄清
+
+复制以下提示词给 AI：
+
+```
+我想用 Vibe Coding 的方式开发一个 Chrome 扩展 - 网页笔记助手。
+
+技术要求：
+- Manifest V3
+- 纯 JavaScript（不用框架）
+- Chrome Storage API
+
+功能需求：
+1. 右键菜单：选中文本后右键保存
+2. 弹出窗口：显示所有笔记
+3. 自动记录：来源 URL、保存时间
+4. 导出功能：导出为 JSON/Markdown
+
+请帮我：
+1. 确认技术方案
+2. 生成项目结构
+3. 一步步指导我完成开发
+
+要求：每完成一步问我是否成功，再继续下一步。
+```
+
+## 🏗️ 项目结构
+
+```
+web-notes/
+├── manifest.json           # 扩展配置
+├── background.js           # 后台脚本
+├── popup/
+│   ├── popup.html         # 弹出窗口
+│   ├── popup.css
+│   └── popup.js
+├── icons/
+│   ├── icon16.png
+│   ├── icon48.png
+│   └── icon128.png
+└── README.md
+```
+
+## 🔧 核心代码
+
+### 扩展配置 (manifest.json)
+
+```json
+{
+  "manifest_version": 3,
+  "name": "网页笔记助手",
+  "version": "1.0.0",
+  "description": "快速保存网页内容到本地笔记",
+  "permissions": [
+    "storage",
+    "contextMenus",
+    "activeTab"
+  ],
+  "background": {
+    "service_worker": "background.js"
+  },
+  "action": {
+    "default_popup": "popup/popup.html",
+    "default_icon": {
+      "16": "icons/icon16.png",
+      "48": "icons/icon48.png",
+      "128": "icons/icon128.png"
+    }
+  },
+  "icons": {
+    "16": "icons/icon16.png",
+    "48": "icons/icon48.png",
+    "128": "icons/icon128.png"
+  }
+}
+```
+
+### 后台脚本 (background.js)
+
+```javascript
+// 创建右键菜单
+chrome.runtime.onInstalled.addListener(() => {
+  chrome.contextMenus.create({
+    id: 'saveNote',
+    title: '保存到笔记',
+    contexts: ['selection']
+  });
+});
+
+// 处理右键菜单点击
+chrome.contextMenus.onClicked.addListener(async (info, tab) => {
+  if (info.menuItemId === 'saveNote' && info.selectionText) {
+    const note = {
+      id: Date.now().toString(),
+      text: info.selectionText,
+      url: tab.url,
+      title: tab.title,
+      createdAt: new Date().toISOString()
+    };
+    
+    // 获取现有笔记
+    const { notes = [] } = await chrome.storage.local.get('notes');
+    
+    // 添加新笔记
+    notes.unshift(note);
+    
+    // 保存
+    await chrome.storage.local.set({ notes });
+    
+    // 显示通知（可选）
+    console.log('笔记已保存:', note.text.slice(0, 50));
+  }
+});
+```
+
+### 弹出窗口 HTML (popup/popup.html)
+
+```html
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="UTF-8">
+  <link rel="stylesheet" href="popup.css">
+</head>
+<body>
+  <div class="container">
+    <header>
+      <h1>📝 我的笔记</h1>
+      <div class="actions">
+        <button id="exportJson">导出 JSON</button>
+        <button id="exportMd">导出 MD</button>
+        <button id="clearAll">清空</button>
+      </div>
+    </header>
+    
+    <div class="search">
+      <input type="text" id="searchInput" placeholder="搜索笔记...">
+    </div>
+    
+    <div id="notesList" class="notes-list">
+      <!-- 笔记列表 -->
+    </div>
+    
+    <footer>
+      <span id="noteCount">0 条笔记</span>
+    </footer>
+  </div>
+  
+  <script src="popup.js"></script>
+</body>
+</html>
+```
+
+### 弹出窗口样式 (popup/popup.css)
+
+```css
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+
+body {
+  width: 400px;
+  max-height: 500px;
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+}
+
+.container {
+  padding: 16px;
+}
+
+header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 12px;
+}
+
+header h1 {
+  font-size: 18px;
+}
+
+.actions button {
+  padding: 4px 8px;
+  margin-left: 4px;
+  font-size: 12px;
+  cursor: pointer;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  background: #fff;
+}
+
+.actions button:hover {
+  background: #f5f5f5;
+}
+
+.search input {
+  width: 100%;
+  padding: 8px 12px;
+  border: 1px solid #ddd;
+  border-radius: 4px;
+  margin-bottom: 12px;
+}
+
+.notes-list {
+  max-height: 350px;
+  overflow-y: auto;
+}
+
+.note-item {
+  padding: 12px;
+  border: 1px solid #eee;
+  border-radius: 8px;
+  margin-bottom: 8px;
+}
+
+.note-text {
+  font-size: 14px;
+  line-height: 1.5;
+  margin-bottom: 8px;
+}
+
+.note-meta {
+  font-size: 12px;
+  color: #666;
+}
+
+.note-meta a {
+  color: #0066cc;
+  text-decoration: none;
+}
+
+.note-delete {
+  float: right;
+  cursor: pointer;
+  color: #999;
+}
+
+.note-delete:hover {
+  color: #ff4444;
+}
+
+footer {
+  margin-top: 12px;
+  text-align: center;
+  color: #666;
+  font-size: 12px;
+}
+
+.empty {
+  text-align: center;
+  color: #999;
+  padding: 40px;
+}
+```
+
+### 弹出窗口逻辑 (popup/popup.js)
+
+```javascript
+let allNotes = [];
+
+// 加载笔记
+async function loadNotes() {
+  const { notes = [] } = await chrome.storage.local.get('notes');
+  allNotes = notes;
+  renderNotes(notes);
+}
+
+// 渲染笔记列表
+function renderNotes(notes) {
+  const container = document.getElementById('notesList');
+  const countEl = document.getElementById('noteCount');
+  
+  countEl.textContent = `${notes.length} 条笔记`;
+  
+  if (notes.length === 0) {
+    container.innerHTML = '<div class="empty">暂无笔记<br>选中网页文字后右键保存</div>';
+    return;
+  }
+  
+  container.innerHTML = notes.map(note => `
+    <div class="note-item" data-id="${note.id}">
+      <span class="note-delete" onclick="deleteNote('${note.id}')">✕</span>
+      <div class="note-text">${escapeHtml(note.text)}</div>
+      <div class="note-meta">
+        <a href="${note.url}" target="_blank">${note.title || '未知页面'}</a>
+        <br>
+        ${formatDate(note.createdAt)}
+      </div>
+    </div>
+  `).join('');
+}
+
+// 删除笔记
+async function deleteNote(id) {
+  allNotes = allNotes.filter(n => n.id !== id);
+  await chrome.storage.local.set({ notes: allNotes });
+  renderNotes(allNotes);
+}
+
+// 搜索
+document.getElementById('searchInput').addEventListener('input', (e) => {
+  const query = e.target.value.toLowerCase();
+  const filtered = allNotes.filter(note => 
+    note.text.toLowerCase().includes(query) ||
+    (note.title && note.title.toLowerCase().includes(query))
+  );
+  renderNotes(filtered);
+});
+
+// 导出 JSON
+document.getElementById('exportJson').addEventListener('click', () => {
+  const blob = new Blob([JSON.stringify(allNotes, null, 2)], { type: 'application/json' });
+  downloadBlob(blob, 'notes.json');
+});
+
+// 导出 Markdown
+document.getElementById('exportMd').addEventListener('click', () => {
+  const md = allNotes.map(note => 
+    `## ${formatDate(note.createdAt)}\n\n${note.text}\n\n> 来源: [${note.title}](${note.url})\n`
+  ).join('\n---\n\n');
+  const blob = new Blob([md], { type: 'text/markdown' });
+  downloadBlob(blob, 'notes.md');
+});
+
+// 清空
+document.getElementById('clearAll').addEventListener('click', async () => {
+  if (confirm('确定清空所有笔记？')) {
+    allNotes = [];
+    await chrome.storage.local.set({ notes: [] });
+    renderNotes([]);
+  }
+});
+
+// 工具函数
+function escapeHtml(text) {
+  const div = document.createElement('div');
+  div.textContent = text;
+  return div.innerHTML;
+}
+
+function formatDate(isoString) {
+  return new Date(isoString).toLocaleString('zh-CN');
+}
+
+function downloadBlob(blob, filename) {
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement('a');
+  a.href = url;
+  a.download = filename;
+  a.click();
+  URL.revokeObjectURL(url);
+}
+
+// 初始化
+loadNotes();
+```
+
+## 🚀 安装步骤
+
+1. 打开 Chrome，访问 `chrome://extensions/`
+2. 开启「开发者模式」
+3. 点击「加载已解压的扩展程序」
+4. 选择项目文件夹
+
+## ✅ 验收清单
+
+- [ ] 扩展成功加载
+- [ ] 右键菜单显示「保存到笔记」
+- [ ] 选中文本可以保存
+- [ ] 弹出窗口显示笔记列表
+- [ ] 搜索功能正常
+- [ ] 删除功能正常
+- [ ] 导出 JSON 正常
+- [ ] 导出 Markdown 正常
+
+## 💡 进阶挑战
+
+- 添加标签分类
+- 支持云同步（Chrome Sync）
+- 添加快捷键
+- 支持图片保存
+- 添加笔记编辑功能

i18n/zh/documents/实战案例/README.md

@@ -8,23 +8,62 @@
 
 | 案例 | 难度 | 技术栈 | 耗时 | 状态 |
 |:---|:---|:---|:---|:---|
-| [Todo App](./01-todo-app.md) | ⭐ 入门 | HTML/CSS/JS | 30 分钟 | 待补充 |
-| [个人博客](./02-blog.md) | ⭐⭐ 初级 | Next.js | 2 小时 | 待补充 |
-| [AI 聊天机器人](./03-chatbot.md) | ⭐⭐ 初级 | Python/FastAPI | 1 小时 | 待补充 |
-| [全栈 SaaS](./04-saas.md) | ⭐⭐⭐ 中级 | Next.js/Supabase | 1 天 | 待补充 |
-| [Chrome 插件](./05-chrome-extension.md) | ⭐⭐ 初级 | JS/Chrome API | 2 小时 | 待补充 |
+| [Todo App](./01-todo-app.md) | ⭐ 入门 | HTML/CSS/JS | 30 分钟 | ✅ 完成 |
+| [个人博客](./02-blog-system.md) | ⭐⭐ 中等 | Next.js/MDX | 2-4 小时 | ✅ 完成 |
+| [AI 聊天机器人](./03-chatbot.md) | ⭐⭐ 中等 | Python/FastAPI | 1-2 小时 | ✅ 完成 |
+| [命令行工具](./04-cli-tool.md) | ⭐⭐ 中等 | Python/Click | 1-2 小时 | ✅ 完成 |
+| [Chrome 扩展](./05-chrome-extension.md) | ⭐⭐ 中等 | JS/Chrome API | 2-3 小时 | ✅ 完成 |
 
 ---
 
-## 案例格式
+## 快速开始
 
-每个案例包含：
+每个案例都包含：
+1. **开始前的提示词** - 直接复制给 AI
+2. **项目结构** - 清晰的目录规划
+3. **核心代码** - 关键实现片段
+4. **验收清单** - 确保功能完整
+5. **进阶挑战** - 继续提升
 
-1. **项目目标** - 一句话说明要做什么
-2. **最终效果** - GIF/截图展示
-3. **使用的提示词** - 完整可复制
-4. **踩坑记录** - 遇到的问题和解决方案
-5. **完整代码** - GitHub 链接或代码片段
+### 使用方式
+
+1. 选择一个感兴趣的案例
+2. 复制「第一步」的提示词给 AI
+3. 跟着 AI 的指导一步步完成
+4. 对照验收清单检查功能
+
+---
+
+## 案例详情
+
+### ⭐ 入门级
+
+#### [Todo App](./01-todo-app.md)
+最简单的入门项目，30 分钟完成一个待办事项应用。
+- 技术栈：纯 HTML/CSS/JavaScript
+- 学习重点：DOM 操作、本地存储
+
+### ⭐⭐ 中等级
+
+#### [个人博客](./02-blog-system.md)
+构建一个支持 Markdown 的个人博客系统。
+- 技术栈：Next.js + MDX + Tailwind CSS
+- 学习重点：静态生成、文件系统路由
+
+#### [AI 聊天机器人](./03-chatbot.md)
+接入 AI API 的聊天机器人。
+- 技术栈：Python + FastAPI + OpenAI API
+- 学习重点：API 调用、流式响应
+
+#### [命令行工具](./04-cli-tool.md)
+实用的文件批量重命名工具。
+- 技术栈：Python + Click + Rich
+- 学习重点：CLI 开发、文件操作
+
+#### [Chrome 扩展](./05-chrome-extension.md)
+网页笔记助手浏览器扩展。
+- 技术栈：JavaScript + Chrome API
+- 学习重点：扩展开发、本地存储
 
 ---
 
@@ -32,7 +71,33 @@
 
 欢迎提交你的 Vibe Coding 实战案例！
 
-格式要求：
-- 必须包含完整提示词
-- 必须有效果展示（GIF 优先）
-- 记录踩坑经验
+### 格式要求
+
+```markdown
+# 实战案例：项目名称
+
+> 难度：⭐⭐ | 预计时间：X 小时 | 技术栈：XXX
+
+## 🎯 项目目标
+## 📋 开始前的准备
+## 🏗️ 项目结构
+## 🔧 核心代码
+## 🚀 部署/使用
+## ✅ 验收清单
+## 💡 进阶挑战
+```
+
+### 提交方式
+
+1. Fork 本仓库
+2. 在 `i18n/zh/documents/实战案例/` 添加案例文件
+3. 更新本 README 的案例列表
+4. 提交 Pull Request
+
+---
+
+## 相关资源
+
+- [从零开始 Vibe Coding](../从零开始vibecoding/)
+- [常见坑汇总](../常见坑汇总/)
+- [提示词库](../../prompts/)

i18n/zh/prompts/coding_prompts/architecture-design.md

@@ -0,0 +1,299 @@
+# 架构设计提示词
+
+> 让 AI 帮你设计清晰、可扩展的系统架构
+
+---
+
+## 🏗️ 项目架构设计
+
+```
+我要开发一个 [项目类型]，请帮我设计系统架构。
+
+## 项目背景
+[简要描述项目目的和背景]
+
+## 功能需求
+1. [核心功能 1]
+2. [核心功能 2]
+3. [核心功能 3]
+
+## 非功能需求
+- 预期用户量：[X 人]
+- 并发要求：[X QPS]
+- 数据量级：[X 条/GB]
+- 可用性要求：[99.9%]
+
+## 技术偏好（可选）
+- 语言：[如 Python/Go/Node.js]
+- 部署环境：[如 云服务器/Serverless/K8s]
+
+请提供：
+1. 整体架构图（用 Mermaid 或 ASCII）
+2. 技术栈选型及理由
+3. 核心模块划分
+4. 数据流设计
+5. 关键设计决策说明
+```
+
+---
+
+## 📊 数据库设计
+
+```
+请帮我设计数据库结构：
+
+## 业务场景
+[描述业务场景]
+
+## 核心实体
+1. [实体 1]：[描述]
+2. [实体 2]：[描述]
+3. [实体 3]：[描述]
+
+## 主要操作
+- [操作 1]：[频率]
+- [操作 2]：[频率]
+
+## 约束条件
+- 数据库类型：[MySQL/PostgreSQL/MongoDB]
+- 数据量预估：[X 条]
+
+请提供：
+1. ER 图（Mermaid 格式）
+2. 建表 SQL
+3. 索引设计
+4. 关键查询示例
+```
+
+---
+
+## 🔌 API 设计
+
+```
+请帮我设计 RESTful API：
+
+## 资源描述
+[描述要管理的资源]
+
+## 功能需求
+1. [功能 1]
+2. [功能 2]
+3. [功能 3]
+
+## 用户角色
+- [角色 1]：[权限描述]
+- [角色 2]：[权限描述]
+
+请提供：
+1. API 端点列表（方法、路径、描述）
+2. 请求/响应示例（JSON 格式）
+3. 错误码设计
+4. 认证方案
+5. 版本控制策略
+```
+
+---
+
+## 🧩 模块划分
+
+```
+请帮我进行模块划分：
+
+## 项目描述
+[描述项目]
+
+## 当前代码结构
+```
+[粘贴目录结构或描述]
+```
+
+## 问题
+[描述当前架构的问题，如：耦合严重/职责不清]
+
+请：
+1. 分析当前架构问题
+2. 提出模块划分方案
+3. 定义模块间接口
+4. 给出重构路径
+```
+
+---
+
+## 🔄 微服务拆分
+
+```
+我想将单体应用拆分为微服务：
+
+## 当前系统
+[描述当前单体应用]
+
+## 业务模块
+1. [模块 1]：[描述]
+2. [模块 2]：[描述]
+3. [模块 3]：[描述]
+
+## 拆分动机
+[为什么要拆分]
+
+## 约束条件
+- 团队规模：[X 人]
+- 技术栈：[当前技术栈]
+- 时间预算：[X 个月]
+
+请提供：
+1. 服务划分方案
+2. 服务间通信设计
+3. 数据一致性方案
+4. 部署架构
+5. 渐进式迁移计划
+```
+
+---
+
+## 📈 扩展性设计
+
+```
+请帮我设计一个可扩展的系统：
+
+## 当前规模
+- 用户量：[X]
+- 数据量：[X]
+- QPS：[X]
+
+## 目标规模
+- 用户量：[X]
+- 数据量：[X]
+- QPS：[X]
+
+## 当前架构
+[描述或图示]
+
+请提供：
+1. 扩展瓶颈分析
+2. 水平扩展方案
+3. 缓存策略
+4. 数据库扩展方案
+5. 成本估算
+```
+
+---
+
+## 🔐 安全架构
+
+```
+请帮我设计安全架构：
+
+## 系统描述
+[描述系统]
+
+## 敏感数据
+- [数据类型 1]
+- [数据类型 2]
+
+## 合规要求
+- [如 GDPR/等保]
+
+请提供：
+1. 认证方案
+2. 授权模型
+3. 数据加密策略
+4. 审计日志设计
+5. 安全最佳实践清单
+```
+
+---
+
+## 📝 技术方案文档
+
+```
+请帮我撰写技术方案文档：
+
+## 需求背景
+[描述需求]
+
+## 目标
+[描述目标]
+
+请按以下结构输出：
+
+# 技术方案：[标题]
+
+## 1. 背景与目标
+## 2. 方案概述
+## 3. 详细设计
+### 3.1 架构设计
+### 3.2 数据设计
+### 3.3 接口设计
+## 4. 技术选型
+## 5. 风险评估
+## 6. 里程碑计划
+## 7. 附录
+```
+
+---
+
+## 🎨 架构图模板
+
+### 系统架构图
+
+```
+请用 Mermaid 画出系统架构图：
+
+系统包含：
+- [组件 1]
+- [组件 2]
+- [组件 3]
+
+关系：
+- [组件 1] 调用 [组件 2]
+- [组件 2] 读写 [数据库]
+```
+
+### 时序图
+
+```
+请用 Mermaid 画出以下流程的时序图：
+
+参与者：
+- 用户
+- 前端
+- 后端
+- 数据库
+
+流程：
+1. [步骤 1]
+2. [步骤 2]
+3. [步骤 3]
+```
+
+---
+
+## 💡 设计原则提醒
+
+```
+请检查我的架构设计是否符合以下原则：
+
+架构描述：
+[描述你的架构]
+
+检查项：
+- [ ] 单一职责原则
+- [ ] 开闭原则
+- [ ] 依赖倒置原则
+- [ ] 高内聚低耦合
+- [ ] 关注点分离
+- [ ] 可测试性
+- [ ] 可观测性
+
+请指出不符合的地方并给出改进建议。
+```
+
+---
+
+## 使用建议
+
+1. **先明确需求** - 架构服务于需求，需求不清架构必乱
+2. **考虑约束** - 团队规模、时间、预算都是约束
+3. **渐进式设计** - 不要过度设计，够用就好
+4. **画图辅助** - 让 AI 用 Mermaid 画图更直观
+5. **迭代优化** - 架构不是一次性的，持续演进

i18n/zh/prompts/coding_prompts/code-review.md

@@ -0,0 +1,272 @@
+# 代码审查提示词
+
+> 让 AI 帮你进行专业的代码审查
+
+---
+
+## 🔍 通用代码审查
+
+```
+请对以下代码进行全面的代码审查：
+
+```
+[粘贴代码]
+```
+
+请从以下维度进行审查：
+
+1. **代码质量**
+   - 可读性
+   - 命名规范
+   - 代码结构
+
+2. **潜在问题**
+   - Bug 风险
+   - 边界情况
+   - 异常处理
+
+3. **性能**
+   - 时间复杂度
+   - 空间复杂度
+   - 优化建议
+
+4. **安全性**
+   - 输入验证
+   - 敏感数据处理
+   - 常见漏洞
+
+5. **最佳实践**
+   - 设计模式
+   - SOLID 原则
+   - 语言特性使用
+
+请按严重程度（🔴 严重 / 🟡 建议 / 🟢 优化）标注每个问题，并提供修改建议。
+```
+
+---
+
+## 📋 快速审查（简化版）
+
+```
+快速审查这段代码，只关注：
+1. 明显的 Bug
+2. 安全问题
+3. 性能问题
+
+代码：
+```
+[粘贴代码]
+```
+
+直接列出问题和修复方案，不需要详细解释。
+```
+
+---
+
+## 🎯 特定维度审查
+
+### 安全审查
+
+```
+请对这段代码进行安全审查：
+
+```
+[粘贴代码]
+```
+
+重点检查：
+- SQL 注入
+- XSS 攻击
+- CSRF 漏洞
+- 敏感信息泄露
+- 权限控制
+- 输入验证
+
+列出所有安全风险并提供修复代码。
+```
+
+### 性能审查
+
+```
+请对这段代码进行性能审查：
+
+```
+[粘贴代码]
+```
+
+分析：
+1. 时间复杂度
+2. 空间复杂度
+3. 数据库查询效率（如适用）
+4. 内存使用
+5. 并发处理
+
+提供优化后的代码和性能对比。
+```
+
+### 可维护性审查
+
+```
+请从可维护性角度审查这段代码：
+
+```
+[粘贴代码]
+```
+
+评估：
+1. 代码是否易于理解
+2. 是否遵循单一职责原则
+3. 是否有适当的注释
+4. 是否易于测试
+5. 是否易于扩展
+
+提供重构建议。
+```
+
+---
+
+## 🔄 PR 审查模板
+
+```
+请帮我审查这个 Pull Request：
+
+## 变更描述
+[描述这个 PR 做了什么]
+
+## 变更的文件
+
+### 文件 1: [文件名]
+```
+[粘贴代码变更]
+```
+
+### 文件 2: [文件名]
+```
+[粘贴代码变更]
+```
+
+请：
+1. 检查代码质量
+2. 验证逻辑正确性
+3. 确认是否有遗漏的边界情况
+4. 检查是否需要添加测试
+5. 给出 Approve / Request Changes / Comment 建议
+```
+
+---
+
+## 📊 审查报告模板
+
+```
+请生成一份代码审查报告：
+
+代码：
+```
+[粘贴代码]
+```
+
+报告格式：
+
+# 代码审查报告
+
+## 概述
+- 代码行数：
+- 审查时间：
+- 整体评分：X/10
+
+## 问题汇总
+| 严重程度 | 数量 |
+|---------|------|
+| 🔴 严重 | X |
+| 🟡 建议 | X |
+| 🟢 优化 | X |
+
+## 详细问题
+
+### 🔴 严重问题
+1. [问题描述]
+   - 位置：第 X 行
+   - 原因：
+   - 修复：
+
+### 🟡 建议改进
+...
+
+### 🟢 优化建议
+...
+
+## 总结与建议
+```
+
+---
+
+## 🆚 代码对比审查
+
+```
+请对比审查这两个版本的代码：
+
+## 原版本
+```
+[粘贴原代码]
+```
+
+## 新版本
+```
+[粘贴新代码]
+```
+
+请分析：
+1. 新版本解决了什么问题
+2. 新版本是否引入了新问题
+3. 新版本的改进是否合理
+4. 是否有更好的实现方式
+```
+
+---
+
+## 💡 审查技巧
+
+### 审查清单
+
+```
+请按照以下清单审查代码：
+
+- [ ] 代码能正常运行
+- [ ] 没有明显的 Bug
+- [ ] 错误处理完善
+- [ ] 没有安全漏洞
+- [ ] 性能可接受
+- [ ] 代码可读性好
+- [ ] 有必要的注释
+- [ ] 遵循项目规范
+- [ ] 有对应的测试
+
+代码：
+```
+[粘贴代码]
+```
+```
+
+### 学习式审查
+
+```
+请审查这段代码，并教我：
+1. 这段代码做了什么
+2. 有哪些值得学习的地方
+3. 有哪些可以改进的地方
+4. 相关的最佳实践是什么
+
+代码：
+```
+[粘贴代码]
+```
+```
+
+---
+
+## 使用建议
+
+1. **提供上下文** - 说明代码的用途和背景
+2. **指定重点** - 如果只关心某个方面，明确说明
+3. **分批审查** - 代码太长时分文件审查
+4. **跟进修复** - 审查后让 AI 帮你修复问题

i18n/zh/prompts/coding_prompts/debug-expert.md

@@ -0,0 +1,247 @@
+# 调试专家提示词
+
+> 让 AI 帮你快速定位和解决 Bug
+
+---
+
+## 🔍 通用调试提示词
+
+```
+你是一位经验丰富的调试专家。我遇到了一个问题，请帮我分析和解决。
+
+## 问题描述
+[描述你遇到的问题]
+
+## 预期行为
+[描述你期望发生什么]
+
+## 实际行为
+[描述实际发生了什么]
+
+## 错误信息
+```
+[粘贴错误信息]
+```
+
+## 相关代码
+```
+[粘贴相关代码]
+```
+
+## 已尝试的解决方案
+[列出你已经尝试过的方法]
+
+请：
+1. 分析可能的原因（列出 2-3 个最可能的）
+2. 提供具体的解决方案
+3. 解释为什么会出现这个问题
+4. 给出预防类似问题的建议
+```
+
+---
+
+## 🐛 前端调试
+
+### React 组件问题
+
+```
+我的 React 组件出现问题：
+
+组件代码：
+```jsx
+[粘贴组件代码]
+```
+
+问题：[描述问题，如：状态不更新/渲染异常/性能问题]
+
+控制台错误：
+```
+[粘贴错误]
+```
+
+请帮我：
+1. 找出问题根源
+2. 提供修复后的代码
+3. 解释 React 的相关机制
+```
+
+### CSS 布局问题
+
+```
+我的 CSS 布局有问题：
+
+HTML 结构：
+```html
+[粘贴 HTML]
+```
+
+CSS 样式：
+```css
+[粘贴 CSS]
+```
+
+期望效果：[描述或提供截图链接]
+实际效果：[描述或提供截图链接]
+
+请帮我修复布局问题，并解释原因。
+```
+
+---
+
+## 🔧 后端调试
+
+### API 接口问题
+
+```
+我的 API 接口有问题：
+
+接口代码：
+```python
+[粘贴代码]
+```
+
+请求方式：[GET/POST/PUT/DELETE]
+请求 URL：[URL]
+请求参数：
+```json
+[参数]
+```
+
+期望响应：
+```json
+[期望的响应]
+```
+
+实际响应：
+```json
+[实际的响应]
+```
+
+错误日志：
+```
+[日志]
+```
+
+请帮我定位问题并修复。
+```
+
+### 数据库查询问题
+
+```
+我的数据库查询有问题：
+
+SQL 语句：
+```sql
+[粘贴 SQL]
+```
+
+表结构：
+```sql
+[粘贴建表语句或描述]
+```
+
+期望结果：[描述]
+实际结果：[描述或错误信息]
+
+请帮我：
+1. 分析 SQL 问题
+2. 提供正确的查询
+3. 解释优化建议（如果有性能问题）
+```
+
+---
+
+## ⚡ 性能调试
+
+```
+我的应用有性能问题：
+
+## 问题表现
+- [描述性能问题，如：加载慢/卡顿/内存泄漏]
+
+## 环境信息
+- 框架/语言：[如 React/Node.js/Python]
+- 数据规模：[如 1000 条数据]
+
+## 相关代码
+```
+[粘贴可能有问题的代码]
+```
+
+## 性能数据（如有）
+- 加载时间：[X 秒]
+- 内存占用：[X MB]
+- CPU 使用：[X%]
+
+请帮我：
+1. 分析性能瓶颈
+2. 提供优化方案
+3. 给出优化后的代码
+```
+
+---
+
+## 🔐 安全问题调试
+
+```
+请帮我检查这段代码的安全问题：
+
+```
+[粘贴代码]
+```
+
+请：
+1. 列出所有潜在的安全漏洞
+2. 按严重程度排序
+3. 提供修复建议和代码
+4. 解释每个漏洞的危害
+```
+
+---
+
+## 💡 调试技巧
+
+### 二分法定位
+
+```
+我的代码在某处出错，但不确定具体位置。
+
+完整代码：
+```
+[粘贴代码]
+```
+
+错误表现：[描述]
+
+请帮我用二分法定位问题：
+1. 先确定问题在哪个模块/函数
+2. 逐步缩小范围
+3. 找到具体的问题行
+```
+
+### 最小复现
+
+```
+我遇到一个难以复现的 Bug：
+
+问题描述：[描述]
+发生频率：[总是/偶尔/特定条件]
+相关代码：
+```
+[粘贴代码]
+```
+
+请帮我：
+1. 分析可能的触发条件
+2. 构造最小复现代码
+3. 提供解决方案
+```
+
+---
+
+## 使用建议
+
+1. **提供完整上下文** - 错误信息、代码、环境都要给全
+2. **描述清楚预期 vs 实际** - 让 AI 理解差距在哪
+3. **列出已尝试的方案** - 避免重复建议
+4. **一次只问一个问题** - 聚焦更容易解决