liuyuqi-dellpc 4 days ago
parent
commit
f532b66633
15 changed files with 955 additions and 0 deletions
  1. 69 0
      docs/Csharp.md
  2. 78 0
      docs/flutter.md
  3. 61 0
      docs/go.md
  4. 68 0
      docs/java-android.md
  5. 70 0
      docs/javaspring.md
  6. 57 0
      docs/kotlin-ktor.md
  7. 61 0
      docs/php.md
  8. 59 0
      docs/python-ai.md
  9. 70 0
      docs/python-flask.md
  10. 60 0
      docs/python.fastapi.md
  11. 61 0
      docs/react.md
  12. 61 0
      docs/ruby-on-rails.md
  13. 59 0
      docs/rust.md
  14. 61 0
      docs/swift-swiftui.md
  15. 60 0
      docs/vue.md

+ 69 - 0
docs/Csharp.md

@@ -0,0 +1,69 @@
+# C# (.NET WPF) 项目:库存管理系统
+
+## 概述
+
+使用 C# 和 WPF 为小型企业构建一个库存管理桌面应用。需支持产品 CRUD、库存水平跟踪。
+
+## 功能需求
+
+### 1. 主窗口
+- **产品列表**: 使用 `DataGrid` 显示所有产品(ID, 名称, 类别, 单价, 库存量),支持排序。
+- **工具栏**: 提供“增/改/删”产品按钮和一个快速搜索框。
+- **状态栏**: 显示产品总数和库存总价值。
+
+### 2. 产品管理
+- **添加/编辑窗口**: 在模态窗口中提供表单用于添加或编辑产品信息(名称, 类别, 单价, 库存),包含保存/取消按钮。
+- **删除产品**: 删除前需有确认对话框。
+
+### 3. 库存操作
+- **调整库存**: 在 `DataGrid` 中提供“入库/出库”操作,在弹出窗口中输入调整数量。
+- **低库存警告**: `DataGrid` 中低库存(如 <10)的行应高亮显示。
+
+### 4. 数据
+- **数据库**: 使用轻量级本地数据库(如 SQLite)。
+- **数据访问**: 使用 Entity Framework Core (EF Core) 作为 ORM。
+
+## 技术栈
+
+- **语言**: C#
+- **框架**: .NET 8+ (WPF)
+- **设计模式**: MVVM
+- **数据访问**: EF Core
+- **数据库**: SQLite
+- **依赖注入**: 推荐使用 .NET Generic Host。
+
+## 项目结构
+
+```
+/InventoryManager
+├── InventoryManager.sln
+└── InventoryManager/
+    ├── App.xaml / App.xaml.cs      # 应用入口及全局资源
+    ├── Models/
+    │   └── Product.cs              # EF Core 实体
+    ├── Data/
+    │   └── AppDbContext.cs         # EF Core DbContext
+    ├── ViewModels/
+    │   ├── MainViewModel.cs
+    │   └── AddEditProductViewModel.cs
+    ├── Views/
+    │   ├── MainWindow.xaml
+    │   └── AddEditProductWindow.xaml
+    ├── Services/                   # 服务接口
+    ├── Migrations/                 # EF Core 迁移
+    ├── appsettings.json            # 配置文件
+    └── InventoryManager.csproj
+```
+
+## 任务步骤
+
+1.  **初始化**: 创建 WPF 项目,安装 EF Core, SQLite, 和 Hosting 相关的 NuGet 包。
+2.  **数据模型**: 创建 `Product` 实体和 `AppDbContext`。
+3.  **数据库迁移**: 配置连接字符串,运行 `Add-Migration` 和 `Update-Database`。
+4.  **MVVM基础**: 创建 `ViewModelBase` (实现 `INotifyPropertyChanged`) 和 `RelayCommand`。
+5.  **主窗口开发**: 设计 `MainWindow.xaml` 布局,创建 `MainViewModel` 加载和管理产品数据 (`ObservableCollection`),并实现增/删/改/查命令。
+6.  **编辑窗口开发**: 设计 `AddEditProductWindow.xaml` 及其 ViewModel,在 `MainViewModel` 中实现调用逻辑。
+7.  **数据绑定**: 将 View 控件属性绑定到 ViewModel。
+8.  **依赖注入 (推荐)**: 在 `App.xaml.cs` 中配置 `Host`,注册 `DbContext` 和 ViewModels。
+
+**先行任务**: 设计数据库 `Product` 表结构,并绘制主窗口和编辑窗口的线框图。

+ 78 - 0
docs/flutter.md

