我用OpenClaw写代码，1天上线，老板追着给我涨工资！

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

🌟 开场：一个代码小白的逆袭

说心里话，在遇到 OpenClaw 之前，我对编程完全是一窍不通。什么服务器、Linux 系统，对我来说简直就是天书。 但在深入体验 OpenClaw 后，我发现这玩意儿简直是个神器。 我当时脑子里冒出一个念头：能不能弄个全网热搜聚合工具？把微博、知乎、B站、抖音这些平台的热点全塞到一个页面里，省得一个个去翻，多省事！ 最后的结果：靠着 OpenClaw 和我那几句“大白话”，我从零开始，硬是搞出了一个涵盖 54 个数据源的每日热榜（每小时自动更新，也能手动刷新）。 PS：虽然界面看着有点“直男审美”，但我毕竟不会写代码，大家凑合看哈~~~ 整个过程我其实只干了一件事：直接跟 OpenClaw 提要求。

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

📚 灵感来源：站在巨人的肩膀上折腾

技术底座

这项目不是我凭空捏造的，是借鉴了两个非常牛逼的开源项目：

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

为什么要用它们？

DailyHotApi 的亮点：

• ✅ 平台超级全，54 个源几乎涵盖了主流媒体
• ✅ 支持 Docker 部署，省心省力
• ✅ 数据抓取很及时，保证新鲜度
• ✅ API 接口写得很标准，调用起来不费劲 ElaAdmin 的亮点：
• ✅ 纯静态页面，不用折腾复杂的 npm 环境
• ✅ 响应式布局，手机看也很舒服
• ✅ 颜值在线，自带的深色模式很护眼
• ✅ 彻底开源，想怎么改就怎么改

🔧 骚操作：我是如何“魔改”它们的

1. 极简部署法

原项目部署方式挺多，但我手里的 R2S 性能有限，得找个最省资源的法子。 最终方案：

