01 - 快速入门

Claude AI (大脑)
    +
Cursor Editor (载体)
    +
你的创意 (灵魂)
    =
Claude Code (超级编程体验)

你 → 思考 → 编写代码 → 调试 → 完成
     (100%人工)

你 → 描述需求 → Claude 生成代码 → 你审查调整 → 完成
     (AI辅助，效率↑10倍)

推荐配置:
- 主模型: Claude 3.5 Sonnet (最强)
- 快速模型: Claude 3 Haiku (省额度)

Settings → Cursor → API Keys → Add Claude API Key

请帮我创建一个 React + TypeScript 的 Todo App 项目结构，
包括：
1. 基础配置文件
2. 文件夹结构
3. 必要的依赖

项目需求：
- 使用 Vite 构建
- 支持添加、删除、标记完成待办事项
- 使用 Tailwind CSS 样式

my-todo-app/
├── package.json
├── tsconfig.json
├── vite.config.ts
├── index.html
├── src/
│   ├── main.tsx
│   ├── App.tsx
│   ├── components/
│   │   ├── TodoList.tsx
│   │   ├── TodoItem.tsx
│   │   └── AddTodo.tsx
│   ├── types/
│   │   └── todo.ts
│   └── styles/
│       └── index.css
└── README.md

实现 Todo App 的核心逻辑：
- 状态管理使用 useState
- 支持添加、删除、切换完成状态
- 数据持久化到 localStorage
- 添加优雅的动画效果

现在让我们：
1. 在 TodoItem.tsx 中添加编辑功能
2. 在 TodoList.tsx 中添加过滤功能（全部/已完成/未完成）
3. 在 App.tsx 中整合这些功能

User: 解释一下 React Hooks 的闭包陷阱

Claude: [详细解释 + 代码示例]

[选中一个函数]
Cmd + K
Prompt: 添加错误处理和 loading 状态

Cmd + I
Prompt: 添加用户认证系统，包括登录、注册、密码重置

1. 需求分析（Chat）
   "我想添加用户评论功能，需要哪些步骤？"
   
2. 架构设计（Chat）
   "推荐一个评论系统的数据库设计"
   
3. 代码生成（Composer）
   "创建评论系统的前后端代码"
   
4. 细节调整（Inline）
   [选中具体代码] Cmd+K "优化这段代码的性能"
   
5. 测试（Chat）
   "为评论功能生成单元测试"
   
6. 文档（Chat）
   "生成 API 文档"

创建一个 [功能名称]，要求：
- 功能1
- 功能2
- 功能3

技术栈：[React/Vue/...] + [TypeScript/...] + [其他]
代码风格：[简洁/详细注释/...]

当前代码存在问题：
[描述问题]

期望行为：
[期望结果]

请帮我修复并解释原因

优化以下代码：
- 性能优化
- 可读性提升
- 添加错误处理
- 遵循最佳实践

[粘贴代码]

请解释这段代码：
[粘贴代码]

包括：
1. 整体功能
2. 关键步骤
3. 最佳实践
4. 潜在问题

方法1: 使用 @ 符号引用
"基于 @database.ts 中的类型，创建API"

方法2: 在 Composer 中添加文件
点击 "Add Context" → 选择相关文件

太长: "请简明扼要地..."
太短: "请详细解释，包含代码示例..."

刚才的代码在运行时报错：
[错误信息]

请修复