@@ -0,0 +1,78 @@
+# Flutter 项目:比特币交易所 App
+
+## 概述
+
+使用 Flutter 和 GetX 构建一个名为 `flutter_btc_exchange` 的比特币交易所应用。功能包括实时行情、多模式交易、AI 策略和资产管理。UI 要求美观流畅,初期使用 Mock 数据。
+
+## 功能需求
+
+包含五个主 Tab 页:**首页**, **行情**, **交易**, **AI策略**, **资产**。
+
+### 1. 认证
+- **登录/注册**: 实现基本的用户认证流程。
+- **其他页面**: 创建“用户详情”、“实名认证”、“绑卡”等空白页,待后续开发。
+
+### 2. 首页 (Home)
+- **顶部**: Logo、通知图标,以及“交易所”/“钱包” Tab。
+- **资产总览**: 显示总资产(CNY),并用图表展示今日收益(带刷新),下方有“充值”/“提现”按钮。
+- **快捷入口**: 10个功能按钮(如现货、合约交易等)。
+- **推广区**: Banner 横幅。
+- **市场 Tab**: “自选”、“热门”、“涨幅榜”等代币列表。
+- **新闻 Tab**: “发现”、“公告”等新闻列表。
+
+### 3. 行情页 (Market)
+- **顶部**: 搜索栏。
+- **主 Tab**: “市场”、“动态”、“牛人帮”。
+- **公告栏**: 滚动公告。
+- **行情分类 Tab**: “自选”、“现货”、“合约”等行情列表。
+
+### 4. 交易页 (Trade)
+- **图表区**: K线图或深度图。
+- **操作区**: “买入”/“卖出” Tab,含价格/数量输入框和交易按钮。
+- **订单区**: “当前委托”、“历史委托”等列表。
+
+### 5. AI 策略页 (核心)
+- **资产总览**: 显示策略账户总资产和图表。
+- **核心操作**: “盈亏分析”、“划转”按钮。
+- **策略管理**: “创建策略”、“运行中”、“历史策略” Tab。
+- **策略列表**: 展示可用策略,如现货网格、合约马丁格尔等。
+- **社区排行**: “AI推荐榜”、“达人榜”、“AI跟单”等。
+
+### 6. 资产页 (Assets)
+- **顶部**: Banner 和“充币”按钮。
+- **列表**: 显示用户持有的各币种资产。
+
+## 技术栈
+
+- **框架**: Flutter
+- **状态管理/路由**: GetX
+- **架构**: Clean Architecture (Domain, Data, Presentation)
+- **数据**: Mock 数据 (位于 `data/mock/`)
+- **核心依赖**: `get`, `dio`, `shared_preferences`, `fl_chart`, `cached_network_image` 等。
+
+## 项目结构
+
+```
+lib/
+├── main.dart               # 入口
+├── app/                    # 路由、绑定、应用配置
+├── core/                   # 常量、主题、工具、服务
+├── data/                   # 数据层 (Models, Repositories, Datasources, Mock)
+├── presentation/           # 表现层 (Pages, Widgets, Controllers)
+└── domain/                 # 领域层 (Entities, Repositories, Usecases)
+```
+
+## 任务步骤
+
+1.  **初始化**: 创建项目结构和文件。
+2.  **添加依赖**: 在 `pubspec.yaml` 中添加所有依赖并运行 `flutter pub get`。
+3.  **Mock数据**: 在 `data/mock/` 中创建模拟 API 响应的 JSON 文件。
+4.  **模型定义**: 根据 JSON 创建 Dart 模型类。
+5.  **架构搭建**: 实现 Domain, Data 层的接口和实现,从 Mock 读取数据。
+6.  **路由/注入**: 配置 GetX 的路由和控制器绑定。
+7.  **UI开发**: 构建五个主页面及认证页面,将通用部分抽象为 Widget。
+8.  **控制器逻辑**: 创建 `GetXController`,通过 UseCases 获取数据并管理页面状态。
+9.  **数据连接**: 使用 `GetBuilder` 或 `Obx` 将 View 与 Controller 连接,响应状态变化。
+10. **完善**: 实现页面导航、过渡动画和响应式布局。
+
+**先行任务**: 完成项目初始化、依赖添加和 Mock 数据创建。

+ 61 - 0
docs/go.md

@@ -0,0 +1,61 @@
+# Go 项目:博客 REST API
+
+## 概述
+
+使用 Go 和 `Gin` 框架构建一个博客系统的后端 REST API,支持用户和文章的 CRUD 操作及 JWT 认证。
+
+## 功能需求
+
+### 1. 用户模块 (User)
+- **注册**: `POST /api/users/register` - 请求体 `{"username", "password", "email"}`。密码需哈希加密。
+- **登录**: `POST /api/users/login` - 请求体 `{"username", "password"}`。成功后返回 JWT。
+- **获取信息**: `GET /api/users/:id` - 返回指定用户信息(无密码)。
+- **更新信息**: `PUT /api/users/:id` - 需 JWT 认证,仅限用户本人。
+
+### 2. 文章模块 (Post)
+- **创建文章**: `POST /api/posts` - 需 JWT 认证。请求体 `{"title", "content", "author_id"}`。
+- **获取所有文章**: `GET /api/posts` - 支持分页。
+- **获取单篇文章**: `GET /api/posts/:id`。
+- **更新文章**: `PUT /api/posts/:id` - 需 JWT 认证,仅限作者。
+- **删除文章**: `DELETE /api/posts/:id` - 需 JWT 认证,仅限作者或管理员。
+
+## 技术栈
+
+- **语言**: Go
+- **框架**: Gin
+- **数据库**: PostgreSQL
+- **ORM/Driver**: GORM 或 sqlx
+- **认证**: JWT (`golang-jwt/jwt`)
+- **密码哈希**: `bcrypt`
+- **配置**: Viper
+- **代码结构**: Standard Go Project Layout
+
+## 项目结构
+
+```
+/goblog
+├── /cmd/server/main.go         # 入口
+├── /internal/
+│   ├── /api                    # Handlers, 路由, 中间件
+│   ├── /core                   # Models, Services (业务逻辑)
+│   ├── /platform               # 数据库, 认证
+│   └── /config                 # 配置加载
+├── go.mod
+└── config.yaml
+```
+
+## 任务步骤
+
+1.  **初始化**: 设置 Go module, 安装依赖。
+2.  **配置**: 创建 `config.yaml` 并用 Viper 加载数据库和 JWT 设置。
+3.  **数据库设计**: 设计 `users` 和 `posts` 表结构,编写迁移脚本或使用 GORM AutoMigrate。
+4.  **模型定义**: 创建 `User` 和 `Post` 的 Go struct。
+5.  **数据库层**: 实现数据库连接和 CRUD 函数。
+6.  **业务逻辑层**: 在 Service 中实现用户和文章管理逻辑。
+7.  **API Handlers**: 创建处理 HTTP 请求的函数。
+8.  **认证中间件**: 创建 JWT 验证中间件。
+9.  **路由**: 定义所有 API 路由并应用中间件。
+10. **主函数**: 组装所有模块,启动 Gin 服务器。
+11. **测试**: 编写单元和集成测试。
+
+**先行任务**: 整理详细的开发计划和接口文档。

+ 68 - 0
docs/java-android.md

