🤖 AI 工具

claude code on the web 的使用场景是什么？

claude code on the web 的使用场景是什么？

✍️ Jeffrey

一周前，收到Anthropic 官方邮件，说给max用户赠送了 1000美元 额度的claude code web版本的额度，这个时候我才发现Anthropic开发了这么一项功能。

之前也听到过一些，但是没有怎么关注过。 因为笔者主要做移动端和web端开发，也想不出这种功能会在什么场景下使用。

在浏览器上面，直接打开网页 https://claude.ai/code，便可以进入到claude code on web 。 这个工作区间比较有趣，必须关联到github账号，从github中选取一个项目，在这个基础上面进行查看或者开发。

claude code 定位尴尬的地方

其开发代码空间在github上面，目前只支持选择一个项目，但是无法选择这个项目的具体分支，但是可以通过对话的方式让其查看对应的分支内容。 这个让我感觉很不方便，不够直观。 并且可以配置一个环境，可以访问网络。

但是如果我开发iOS或者安卓的原生代码，既没有办法直接运行也更不能直观地看到效果，感觉可用性大大折扣。 所以我想了很久这个使用场景。 倒是发现也是有几个地方可以用到。

claude code 使用场景

一、阅读和理解代码

这个是我首先想到的用法，不需要将代码下载到本地，甚至可以直接在手机上面进行。 直接分析代码进行解读，帮我们更好地去理解某个项目代码以及遇到的问题。

比较适合是因为不需要下载和运行，但是也刚好可以看到整个项目的内容。

同样不需要本地运行,可以为代码生成相关的文档。因为其 Claude Code on Web 端有调用和使用 Git 工具的权限,则可以对 Pull Request 进行代码审查,执行合并任务。

具体应用：

  • 自动生成 API 文档
  • 为函数和类生成注释
  • 审查 PR 中的代码变更
  • 检查代码规范和最佳实践
  • 自动创建变更摘要

根据 Anthropic 官方的说明,Claude Code on Web 可以自动创建 PR 并提供清晰的变更摘要,这大大提高了代码审查的效率。

三、并行处理多个独立任务

这是 Claude Code on Web 最强大的功能之一。与命令行版本一次只能处理一个任务不同,Web 版本允许你同时运行多个独立的编码任务,每个任务在独立的隔离环境中运行。

典型场景：

  • Bug 修复积压处理: 可以同时启动多个会话,每个会话处理一个 Bug
  • 并行开发不同功能: 在不同的仓库中同时开发多个独立功能
  • 同时进行重构和新功能开发: 一个会话处理代码重构,另一个会话添加新功能

例如,你可以：

会话 1: 修复用户认证相关的 Bug 
会话 2: 更新 API 文档 
会话 3: 重构数据库查询代码 
会话 4: 添加新的测试用例

所有这些任务可以同时进行,极大提高了开发效率。每个会话完成后会自动创建 PR,你只需要审查和合并即可。

四、后端开发和 API 开发

对于后端项目,Claude Code on Web 特别有用,因为：

  1. 可以编写测试并验证: Claude 可以先编写测试用例,然后编写代码使测试通过
  2. 无需本地环境: 很多后端项目需要复杂的本地环境配置,使用 Web 版本可以在云端直接运行
  3. 数据库迁移和脚本: 可以生成和测试数据库迁移脚本
  4. API 端点开发: 编写 RESTful API 端点并测试

配合工具使用: 开发者可以结合 Apidog 等 API 测试工具,在 Claude Code 生成 API 代码后立即进行测试和调试。

五、处理常规维护任务

根据 Anthropic 官方建议,Claude Code on Web 特别适合以下维护性任务：

  • 回答关于项目的问题: 了解仓库结构和功能实现
  • Bug 修复: 处理定义明确、不需要频繁调整的 Bug
  • 日常维护任务: 更新依赖项、修复 linting 错误、代码格式化等

六、移动办公和远程协作

Claude Code on Web 还提供了 iOS 应用版本,这意味着你可以：

  • 通勤时启动任务: 在上班路上用手机启动编码任务
  • 监控进度: 随时查看任务执行进度并进行调整
  • 紧急修复: 当出现紧急 Bug 时,即使不在电脑前也能快速响应

而且,你还可以使用”teleport”功能,将云端任务的对话记录和编辑的文件传输到本地的 Claude Code CLI 工具,继续在本地完成任务。

七、非技术人员的”Vibes Coding”

近期出现的”Vibes Coding”概念让非工程师也能使用 AI 编程工具。Claude Code on Web 通过浏览器界面降低了使用门槛：

  • 产品经理可以直接描述需求,让 Claude 生成原型代码
  • 设计师可以将设计稿转换为代码
  • 内容创作者可以生成简单的工具和脚本

优化使用的技巧

1. 使用 CLAUDE.md 文件

在项目根目录创建 CLAUDE.md 文件,写入项目的通用规则和上下文信息：

# 项目规则 
- 使用 TypeScript 
- 遵循 Airbnb 代码风格 
- 测试覆盖率需达到 80% 
- 所有 API 端点需要添加文档注释

2. 为每个任务创建 ISSUE.md

对于复杂任务,创建详细的需求文档：

# 需求 
实现用户登录功能 

# 步骤 
1. 创建登录 API 端点 
2. 添加表单验证 
3. 实现 JWT token 生成 
4. 编写单元测试 

# 注意事项 
- 密码需要加密存储 
- 登录失败 3 次后锁定账户

3. 利用并行任务提高效率

不要让任务串行执行,而是将独立的任务分配到不同的会话中并行处理。这类似于 CI/CD 中的并行任务执行,大大提高了效率。

安全性考虑

Claude Code on Web 运行在 Anthropic 管理的云基础设施上,每个会话都在隔离的沙箱环境中运行,具有文件系统和网络限制。Git 交互通过自定义代理进行,使用有限范围的凭证,只允许访问授权的仓库。

你可以配置三种网络访问级别：

  1. 完全锁定: 无网络访问
  2. 白名单模式: 只能访问指定域名
  3. 完全访问: 可以访问所有域名(需谨慎使用)

总结

Claude Code on Web 虽然对于需要图形界面预览的移动端和前端开发不太友好,但在以下场景下非常有价值：

  1. 代码理解和学习 – 无需下载即可分析代码
  2. 文档生成和代码审查 – 自动化文档和 PR 审查
  3. 并行任务处理 – 同时处理多个独立的开发任务
  4. 后端和 API 开发 – 在云端直接开发和测试
  5. 日常维护任务 – 处理 Bug 修复和代码更新
  6. 移动办公 – 随时随地监控和启动任务
  7. 降低编程门槛 – 让非技术人员也能参与代码开发

对于后端开发者、DevOps 工程师、以及需要处理大量 Bug 修复和维护任务的团队来说,Claude Code on Web 是一个强大的生产力工具。特别是其并行任务处理能力,可以将开发效率提升到一个新的水平。

虽然它不能完全替代传统的开发环境,但作为一个补充工具,Claude Code on Web 在特定场景下确实能带来显著的效率提升。如果你是 Pro 或 Max 用户,不妨尝试一下,也许会发现更多适合你工作流程的使用方式。