# 1. 直接跑 Node.js
cd DailyHotApi
npm install
pm2 start
# 2. 用 Nginx 搞定静态资源
apt-get install nginx
cp -r dist/* /var/www/elaadmin/

实际效果：内存占用直接从 Docker 模式的 500MB 多掉到了 100MB 以内，简直是老旧设备的福音！

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

2. 用嘴写代码

这是最让我感到震撼的地方。我虽然一行代码都不会敲，但我会提要求啊： 我当时是这么跟 OpenClaw 说的：

“帮我撸一个热榜的网页界面，要深色调的。左边放分类导航，右边放热榜卡片。数据直接调我家里 R2S 路由器上跑的那个 API。” OpenClaw 的一连串动作：

3. 功能大升级

🏗️ 施工日志：我是怎么一步步搞定的

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

第一步：后端 API 搞起来（在 R2S 上）

目标：让 R2S 跑起 DailyHotApi。 我的选择：

• 环境：Node.js 22.x（直接跑，不加 Docker 这个“中间商”）
• 管家：PM2（保证挂了能重启，还不占内存）
• 数据库：直接存 JSON（够轻量，没必要动用大型数据库） 主要命令：

# 1. 装环境
curl -fsSL https://deb.nodesource.com/setup_22.x | sudo -E bash –
apt-get install -y nodejs
# 2. 拉代码
git clone https://github.com/imsyy/DailyHotApi.git
cd DailyHotApi
npm install
# 3. 启动
pm2 ecosystem.config.js
pm2 startup
pm2 save
# 4. 瞅一眼通没通
curl http://localhost:6688/bilibili

资源消耗情况：

第二步：把前端界面捏出来

目标：弄个好看的“脸面”来展示热榜。当时 OpenClaw 提醒我 R2S 内存太金贵，所以我选了最省钱的法子。 技术方案：

• UI 工具：Bootstrap 5（直接引用在线链接，不占地方）
• 骨架：ElaAdmin（静态 HTML 搞定一切）
• 皮肤：自己写的深色 CSS 代码长啥样：

/var/www/elaadmin/
├── index.html # 入口文件
├── assets/
│ ├── css/
│ │ └── theme.css # 自定义的“皮肤”
│ └── js/
│ └── hot-app.js # 处理数据的脚本
└── data/ # 数据的快捷方式

核心结构：

<div class="d-flex vh-100">
<nav class="sidebar" style="width: 260px;">
<!– 侧边栏分类 –>
<ul class="nav flex-column" id="category-nav">
<li><a href="#" data-category="video">📺 视频直播</a></li>
<li><a href="#" data-category="social">💬 社交热点</a></li>
</ul>
</nav>
<main class="flex-grow-1 overflow-auto">
<div id="hot-grid" class="hot-grid"></div>
</main>
</div>

Nginx 的配置：

server {
listen 8888;
root /var/www/elaadmin;
index index.html;
location /data/ {
alias /var/www/elaadmin/data/;
autoindex on;
}
}

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

第三步：打通公网访问（腾讯云 + R2S 联动）

目标：出门在外也能随时看热榜。 逻辑草图：

手机/电脑 ──▶ 腾讯云(80端口) ──▶ 加密隧道 ──▶ 家里的R2S(8888端口)

为啥这么费劲？

# 在云服务器上操作
ssh -f -N -p 60022 -L 0.0.0.0:18888:localhost:8888 root@127.0.0.1
# 弄成开机自启
cat > /etc/systemd/system/hot-tunnel.service
systemctl enable hot-tunnel

云端的 Nginx 转发：

server {
listen 80;
server_name _;
location / {
proxy_pass http://127.0.0.1:18888;
proxy_set_header Host $host;
add_header X-Frame-Options "SAMEORIGIN" always;
add_header X-Content-Type-Options "nosniff" always;
}
}

🎨 界面二次开发的小技巧

1. 怎么跟 AI 沟通你的需求

别这样说：

“帮我弄个漂亮的网页。”（AI 会一脸懵逼） 建议这样说： “帮我写个深色背景的页面。左边放一个能选分类的侧边栏，右边用卡片式的布局展示内容。每个卡片里要能看到平台名字、刷新按钮，还有新闻列表。” OpenClaw 能听懂的关键词： | 关键词 | 例子 | | — | — | | 颜色 | 深蓝、亮紫、#1e1e2e | | 尺寸 | 宽度 300px、间距 20px | | 结构 | 弹性布局、卡片流、侧边栏 | | 组件 | 按钮、导航、卡片 | | 动作 | 点击刷新、异步加载、定时任务 |

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

2. 选什么模板最靠谱

避坑指南：

• ❌ 不要用 Vuestic 之类的，太吃内存，配置起来想撞墙。
• ❌ 复杂的 Vue/React 管理后台，对小白不友好。 推荐清单：
• ✅ ElaAdmin，纯静态，轻如鸿毛。
• ✅ Adminator，也是极简风格。
• ✅ 直接找 Bootstrap 的官方例子。

3. 几个常用的修改点

换个心情（改颜色）：

:root {
–bg-primary: #1e1e2e;
–bg-card: #2d2d3d;
–accent: #3b82f6;
–text-primary: #e0e0e0;
}

重新归类：

const categories = {
video: {
name: '刷视频',
icon: '📺',
platforms: ['bilibili', 'douyin', 'kuaishou']
}
}

🔐 安全问题：我是怎么防范的

安全思路（大多是 OpenClaw 帮我出的主意）

四重锁：

# 看看公网能不能直接摸到家里的路由器
curl http://你的公网IP:8888
# 报错就对了！
# 试试走云服务器访问
curl http://你的域名
# 正常显示页面，说明成了！

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

📱 怎么使用？

浏览器直接看

虽然 UI 还有点简陋，但功能全：

• ✅ 深色模式，熬夜看也不刺眼
• ✅ 手机电脑都能看，自动适配
• ✅ 分类清爽，54 个平台随便挑
• ✅ 都是实时数据，不用担心过时

在 OpenClaw 里用

直接问：

“帮我看看现在微博上都在聊啥。” 设个提醒： “每天早晨吃早饭的时候，把知乎头条发给我。” 改改参数： “把 B 站热榜的显示条数改成 20 个。”

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！

💡 最后的一点感悟

1. 别盲目追求新技术，适合自己的才是最好的

Docker 虽好，但我的 R2S 跑不动，那就果断放弃，选最轻量的 Node.js。如果你要把这套东西搬到云上，直接跟 OpenClaw 说，它也能帮你搞定。

2. “说人话”也是一种编程能力

OpenClaw 让我明白，不懂代码也能做产品。最关键的是你得知道自己想要什么，并且能清晰地把它表达出来。逻辑清晰比死记硬背语法有用得多。

3. 大项目要拆开来做

别想着一口气吃个胖子，我是分三步走的：

4. 安全这根弦不能松

从一开始我就没打算让家里的路由器裸奔。用 SSH 隧道虽然多了一步，但心里踏实。这种“最小暴露”的思路，是保证系统不被黑的关键。

手把手教你一键部署OpenClaw（Clawdbot），2分钟搞定！