@@ -0,0 +1,68 @@
+# Java (Android) 项目:新闻阅读 App
+
+## 概述
+
+使用 Java 和现代 Android 技术栈构建一个新闻阅读应用。应用从 REST API (如 NewsAPI.org) 获取文章,支持文章列表、详情、分类和搜索,并具备离线缓存功能。
+
+## 功能需求
+
+### 1. 主屏幕 (文章列表)
+- **界面**: 使用 `RecyclerView` 显示文章列表(标题, 来源, 时间, 缩略图)。
+- **数据**: 启动时加载头条新闻,支持下拉刷新和无限滚动分页。
+- **导航**: 点击列表项跳转到详情页。
+
+### 2. 文章详情页
+- **界面**: 使用 `WebView` 显示文章原始网页。
+- **操作**: 提供“分享”和“在浏览器中打开”按钮。
+
+### 3. 分类筛选
+- **界面**: 使用 `TabLayout` 让用户按类别(商业, 科技等)筛选文章。
+- **功能**: 切换 Tab 时,重新请求对应类别的新闻。
+
+### 4. 搜索
+- **界面**: 在 AppBar 中提供 `SearchView` 图标。
+- **功能**: 用户输入关键词后,请求并显示搜索结果。
+
+### 5. 离线缓存
+- **机制**: 使用 Room 将网络数据缓存到本地数据库。
+- **体验**: 离线时显示缓存数据,在线时优先请求网络数据。
+
+## 技术栈
+
+- **语言**: Java
+- **架构**: MVVM
+- **核心组件**: AndroidX (RecyclerView, SwipeRefreshLayout, etc.)
+- **Jetpack**: ViewModel, LiveData, Room, Navigation Component
+- **网络**: Retrofit2
+- **JSON**: Gson 或 Moshi
+- **图片加载**: Glide 或 Picasso
+- **依赖注入**: Dagger/Hilt (可选)
+
+## 项目结构
+
+```
+/news-app
+└── app/src/main/
+    ├── java/com/example/newsapp/
+    │   ├── MainActivity.java
+    │   ├── ui/                 # Fragments & Activities
+    │   ├── viewmodel/          # ViewModels
+    │   ├── data/               # 数据层 (model, remote, local)
+    │   └── repository/         # 数据仓库
+    └── res/                    # 资源 (layout, menu, navigation)
+```
+
+## 任务步骤
+
+1.  **项目设置**: 创建 Android Studio 项目,在 `build.gradle` 添加所需依赖。
+2.  **API准备**: 获取 NewsAPI.org 的免费 API 密钥。
+3.  **网络层**: 使用 Retrofit 定义 API 接口,创建匹配 JSON 的数据模型。
+4.  **数据库层**: 使用 Room 定义 `Article` 实体、DAO 和数据库。
+5.  **数据仓库**: 创建 `NewsRepository` 作为统一数据入口,管理网络和本地数据。
+6.  **ViewModel**: 创建 `MainViewModel`,通过 Repository 获取 `LiveData` 封装的新闻数据。
+7.  **UI开发**: 创建 `MainFragment` (观察 LiveData 并更新 RecyclerView) 和 `DetailFragment` (使用 WebView)。
+8.  **导航**: 使用 Navigation Component 配置 `MainFragment` 和 `DetailFragment` 间的导航。
+9.  **高级功能**: 逐步实现下拉刷新、无限滚动、分类和搜索。
+10. **测试**: 为 ViewModel 和 Repository 编写单元测试。
+
+**先行任务**: 设计 `Article` 和 `Source` 数据模型,并确定 NewsAPI 的端点和查询参数。

+ 70 - 0
docs/javaspring.md

@@ -0,0 +1,70 @@
+# Java Spring Boot 项目:电子商务 API
+
+## 概述
+
+使用 Java 和 Spring Boot 构建一个电子商务后端 API,支持商品、订单和用户管理,并集成认证和模拟支付功能。
+
+## 功能需求
+
+### 1. 用户模块
+- **注册**: `POST /api/auth/register` - 请求体含 `username`, `password`, `email`。密码需 BCrypt 加密。
+- **登录**: `POST /api/auth/login` - 返回 JWT。
+- **个人资料**: `GET /api/users/me` 和 `PUT /api/users/me` - 需认证,用于获取和更新用户信息。
+
+### 2. 商品模块
+- **获取商品**: `GET /api/products` - 支持分类、价格筛选、分页和排序。
+- **获取商品详情**: `GET /api/products/{id}`。
+- **管理员操作**: `POST`, `PUT`, `DELETE /api/admin/products` - 需 `ROLE_ADMIN` 权限,用于增/改/删商品。
+
+### 3. 订单模块
+- **创建订单**: `POST /api/orders` - 需认证。请求体含商品列表和收货地址。
+- **获取订单历史**: `GET /api/orders` - 需认证,返回当前用户的所有订单。
+- **获取订单详情**: `GET /api/orders/{id}` - 需认证,只能查看自己的订单。
+- **更新订单状态**: `PUT /api/admin/orders/{id}/status` - 需 `ROLE_ADMIN` 权限,更新状态为 SHIPPED, DELIVERED 等。
+
+### 4. 支付 (模拟)
+- **处理支付**: `POST /api/orders/{id}/pay` - 需认证,模拟支付流程,成功后更新订单状态为 `PAID`。
+
+## 技术栈
+
+- **语言**: Java 17+
+- **框架**: Spring Boot 3.x
+- **数据库**: PostgreSQL 或 MySQL
+- **持久化**: Spring Data JPA
+- **认证**: Spring Security (JWT)
+- **校验**: Spring Validation
+- **API文档**: SpringDoc (OpenAPI 3)
+- **构建**: Maven 或 Gradle
+
+## 项目结构 (Maven)
+
+```
+/ecommerce-api
+└── src/main/
+    ├── java/com/example/ecommerce/
+    │   ├── Application.java        # 启动类
+    │   ├── config                  # SecurityConfig 等
+    │   ├── controller              # API 控制器
+    │   ├── dto                     # 数据传输对象
+    │   ├── entity                  # JPA 实体
+    │   ├── repository              # JPA 仓库
+    │   ├── service                 # 业务服务
+    │   └── exception               # 异常处理
+    └── resources/
+        └── application.properties  # 配置文件
+```
+
+## 任务步骤
+
+1.  **初始化**: 使用 Spring Initializr 创建项目,包含 Web, JPA, Security 等依赖。
+2.  **数据库配置**: 在 `application.properties` 中配置数据源和 JPA。
+3.  **实体建模**: 创建 `User`, `Product`, `Order` 等 JPA 实体。
+4.  **仓库接口**: 创建继承自 `JpaRepository` 的接口。
+5.  **安全配置**: 配置 `SecurityConfig`,设置密码编码器、JWT 过滤器和端点访问权限。
+6.  **DTOs与控制器**: 创建 DTO 并编写 `Controller` 处理 HTTP 请求。
+7.  **业务服务**: 在 `Service` 层实现核心业务逻辑。
+8.  **异常处理**: 创建全局异常处理器。
+9.  **API文档**: 使用 SpringDoc 注解生成 OpenAPI 文档。
+10. **测试**: 使用 JUnit 5 和 Mockito 编写单元和集成测试。
+
+**先行任务**: 设计详细的 API 端点和数据模型,并整理成文档。

+ 57 - 0
docs/kotlin-ktor.md

