# 链上ETF研发日志 #5：测试网上线！

By [Keegan小钢](https://paragraph.com/@keeganlee) · 2025-08-04

---

这是我正在开发的链上 ETF 项目「**BlockETF**」的第五篇研发日志。

前四篇分别是：

1.  [链上ETF重启Day 1：重新出发，我终于开始写代码了](https://mp.weixin.qq.com/s?__biz=MzA5OTI1NDE0Mw==&mid=2652495196&idx=1&sn=8d9e28629087ca2c72dd532e6cdf8725&scene=21#wechat_redirect)
    
2.  [链上ETF研发日志 #2：智能合约开发完毕，测试准备中](https://mp.weixin.qq.com/s?__biz=MzA5OTI1NDE0Mw==&mid=2652495207&idx=1&sn=693518d92dbe698ce667191875b698c7&scene=21#wechat_redirect)
    
3.  [链上ETF研发日志 #3：合约测试完成](https://mp.weixin.qq.com/s?__biz=MzA5OTI1NDE0Mw==&mid=2652495212&idx=1&sn=eb179035526d320cbdbdb844a95bab32&scene=21#wechat_redirect)
    

今天是启动该项目后的第 9 天，**BlockETF 正式上线测试网**，地址是：

👉 [https://testnet.block-etf.com](https://testnet.block-etf.com/)

![](https://storage.googleapis.com/papyrus_images/fe257ae2959225ed790b96f662bf4eb7f00f9a573dd590c8735e72e6b03795f3.png)

从第一行代码到今天上线的原型，已经完整经历了一个 Dapp 从零开始的构建流程：

*   🧠 **合约逻辑**：支持 USDT 申购、赎回，自动按成分币比例换仓
    
*   ✅ **测试用例**：共计 220+，覆盖核心逻辑与异常路径（AI 帮大忙）
    
*   💻 **前端界面**：完成了钱包连接、ETF 资产查看、申购交互等功能
    
*   🚀 **部署流程**：目前部署在 BSC 测试网，后续将支持主网发布
    

整个前端项目从启动到上线，仅用了不到 3 天，每天投入的时间不超过 4 个小时。这个效率和我过去的开发节奏相比，真的像是坐上了火箭。

> 更有意思的是：**我没有手写任何一行前端代码。**

整个过程中，我甚至没有 review 任何前端代码。我的工作基本就是在体验 UI 页面时发现问题，然后把问题反馈给 Claude Code，让它去查错、重写、优化。有些问题 Claude 尝试了好几种方法都没解决，最后我换了一个提问方式，它才成功修复。这过程非常像是在带一个“不吃饭不请假”的远程实习生做事：需要你耐心地指导，但也确实能节省大量体力活。

### 💡 我是如何用 Claude Code 完成整个前端的？

合约部署完成后，我对 Claude 说：

> “现在合约已经部署了，请帮我从零开始搭建前端项目。”

Claude 非常快地做出反应，给我推荐了合理的技术栈（我只确认了下它选的库有没有过时），并列出每个页面需要包含的元素和功能。最终我们确定使用的前端技术栈是：

*   **Next.js**：用于构建 SSR 项目
    
*   **Wagmi + RainbowKit**：用于钱包连接和合约交互
    
*   **Tailwind CSS**：快速开发响应式样式
    
*   **shadcn/ui**：组件库，简洁好看、和 Tailwind 配合默契
    

Claude 帮我生成的第一版的原型页面是长这样的：

![](https://storage.googleapis.com/papyrus_images/3afec2d2d560945b179d29002b7b80986867893a4ea580e1e4650e1e3b64806d.png)

页面布局结构倒是挺清晰的，所有按钮和信息展示都用的是模拟数据。

接下来，我就开始让它一步步接入链上合约的数据，并添加申购 / 赎回功能。期间遇到了不少交互细节上的 bug：按钮点了没反应、钱包提交交易后页面没有状态信息、数据没刷新等等。我把这些问题现象逐条描述给 Claude，它就开始自行定位问题并修改代码。每当我发现问题还没解决，我就继续反馈。Claude 会再换一种写法重新尝试。

有时候，它会卡在某个问题上连续失败，这时我就需要从更高维度协助它重新审视问题，换个方式重新定位。一旦找准了问题根源，它还是能迅速地修复问题。

过程中它也帮我发现了几个隐藏 bug。比如，我在调试 UI 的时候，才发现 **XRP 和 SOL 的 Binance Oracle PriceFeed 无法访问**，这才意识到 Binance Oracle 相比 Chainlink 增加了访问控制——某些代币的预言机数据，不允许合约访问。最终我只能将原定的 5 个标的资产缩减为 3 个。

还有一些计划中的数据，比如用户持仓数据、分析图表等，本来是准备用 Subgraph 支持的。但目前还没来得及加，因此我就临时删掉了这部分。

此外，我一开始的 UI 是白色系的，后来觉得不好看，就让它整体改成了暗色系风格，并在视觉上做了一些美化。

最后的部署我选择用的是 **Vercel**。中间部署过程中也遇到几次失败，我把 Vercel 报错的日志直接贴给 Claude，它就一点点修复，最终部署成功。最后，我再配置了下自定义域名，整个发布流程就完成了。

### 🧠 总结一下我的感受

Claude Code 不完美，它不总是“一次搞定”，但它**把我的工作节奏变成了“提问 — 等待 — 验证”这种更高效的方式**，而不再是传统意义上的“查文档 — debug — 怀疑人生”。

它就像一个能听懂需求、懂语义的助理工程师，虽然有时候笨一点、需要我帮它理清问题，但它的存在让我可以把注意力集中在更重要的地方：**架构设计、机制逻辑、产品体验**。

换句话说，它帮我节省了大量体力活，把创造力留给了更关键的位置。对我这样一个独立开发者来说，这种“AI 驱动开发模式”已经成为我构建产品的默认方式了。

---

*Originally published on [Keegan小钢](https://paragraph.com/@keeganlee/etf-5)*
