大家好，我是讯享网，很高兴认识大家。这里提供最前沿的Ai技术和互联网信息。



GPT plus 代充 只需 145

今天首次使用 Claude Code，完成了三个应用的开发，花费约7美元。部分修改借助了Cursor中的GPT-4o mini。

以下是第一个应用——交互式电子艺术书：
- 顶部支持按类别筛选
- 点击下一页时呈现翻译动画效果
- 鼠标悬停可放大查看细节
- 底部显示作品简介
- 通过快捷键 R 可实现艺术品的旋转展示

此外，还可以通过按键T来切换主题。第二个应用是一个3D台球游戏。当鼠标移动并点击时，可以看到球的运动轨迹。

第三个应用是使用 React Router V7 开发的 GPT-4o Mini 音频转录工具。上传音频文件后，下方提供转录设置选项，包括语言选择（如中文）、创造性调节和提示词设置。

Claude Code 的安装过程较为简单，只需执行指定命令即可。安装完成后，在终端输入 “claude” 命令，系统将显示欢迎页面。用户可在此选择主题和登录方式。本文示例采用 API 登录方式。

Claude Code 会询问是否使用默认终端设置，通常选择默认选项即可。系统还会提示是否信任文件夹内的文件，选择 “1” 确认后，Cursor 编辑器中将自动安装 Claude Code 插件。

通过斜杠命令可查看多种功能选项，包括：
- 工具权限管理
- 终端设置
- GitHub 应用安装
- 配置管理

Claude Code 提供以下实用快捷键：
- Shift+Tab：自动确认操作
- #：创建记忆
- @：指定文件或文件夹
- ESC：退出
- Ctrl+R：输出详细信息

初次使用时，可通过提示功能让系统了解代码库。示例中，系统成功总结了仅包含 Doc 文件的项目内容。

Claude Code 内置多种实用工具：
- Bash
- 文件搜索
- 文件读写
- WebFetch
- 搜索功能
- Todo 管理（特别实用）
- 子代理功能

此处展示的是更新待办事项的功能。系统会根据用户需求列出清晰的待办列表，并在完成时逐项标记。当需要确认文档编辑时，系统会显示相应提示。

Claude Code工程师分享道：给Claude的提示无需过于复杂。例如”Commit a Push PR”这样简短的指令，模型也能准确理解。以下是几个常见工作流示例：

1. 让Claude Code进行计划、确认、编程并提交
   
2. 要求编写测试用例
   
3. 指定编写代码任务，并要求附带截图反馈以便后续迭代

Claude Code的工程师强调，若要获得更优结果，需提供更充分的上下文。可通过多种途径为Claude增添上下文，例如Claude文档、指定文件名等。MCPresources功能也将上线，相关文件会自动添加至对话中。

你可以在 Claude文件夹 下创建 Claude Markdown 文件，或在项目根目录下创建 Claude Markdown 文件。这些文档可在需要时通过输入命令加入上下文。

Claude Code支持此类命令，便于一次性完成任务。其高级用法包括在多个终端中使用不同checkpoint，并通过GitHub Actions并行开启工作。

首先，我们来看这个应用的制作过程。我使用GPT-4o mini设计了一个模板，并提供了相应的提示。这个模型是我近期常用的工具。它生成的PRD文档内容相当完整。随后，我将PRD文档导入新项目，在终端输入Claude Code开始对话。我的提示很简单：根据文档编写代码。很快，它就开始编辑文件。

界面左侧显示了使用的工具，如Write和Todoes。右上角可以看到Cursor中安装了Claude Code插件，点击即可快速运行。Claude会自动标记已完成的任务，并通知应用开发完成。我们可以在终端查看具体修改内容。

遇到错误时，我将控制台的bug信息发送给它进行修复。但这次它未能立即解决问题。在Anthropic后台看到这个应用花费了0.5美元。于是，我改用Cursor中的Claude Sonnet 4进行修改。Cursor反馈某些ID在MetaMuseum的API中不存在，需要进行调整。经过几次小修改后，应用终于可以正常使用。整个过程仅需4-5次提示，就能通过Claude Sonnet 4生成功能完整的应用，效果令人满意。

接下来是第二个案例：使用Claude Code开发的3D台球游戏。我提供了简单的提示词，它先进行规划并展示Todoes列表。完成所有任务后，通知我可以打开游戏。但运行时持续报错，我将控制台信息发送给它，要求搜索网络并给出解决方案。它找到了10个相关结果并进行修改。

虽然Claude Code未能完全解决这个问题，但通过将代码发送给GPT-4o mini后，它发现问题的根源：CDN上可用的cannon.js版本只有0.6.x。最终，它给出了一个最小改动方案来解决这个问题。

我将此方案直接复制并发送至Cursor，由其进行修改。

之后即可正常运行，呈现预期效果。最后，我们将探讨音频转录工具的实现方法。

Claude Code非常强大，能够直接生成可运行的应用。随后，我添加了转录设置，并优化了界面设计。可以看到，标题与背景颜色非常接近。经过进一步调整后，最终将应用布局改为左右分栏。该应用使用了Replicator中的API。

OpenAI的GPT-4o mini转录工具效果出色，官方文档和博主测试都证实了其中文转录能力。Replicator右侧的便捷按钮可将文档直接发送至大语言模型。我将文档保存在Markdown文件中，并提示Claude Code根据文档生成一个React Router V7应用，该应用支持将上传的音频转录为文字，并允许选择英文或中文作为转录语言。

由于Claude Sonnet 4的知识库截止日期为今年3月，而React Router V7是去年底发布的，因此本次操作也是对模型掌握新文档信息能力的测试。运行过程中，系统会显示Bash命令并询问操作方式，我选择让程序自动执行。很快左侧便生成多个文件，同时更新了待办事项列表：先初始化，后设置。在项目文档编辑时，系统会请求确认，我通常使用Shift+Tab快捷键自动接受。

Claude Code提示若需连接真实API则需修改方法，这正是我的需求。修改后运行时遇到问题，系统直接反馈错误信息。Claude Code新增的测试按钮可验证API工作状态，检测显示意外状态204，经调整后应用恢复正常运行。随后我要求增加更多选项，并指出当前设计过于单调，建议融入声音相关元素，同时启用Ultra Thinker模式最大化思维潜力。

最终效果包含丰富的声波动画等声音元素，文件拖拽区域也呈现动态效果。在Cursor或VSCode中使用Claude Code时，其Diff视图功能可清晰追踪代码修改记录。

在上方，我们可以看到前缀为 Claude Code，右侧有一个勾选标记，表示接受其修改。若存在多条修改建议，可通过上下键切换查看。

这是内置的 Diff 视图 功能，也可通过右上角的三点菜单切换为并排对比模式。

以上即为今日分享的主要内容。

今天是我首次使用Claude Code，它能够很好地处理最新的React Router V7，过程中没有出现语法错误，这一点令我满意。在处理过程中，它调用了搜索和Fetch工具，但整体处理能力一般。遇到复杂问题时，我更倾向于使用GPT-4o mini进行搜索。

之前我曾推荐过使用Claude客户端，Plus会员可以直接使用Claude的Sonnet 4来创建应用，这样无需额外支付API费用或升级到Max版本。不过总体而言，Claude Code比Claude的Sonnet 4使用起来更加便捷。对于重度用户，我推荐订阅Claude Max和Claude Code，它们提供了更多高级功能，建议多参考官方文档。

以上就是我的分享。如果喜欢我的视频，欢迎加入我的知识星球。