@@ -0,0 +1,57 @@
+# Kotlin (Ktor) 项目:URL 缩短服务
+
+## 概述
+
+使用 Kotlin 和 Ktor 构建一个异步、高性能的 URL 缩短服务。利用 Kotlin 协程处理高并发请求,提供 API 将长 URL 转换为短 URL,并通过短 URL 重定向。
+
+## 功能需求
+
+### 1. 核心 API
+- **创建短 URL**: `POST /shorten`
+  - **请求**: `{ "url": "..." }`
+  - **逻辑**: 验证 URL -> 生成唯一哈希 -> 存入数据库。若 URL 已存在,则返回现有短 URL。
+  - **响应**: `{ "short_url": "http://domain.com/hash" }`
+- **URL 重定向**: `GET /{hash}`
+  - **逻辑**: 查找哈希对应的原始 URL,找到则 301/302 重定向,未找到则 404。
+
+### 2. 附加功能
+- **自定义短链接**: `POST /shorten` 时可选 `custom_alias` 字段。
+- **点击统计**: 每次重定向时,异步增加点击计数。
+- **获取统计**: `GET /stats/{hash}` - 返回原始 URL、创建时间和点击次数。
+
+## 技术栈
+
+- **语言**: Kotlin
+- **框架**: Ktor
+- **构建**: Gradle (Kotlin DSL)
+- **数据库**: PostgreSQL 或 MongoDB (使用异步驱动)
+- **数据访问**: `Exposed` (SQL) 或 `KMongo` (MongoDB)
+- **序列化**: `kotlinx.serialization`
+- **异步**: Kotlin Coroutines
+
+## 项目结构
+
+```
+/ktor-url-shortener
+└── src/main/kotlin/com/example/
+    ├── Application.kt      # Ktor 主入口和模块配置
+    ├── plugins/            # 插件配置 (Serialization, Routing)
+    ├── routing/            # 路由定义
+    ├── services/           # 业务逻辑
+    ├── dao/                # 数据访问对象
+    └── models/             # 数据模型
+```
+
+## 任务步骤
+
+1.  **初始化**: 使用 Ktor 官方生成器创建项目,选择 Gradle, Netty, Routing, Serialization 和数据库插件。
+2.  **数据库设置**: 配置数据库连接,并使用 `Exposed` 或迁移工具设置表结构。
+3.  **数据模型**: 创建用于 API 和数据库映射的数据类。
+4.  **DAO层**: 实现数据访问逻辑,提供 `suspend` 函数(如 `findByHash`, `saveMapping`)。
+5.  **Service层**: 实现生成唯一哈希的核心逻辑(如 Base62 编码自增ID)。
+6.  **路由配置**: 定义 `/shorten` 和 `/{hash}` 的 API 路由,调用 Service 完成操作。
+7.  **插件组装**: 在主应用中配置 `ContentNegotiation` 和 `Routing` 插件。
+8.  **错误处理**: 使用 `StatusPages` 插件捕获异常并返回合适的 HTTP 状态。
+9.  **测试**: 使用 Ktor 的 `testApplication` 工具编写 API 集成测试。
+
+**先行任务**: 研究并确定短哈希生成算法,并设计出数据库表的具体结构。

+ 61 - 0
docs/php.md

@@ -0,0 +1,61 @@
+# PHP (Laravel) 项目:内容管理系统 (CMS)
+
+## 概述
+
+使用 PHP 和 Laravel 构建一个功能齐全的 CMS,支持多角色用户、文章、页面管理和媒体库。
+
+## 功能需求
+
+### 1. 后台管理 (Admin)
+- **仪表盘**: `GET /admin/dashboard` - 显示网站统计信息。
+- **用户管理**: `GET, POST, PUT, DELETE /admin/users` - 管理用户及角色(Admin, Editor, Author)。
+- **角色权限管理**: (可选) `GET, POST /admin/roles` - 定义角色权限。
+
+### 2. 内容管理
+- **文章管理**: `GET, POST, PUT, DELETE /admin/posts` - 使用富文本编辑器创建/编辑文章,支持分类、标签、特色图片和发布状态。作者/编辑有权限限制。
+- **页面管理**: `GET, POST, PUT, DELETE /admin/pages` - 管理“关于我们”等静态页面。
+- **媒体库**: `GET /admin/media` - 网格化显示和上传媒体文件,支持从编辑器调用。
+
+### 3. 前台显示
+- **首页**: `GET /` - 显示最新文章列表。
+- **详情页**: `GET /blog/{slug}` - 显示单篇文章。
+- **静态页**: `GET /{slug}` - 显示静态页面。
+- **分类/标签页**: `GET /category/{slug}`, `GET /tag/{slug}` - 显示该分类/标签下的文章。
+
+## 技术栈
+
+- **语言**: PHP 8.1+
+- **框架**: Laravel 10.x
+- **数据库**: MySQL 或 PostgreSQL
+- **前端**: Blade + Bootstrap 5 / Tailwind CSS
+- **认证**: Laravel Breeze
+- **授权**: Laravel Gates & Policies
+
+## 项目结构
+
+```
+/laravel-cms
+├── app/
+│   ├── Http/Controllers/ # Admin/ & Front/ 控制器
+│   ├── Models/           # Eloquent 模型 (User, Post, Page, etc.)
+│   └── Policies/         # 授权策略
+├── database/             # Migrations, Factories, Seeders
+├── resources/views/      # Blade 视图 (admin/, front/, layouts/)
+├── routes/web.php        # 路由定义
+└── composer.json
+```
+
+## 任务步骤
+
+1.  **初始化**: 创建 Laravel 项目并安装 Laravel Breeze。
+2.  **数据库**: 创建 `posts`, `pages`, `categories` 等迁移,并定义模型关系。
+3.  **模型与工厂**: 创建 Eloquent 模型及对应的 Factory。
+4.  **路由**: 在 `web.php` 中使用路由组和中间件组织后台 (`/admin`) 和前台路由。
+5.  **后台开发**: 创建后台管理的控制器和 Blade 视图。
+6.  **授权**: 使用 Policies 控制用户对文章等资源的 CUD 权限。
+7.  **前台开发**: 创建用于展示文章和页面的控制器和视图。
+8.  **富文本集成**: 在编辑视图中集成 JS 富文本编辑器。
+9.  **数据填充**: 创建 Seeder 填充初始数据(如管理员用户)。
+10. **测试**: 使用 Pest 或 PHPUnit 编写 Feature 和 Unit 测试。
+
+**先行任务**: 设计数据库 ER 图和后台管理界面的线框图。

+ 59 - 0
docs/python-ai.md

