零基础实战:2小时用Claude Code做一个自己的「网页监控机器人」

· 小白基础技术分享

微博热搜上有一条”AI帮你开发以前要花钱的功能”引发大量讨论。很多人第一次意识到:过去需要花钱请程序员做的事,现在自己跟AI说几句话就能搞定。

这篇文章就用一个真实案例带你走一遍完整流程:用Claude Code从零开发一个监控网页变化并自动推送通知的小工具。不需要你会写代码,只需要会描述需求。

目标:我们要做什么?

一个网页监控机器人,功能如下:

– 定时检查指定网页是否有更新

– 检测到变化时自动推送到企业微信/钉钉

– 把变化内容记录下来方便回溯

这个功能在很多场景下有用:监控竞品官网变更、追踪政策文件更新、盯商品价格变动等。如果请人开发,报价通常在2000-5000元。现在用AI,成本接近于零。

前置准备

1. 安装Claude Code(需要Node.js 18+):

npm install -g @anthropic-ai/claude-code

2. 准备一个企业微信群机器人Webhook地址(钉钉同理,飞书也行)。在企业微信群设置→群机器人→添加→复制Webhook地址。

3. 创建一个项目目录:

mkdir web-monitor && cd web-monitor

第一步:用自然语言描述需求

打开终端,进入项目目录,启动Claude Code:

claude

然后输入以下指令(直接复制粘贴,不要改):

帮我创建一个网页监控工具,要求:
1. 用Node.js写,使用axios发请求、cheerio解析HTML
2. 支持配置文件指定要监控的URL列表
3. 每次检查后把网页内容hash存下来,下次对比
4. 检测到变化时通过企业微信webhook发送通知
5. 用node-cron定时执行(默认每30分钟)
6. 把所有代码写在一个index.js文件里
7. 配置单独放在config.json

Claude Code会自动生成完整的代码。大约需要1-2分钟。

第二步:检查AI生成的代码

AI生成完代码后,先不急着运行。跟它说:

检查一下代码有没有安全隐患,特别是:
- webhook URL有没有硬编码
- 有没有处理网络超时
- hash比对逻辑是否正确
- 错误处理是否完善

这一步很重要——AI写的代码需要你来把关。如果有问题,直接让它修:

把webhook URL改到config.json里配置,不要硬编码。

第三步:配置并运行

创建config.json

{
  "urls": [
    {
      "name": "示例网站",
      "url": "https://example.com",
      "selector": "body"
    }
  ],
  "webhookUrl": "你的企业微信webhook地址",
  "intervalMinutes": 30,
  "hashFile": "./.hashes.json"
}

安装依赖:

npm init -y
npm install axios cheerio node-cron

运行:

node index.js

第四步:验证效果

修改config.json中监控的URL为一个确实会变化的网页(比如你自己的博客),等30分钟或手动触发一次检查,看企业微信是否收到通知。

常见失败处理:

– 如果没收到通知:检查webhook URL是否正确,可以先手动curl测试;

– 如果hash比对不生效:检查.hashes.json文件是否正常生成和更新;

– 如果定时任务不触发:确认node-cron表达式是否正确。

进阶:装上agent-skills提升AI代码质量

如果想进一步提升AI生成的代码质量,可以使用前面介绍过的agent-skills:

git clone https://github.com/addyosmani/agent-skills .agents

然后告诉Claude Code:

在写代码之前,先读取.agents/目录下的skill文件,
特别是code-review.skill和testing.skill。
按照这些规范来写代码。

这样AI生成的代码会有更规范的错误处理、更好的代码结构。

花费多少?

– Claude Code API费用:约$0.50-1.00(取决于交互轮数)

– 服务器(如果部署在云上):用最便宜的VPS即可,约$5/月

– 总成本:第一次不到10块钱,后续每月30多块

对比请人开发的2000-5000元,这个投入产出比是200倍以上。而且你学会了这套方法,下次做别的工具就更快了。

AI时代,”会不会写代码”不再是门槛——“知不知道让AI做什么”才是。


— END —
LC 智趣厅 · 科技与生活的交点
ihygg.cn

Scroll to Top
微信公众号:LC智趣厅

扫码关注微信公众号
LC智趣厅