@@ -0,0 +1,59 @@
+# Python (AI/ML) 项目:图像分类 API
+
+## 概述
+
+使用 Python, FastAPI 和一个预训练模型 (如 MobileNetV2) 构建一个 REST API。服务接收上传的图像,并返回分类预测结果。
+
+## 功能需求
+
+### 1. API 端点
+- **健康检查**: `GET /` - 响应 `{ "status": "ok" }`。
+- **图像分类**: `POST /predict`
+  - **请求**: `multipart/form-data`,含名为 `file` 的图像 (JPEG, PNG)。
+  - **响应**: `{ "filename": "...", "predictions": [ {"label": "...", "probability": ...} ] }`,包含 Top 5 预测结果。
+  - **失败**: 返回 400 等错误码及信息。
+
+### 2. 核心功能
+- **模型加载**: 应用启动时加载一次预训练模型 (从 TensorFlow Hub, PyTorch Hub 等)。
+- **图像预处理**: 预测前,将图像调整为模型所需尺寸 (如 224x224),并进行归一化。
+- **预测**: 将预处理后的图像输入模型获取结果。
+- **结果后处理**: 将模型输出转换为带标签和概率的 Top 5 结果列表。
+
+## 技术栈
+
+- **语言**: Python 3.9+
+- **框架**: FastAPI
+- **AI框架**: TensorFlow/Keras 或 PyTorch
+- **模型**: MobileNetV2 或 EfficientNet
+- **图像处理**: Pillow, OpenCV-Python
+- **计算**: NumPy
+- **部署**: Docker
+
+## 项目结构
+
+```
+/image-classifier-api
+├── app/
+│   ├── main.py             # FastAPI 入口和路由
+│   ├── ml/
+│   │   ├── model.py        # 模型加载和预测逻辑
+│   │   └── utils.py        # 图像处理工具
+│   └── schemas.py          # Pydantic 响应模型
+├── models/                 # (可选) 存放下载的模型文件
+├── static/                 # 存放 ImageNet 标签文件
+├── Dockerfile
+└── requirements.txt
+```
+
+## 任务步骤
+
+1.  **环境设置**: 创建虚拟环境并安装 FastAPI, Uvicorn, TF/PyTorch, Pillow, NumPy。
+2.  **模型准备**: 实现应用启动时从 Hub 下载并加载预训练模型的逻辑。下载 ImageNet 标签文件。
+3.  **Schemas**: 定义 API 响应的 Pydantic 模型。
+4.  **图像处理**: 在 `app/ml/utils.py` 中创建图像预处理和结果后处理的函数。
+5.  **模型服务**: 在 `app/ml/model.py` 中封装模型加载和调用逻辑,使用 FastAPI 的 `startup` 事件确保只加载一次。
+6.  **API路由**: 在 `main.py` 中创建 `/predict` 端点,接收上传文件,调用处理函数并返回结果。
+7.  **容器化**: 编写 `Dockerfile` 构建应用镜像。
+8.  **测试**: 使用 `pytest` 和 `httpx` 编写 API 测试,发送示例图片并验证响应。
+
+**先行任务**: 确定预训练模型的来源、输入尺寸和像素值范围,并整理成文档。

+ 70 - 0
docs/python-flask.md

@@ -0,0 +1,70 @@
+# Python (Flask) 项目:社交媒体 API
+
+## 概述
+
+使用 Python 和 Flask 构建一个轻量级社交媒体后端 API,支持用户发布动态、关注、评论和点赞。
+
+## 功能需求
+
+### 1. 用户认证
+- **注册**: `POST /api/auth/register` - 请求体含 `username`, `password`, `email`。
+- **登录**: `POST /api/auth/login` - 返回 JWT Access Token。
+- **个人信息**: `GET /api/profile` - 需认证,返回当前用户信息。
+
+### 2. 用户关系
+- **关注/取关**: `POST`/`DELETE /api/users/<id>/follow` - 需认证。
+- **获取粉丝/关注列表**: `GET /api/users/<id>/followers` 和 `GET /api/users/<id>/following`。
+
+### 3. 动态 (Post)
+- **创建动态**: `POST /api/posts` - 需认证,请求体含 `text`。
+- **获取时间线**: `GET /api/timeline` - 需认证,返回自己和关注用户的动态(时间倒序)。
+- **获取用户动态**: `GET /api/users/<id>/posts`。
+- **删除动态**: `DELETE /api/posts/<id>` - 需认证,仅限作者。
+
+### 4. 互动
+- **点赞/取消**: `POST`/`DELETE /api/posts/<id>/like` - 需认证。
+- **评论**: `POST /api/posts/<id>/comments` - 需认证,请求体含 `text`。
+- **获取评论**: `GET /api/posts/<id>/comments`。
+
+## 技术栈
+
+- **语言**: Python 3.9+
+- **框架**: Flask, Flask-RESTful
+- **数据库**: PostgreSQL 或 SQLite
+- **ORM**: Flask-SQLAlchemy
+- **迁移**: Flask-Migrate
+- **认证**: PyJWT
+- **序列化**: Flask-Marshmallow
+- **代码结构**: Flask Blueprints
+
+## 项目结构
+
+```
+/flask-social-api
+├── app/
+│   ├── __init__.py         # 应用工厂
+│   ├── models.py           # SQLAlchemy 模型
+│   ├── schemas.py          # Marshmallow Schemas
+│   ├── auth/               # 认证蓝图
+│   ├── posts/              # 动态蓝图
+│   └── users/              # 用户蓝图
+├── migrations/
+├── config.py
+├── run.py
+└── requirements.txt
+```
+
+## 任务步骤
+
+1.  **环境设置**: 创建虚拟环境,安装依赖。
+2.  **配置**: 在 `config.py` 中设置数据库 URI 和 JWT 密钥。
+3.  **应用工厂**: 在 `app/__init__.py` 中创建 `create_app` 函数,初始化扩展并注册蓝图。
+4.  **数据库建模**: 在 `app/models.py` 中定义数据模型及关系。
+5.  **数据库迁移**: 运行 `flask db init`, `migrate`, `upgrade` 创建表。
+6.  **序列化**: 在 `app/schemas.py` 中为模型创建 Marshmallow Schema。
+7.  **蓝图**: 为各模块(auth, posts, users)创建蓝图并定义路由。
+8.  **认证**: 创建装饰器或使用扩展保护需认证的端点。
+9.  **业务逻辑**: 在视图函数或服务中实现核心逻辑。
+10. **测试**: 使用 Pytest 为 API 端点编写集成测试。
+
+**先行任务**: 设计数据库模型关系图 (ERD) 和 API 的 JSON 响应格式。

+ 60 - 0
docs/python.fastapi.md

@@ -0,0 +1,60 @@
+# Python (FastAPI) 项目:高性能待办事项 API
+
+## 概述
+
+使用 Python 和 FastAPI 构建一个现代、高性能的多用户待办事项 API。利用其异步特性和自动生成的 API 文档。
+
+## 功能需求
+
+### 1. 用户认证
+- **注册**: `POST /users/` - 请求体为 Pydantic 模型 (`username`, `email`, `password`),密码需哈希。
+- **登录**: `POST /token` - 请求体为 `OAuth2PasswordRequestForm`,返回 Access Token。
+- **获取当前用户**: `GET /users/me/` - 需认证,返回用户信息。
+
+### 2. 任务 (Item)
+- **创建任务**: `POST /users/me/items/` - 需认证,任务与当前用户关联。
+- **获取当前用户任务**: `GET /users/me/items/` - 需认证,支持分页、按完成状态和优先级筛选。
+- **获取特定任务**: `GET /items/{item_id}` - 需认证,仅限自己的任务。
+- **更新任务**: `PUT /items/{item_id}` - 需认证,仅限自己的任务。
+- **删除任务**: `DELETE /items/{item_id}` - 需认证,仅限自己的任务。
+
+## 技术栈
+
+- **语言**: Python 3.9+
+- **框架**: FastAPI
+- **数据模型**: Pydantic
+- **数据库**: PostgreSQL (使用 `asyncpg`)
+- **ORM**: SQLAlchemy 2.0 (异步) 或 SQLModel
+- **迁移**: Alembic
+- **认证**: `passlib`, `python-jose`, FastAPI's OAuth2
+- **代码结构**: 分层结构 (Router, Service, Repository)
+
+## 项目结构
+
+```
+/fastapi-todo-api
+├── app/
+│   ├── main.py             # FastAPI 入口
+│   ├── api/                # 路由 (routers) 和依赖 (deps)
+│   ├── core/               # 配置 (config) 和安全 (security)
+│   ├── db/                 # 数据库会话和模型
+│   ├── schemas/            # Pydantic Schemas
+│   └── crud/               # CRUD 操作函数
+├── alembic/
+└── requirements.txt
+```
+
+## 任务步骤
+
+1.  **环境设置**: 创建虚拟环境,安装依赖。
+2.  **配置**: 使用 Pydantic 的 `BaseSettings` 从环境变量加载配置。
+3.  **数据库与模型**: 定义 SQLAlchemy 模型,使用 Alembic 创建迁移。
+4.  **Schemas**: 为每个模型定义 `Create`, `Update`, `Read` 等 Pydantic schemas。
+5.  **CRUD 操作**: 编写与数据库直接交互的异步 CRUD 函数。
+6.  **安全与认证**: 实现密码哈希和 JWT 逻辑,创建获取当前用户的依赖项。
+7.  **API 路由**: 创建 `APIRouter`,定义路径操作函数,调用 CRUD 函数。
+8.  **主应用**: 在 `main.py` 中创建 FastAPI 实例并包含各模块路由。
+9.  **依赖注入**: 使用 FastAPI 的 `Depends` 来提供数据库会话和用户认证。
+10. **测试**: 使用 `pytest` 和 `httpx` 编写异步 API 测试。
+
+**先行任务**: 专注于定义清晰的 Pydantic 模型和数据库结构。

+ 61 - 0
docs/react.md

@@ -0,0 +1,61 @@
+# React.js 项目:天气预报 Web 应用
+
+## 概述
+
+使用 React.js 和天气 API (如 OpenWeatherMap) 构建一个界面美观的天气预报应用。支持全球城市搜索、查看当前和未来天气,并可将城市保存到收藏夹。
+
+## 功能需求
+
+### 1. 核心天气功能
+- **默认城市**: 加载时通过浏览器 Geolocation 获取用户位置天气,若失败则显示默认城市。
+- **城市搜索**: 提供带自动补全/建议的搜索栏。
+- **当前天气**: 显示城市名、温度、天气状况及图标、体感温度、湿度、风速等。
+- **每小时预报**: 水平滚动列表展示未来 24 小时天气。
+- **未来天气**: 列表展示未来 5-7 天天气预报。
+
+### 2. 用户体验
+- **收藏夹**: 允许用户添加、删除和快速切换收藏的城市,使用 `localStorage` 持久化。
+- **单位切换**: 提供摄氏度 (°C) / 华氏度 (°F) 切换开关。
+- **状态显示**: API 请求时显示加载指示器,请求失败时显示错误消息。
+- **响应式设计**: 适配桌面和移动设备。
+
+## 技术栈
+
+- **框架**: React.js 18+ (函数组件和 Hooks)
+- **脚手架**: Vite 或 Create React App
+- **状态管理**: React Context API 或 Zustand / Redux Toolkit
+- **数据请求**: React Query (`@tanstack/react-query`) + `axios`/`fetch`
+- **路由**: React Router (可选)
+- **样式**: Styled-Components, Emotion, 或 Tailwind CSS
+- **图标**: `react-icons`
+
+## 项目结构 (Vite)
+
+```
+/react-weather-app
+├── src/
+│   ├── api/                # API 请求逻辑
+│   ├── components/         # UI 组件
+│   ├── hooks/              # 自定义 Hooks
+│   ├── contexts/           # React Context
+│   ├── pages/              # 页面组件
+│   ├── App.jsx
+│   └── main.jsx
+├── .env                    # 存放 API 密钥
+└── package.json
+```
+
+## 任务步骤
+
+1.  **初始化**: 使用 Vite 创建 React 项目。
+2.  **API准备**: 获取 OpenWeatherMap API 密钥并存入 `.env` 文件。
+3.  **API层封装**: 创建模块封装所有对天气 API 的调用。
+4.  **状态管理**: 使用 React Query 的 `QueryClientProvider` 包裹应用,并创建所需 Context。
+5.  **组件开发**: 创建 `SearchBar`, `CurrentWeather`, `HourlyForecast` 等核心 UI 组件。
+6.  **数据请求**: 使用 `useQuery` 获取天气数据,自动处理加载和错误状态。
+7.  **搜索功能**: 使用 `useDebounce` Hook 优化搜索 API 调用。
+8.  **收藏夹功能**: 使用 `localStorage` 和 Context API 实现城市的增、删、查、改。
+9.  **地理定位**: 加载时调用 `navigator.geolocation` 获取用户位置作为初始查询。
+10. **样式**: 美化应用并确保响应式布局。
+
+**先行任务**: 设计应用的主要界面线框图,并规划好 API 数据到 UI 组件的映射。

+ 61 - 0
docs/ruby-on-rails.md

@@ -0,0 +1,61 @@
+# Ruby on Rails 项目:项目管理工具
+
+## 概述
+
+使用 Ruby on Rails 构建一个团队协作的项目管理工具。应用支持多用户注册、创建项目和管理任务,遵循 Rails 的“约定优于配置”原则。
+
+## 功能需求
+
+### 1. 用户认证 (Devise)
+- **注册/登录**: 支持用户创建账户、登录和注销。
+- **个人资料**: 允许用户编辑自己的名字和头像。
+
+### 2. 项目模块
+- **创建项目**: 登录用户可创建项目(名称、描述)。
+- **项目列表**: 显示用户参与的所有项目。
+- **项目主页**: 展示项目详情和相关任务列表。
+- **项目成员**: 项目创建者可添加其他用户为成员。
+
+### 3. 任务模块
+- **创建任务**: 在项目内创建任务(标题, 描述, 状态, 截止日期, 指派人)。
+- **更新任务**: 更新任务的各个属性。
+- **评论**: 支持对任务进行评论。
+
+### 4. 仪表盘
+- **个人仪表盘**: 登录后显示指派给自己的任务和最近的项目活动。
+
+## 技术栈
+
+- **语言**: Ruby 3.x
+- **框架**: Ruby on Rails 7.x
+- **数据库**: PostgreSQL
+- **认证**: `Devise` gem
+- **样式**: `Bootstrap` 或 `Tailwind CSS`
+- **代码结构**: 标准 Rails MVC
+
+## 项目结构
+
+```
+/project-manager
+├── app/
+│   ├── controllers/      # 控制器
+│   ├── models/           # 模型 (User, Project, Task, Comment)
+│   └── views/            # 视图
+├── config/routes.rb      # 路由
+├── db/migrate/           # 数据库迁移
+└── Gemfile
+```
+
+## 任务步骤
+
+1.  **初始化**: 运行 `rails new project-manager -d postgresql`。
+2.  **添加Gems**: 在 `Gemfile` 中添加 `devise` 等,然后 `bundle install`。
+3.  **Devise设置**: 运行 `rails g devise:install` 和 `rails g devise User` 生成认证系统。
+4.  **数据库建模**: 使用 `rails g model` 创建 `Project`, `Task` 等模型,定义关联关系,然后运行 `rails db:migrate`。
+5.  **路由**: 在 `config/routes.rb` 中使用 `resources` 定义 RESTful 路由。
+6.  **控制器**: 创建 `ProjectsController` 和 `TasksController` 并实现 CRUD actions。
+7.  **视图**: 创建 ERB 视图文件来展示表单和列表。
+8.  **授权 (可选)**: 使用 `Pundit` 或 `CanCanCan` 管理用户权限。
+9.  **评论**: 实现任务的评论功能。
+
+**先行任务**: 设计数据库模型关系图 (ERD) 和主要页面的线框图。

+ 59 - 0
docs/rust.md

@@ -0,0 +1,59 @@
+# Rust 项目:重复文件查找和清理 CLI
+
+## 概述
+
+使用 Rust 构建一个高效、安全的跨平台 CLI 工具,用于在指定目录中查找和处理重复文件。利用 Rust 的高性能 I/O 和并发能力来快速扫描。
+
+## 功能需求
+
+### 1. 核心功能:查找
+- **指定目录**: 通过命令行参数指定扫描的根目录。
+- **扫描策略**: 
+  1. 按文件大小分组。
+  2. 对大小相同的文件,计算哈希值(推荐先部分哈希,后完整哈希)以确认重复。
+- **并发处理**: 使用 `Rayon` 库并行计算文件哈希。
+- **输出**: 清晰地打印出所有重复的文件组。
+
+### 2. 交互式处理
+- **处理选项**: 扫描完成后,为每个重复组提供交互式选项:保留一个、全部删除、跳过。
+- **安全措施**: 删除前必须有明确的确认提示。
+- **预览模式**: 提供 `--dry-run` 标志,只报告操作,不实际修改文件。
+
+### 3. 高级功能
+- **排除规则**: 支持 `--exclude` 参数,可使用 glob 模式排除目录或文件。
+- **导出**: 支持将结果导出为 JSON 或 CSV。
+- **日志**: 使用 `log` 和 `env_logger` 提供不同级别的日志输出。
+
+## 技术栈
+
+- **语言**: Rust
+- **CLI解析**: `clap`
+- **并发**: `rayon`
+- **哈希**: `sha2` 或 `blake3`
+- **日志**: `log`, `env_logger`
+- **交互**: `dialoguer` (提示), `indicatif` (进度条)
+
+## 项目结构
+
+```
+/duplicate-finder
+├── src/
+│   ├── main.rs             # 入口和 CLI 解析
+│   ├── scanner.rs          # 核心扫描逻辑
+│   ├── file_utils.rs       # 文件和哈希工具
+│   └── interactive.rs      # 交互处理逻辑
+└── Cargo.toml
+```
+
+## 任务步骤
+
+1.  **初始化**: `cargo new duplicate-finder`,并在 `Cargo.toml` 中添加依赖。
+2.  **CLI设计**: 使用 `clap` 的派生宏定义命令行参数和标志。
+3.  **扫描逻辑**: 在 `scanner.rs` 中实现递归遍历、按大小分组和高效哈希计算的逻辑。
+4.  **并发实现**: 使用 `Rayon` 的并行迭代器 (`par_iter`) 加速哈希计算。
+5.  **交互模块**: 在 `interactive.rs` 中使用 `dialoguer` 向用户展示选项并获取输入。
+6.  **主函数**: 解析 CLI 参数,调用扫描模块,然后将结果传给交互模块处理。
+7.  **错误处理**: 广泛使用 `Result<T, E>` 和 `?` 操作符处理 I/O 等错误。
+8.  **测试**: 编写单元测试验证核心逻辑,编写集成测试模拟 CLI 调用。
+
+**先行任务**: 设计核心数据结构(如用于存储文件信息的 `struct` 和 `HashMap`),并规划扫描和哈希算法的详细步骤。

+ 61 - 0
docs/swift-swiftui.md

@@ -0,0 +1,61 @@
+# Swift (SwiftUI) 项目:“每日名言” iOS App
+
+## 概述
+
+使用 Swift 和 SwiftUI 构建一个设计简洁的 iOS 应用。应用每天从 API 获取并展示一条名言,支持收藏和分享,并提供主屏幕小组件。
+
+## 功能需求
+
+### 1. 主屏幕 (Quote View)
+- **每日名言**: 启动时自动从 API 请求并显示名言及其作者。
+- **背景**: 使用高质量图片或渐变色作为背景。
+- **操作**: 提供刷新、分享(通过原生 Share Sheet)和收藏(保存到本地)按钮。
+
+### 2. 收藏夹 (Favorites View)
+- **导航**: 从主屏幕可跳转至此页面。
+- **列表**: 使用 `List` 展示所有收藏的名言。
+- **持久化**: 收藏记录需本地持久化(`Core Data`, `SwiftData`, 或 `UserDefaults`)。
+- **删除**: 支持左滑删除收藏。
+
+### 3. 小组件 (WidgetKit)
+- **主屏幕小组件**: 创建一个展示每日名言的 iOS 主屏幕小组件。
+- **自动更新**: 小组件能每天自动更新内容。
+
+## 技术栈
+
+- **语言**: Swift
+- **UI**: SwiftUI
+- **生命周期**: SwiftUI App Life Cycle
+- **网络**: `URLSession` with `async/await`
+- **持久化**: `Core Data`, `SwiftData` (iOS 17+), 或 `UserDefaults`+`Codable`
+- **状态管理**: `@State`, `@StateObject`, `@EnvironmentObject`
+- **小组件**: WidgetKit
+- **API**: 免费名言 API (e.g., `zenquotes.io`, `quotable.io`)
+
+## 项目结构 (Xcode)
+
+```
+/QuoteApp
+├── QuoteApp/                 # 主应用 Target
+│   ├── Views/                # SwiftUI 视图
+│   ├── ViewModels/           # ViewModels
+│   ├── Models/               # 数据模型
+│   ├── Services/             # 网络和数据服务
+│   └── QuoteAppApp.swift     # 应用入口
+└── QuoteAppWidget/           # Widget Target
+    └── QuoteAppWidget.swift
+```
+
+## 任务步骤
+
+1.  **初始化**: 在 Xcode 中创建新的 SwiftUI 应用项目。
+2.  **API服务**: 创建 `QuoteAPIService`,使用 `async/await` 获取名言。定义 `Quote` 模型以匹配 JSON 响应。
+3.  **持久化**: 选择并设置一种本地数据持久化方案。
+4.  **ViewModel**: 创建 `QuoteViewModel` (`ObservableObject`),负责获取数据、处理收藏和分享逻辑。
+5.  **主视图**: 设计 `QuoteView` 并与 ViewModel 连接。使用 `UIViewControllerRepresentable` 封装 `UIActivityViewController` 以实现分享。
+6.  **收藏夹**: 创建 `FavoritesView`,从本地存储中读取并显示列表,实现删除功能。
+7.  **导航**: 使用 `NavigationStack` 或 `NavigationView` 连接主视图和收藏夹。
+8.  **小组件**: 添加 Widget Extension Target,在 `TimelineProvider` 中实现每日更新逻辑,并设计小组件 UI。
+9.  **UI/UX**: 添加动画,优化字体和颜色,提升视觉体验。
+
+**先行任务**: 选定一个名言 API 并研究其文档。设计 App 主屏幕和小组件的线框图。

+ 60 - 0
docs/vue.md

@@ -0,0 +1,60 @@
+# Vue.js 项目:交互式个人作品集
+
+## 概述
+
+使用 Vue.js 3 和 Vite 构建一个现代、响应式的 SPA 个人作品集。网站用于展示个人信息、技能、项目和联系方式,并包含平滑的页面过渡和交互。
+
+## 功能需求
+
+### 1. 页面与组件
+- **主页**: 包含“英雄”区域(介绍)、“关于我”和技能展示(图标或进度条)。
+- **作品集页**: 使用卡片布局展示项目列表(截图, 标题, 描述, 技术标签)。点击卡片可打开模态框或详情页显示项目详情。
+- **联系页**: 包含带前端验证的联系表单和社交媒体链接。
+- **导航栏**: 固定在顶部,含 Logo 和页面链接,滚动时有样式变化。
+- **页脚**: 版权和社交媒体链接。
+
+### 2. 交互与动画
+- **路由**: 使用 `vue-router` 实现客户端路由,页面切换带过渡效果。
+- **响应式**: 使用 CSS Flexbox/Grid 和媒体查询适配桌面、平板和手机。
+- **状态管理**: 使用 `Pinia` 管理全局状态(如暗黑/明亮模式切换)。
+- **动画**: 为页面元素加载添加微妙的动画效果(`gsap` 或 `motion`)。
+
+## 技术栈
+
+- **框架**: Vue.js 3 (Composition API)
+- **构建**: Vite
+- **路由**: Vue Router 4
+- **状态管理**: Pinia
+- **样式**: Tailwind CSS 或 SCSS
+- **表单验证**: vee-validate
+- **图标**: `vue-feather-icons` 或 `FontAwesome`
+- **部署**: Netlify, Vercel, 或 GitHub Pages
+
+## 项目结构
+
+```
+/vue-portfolio
+├── src/
+│   ├── assets/             # 静态资源
+│   ├── components/         # 可复用组件
+│   ├── views/              # 页面级组件
+│   ├── router/             # 路由配置
+│   ├── store/              # Pinia store
+│   ├── App.vue
+│   └── main.js
+└── package.json
+```
+
+## 任务步骤
+
+1.  **初始化**: 使用 `npm create vue@latest` 创建项目,选择 Vite, Vue Router, Pinia 等。
+2.  **结构设置**: 创建所需的文件夹和文件。
+3.  **路由配置**: 在 `src/router/index.js` 中定义所有页面路由。
+4.  **布局开发**: 创建 `Navbar` 和 `Footer` 并在 `App.vue` 中使用。
+5.  **页面开发**: 逐个开发 `Home`, `Portfolio`, `Contact` 页面。
+6.  **状态管理**: 创建 Pinia store 实现主题切换功能。
+7.  **交互与动画**: 使用 `<transition>` 组件为路由切换添加动画,并为其他元素添加入场效果。
+8.  **响应式适配**: 使用媒体查询确保在所有设备上布局正确。
+9.  **部署**: 将应用部署到静态网站托管平台。
+
+**先行任务**: 设计网站的线框图和基本视觉风格(主色调、字体)。