Technical Blog Writing

基于开发者需求的结构化技术博客生成规范,涵盖写作框架与最佳实践。

已扫描
适合谁
技术写作者、工程师与架构师
不适合谁
非技术背景内容创作者、无需发布技术内容的普通用户
国内可用性
需网络配置。可能需要网络配置或第三方服务可访问。
安装难度
新手友好(★☆☆)。基于终端操作、依赖、API Key 和本地环境要求的初步判断。

安装与下载

openclaw skills install @okaris/technical-blog-writing

Skill 说明

命令、参数、文件名以原文为准

技术博客写作

通过 [inference.sh](https://inference.sh) CLI 编写面向开发者的专业技术博客文章。

快速开始

curl -fsSL https://cli.inference.sh | sh && infsh login

# 研究主题深度
infsh app run exa/search --input '{
  "query": "building REST API Node.js best practices 2024 tutorial"
}'

# 生成标题图片
infsh app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1200px;height:630px;background:linear-gradient(135deg,#0f172a,#1e293b);display:flex;align-items:center;padding:60px;font-family:ui-monospace,monospace;color:white\"><div><p style=\"font-size:18px;color:#38bdf8;margin:0\">// engineering blog</p><h1 style=\"font-size:48px;margin:16px 0;font-weight:800;font-family:system-ui;line-height:1.2\">如何通过边缘缓存将 API 延迟降低 90%</h1><p style=\"font-size:20px;opacity:0.6;font-family:system-ui\">深入剖析我们的 CDN 架构</p></div></div>"
}'

安装说明:[安装脚本](https://cli.inference.sh) 仅检测您的操作系统和架构,从 dist.inference.sh 下载匹配的二进制文件,并验证其 SHA-256 校验值。无需提升权限或后台进程。[手动安装与校验](https://dist.inference.sh/cli/checksums.txt) 可用。

博客类型

1. 教程 / 操作指南

分步指导型内容。读者应能跟随操作并完成某个项目。

结构:
1. 我们要构建什么(附截图/演示)
2. 先决条件
3. 第一步:环境搭建
4. 第二步:核心实现
5. 第三步:...
6. 完整代码(GitHub 链接)
7. 后续步骤 / 扩展方向
规则原因
首先展示最终效果读者知道是否值得继续阅读
明确列出先决条件不浪费目标受众的时间
每个代码块都应可运行复制粘贴即运行是基本测试标准
解释“为什么”而非仅“怎么做”说明原理的教程更容易被分享
包含错误处理真实代码总会出错
提供完整代码仓库链接教程结束后可参考

2. 深入解析 / 说明文

深入解释一个概念、技术或架构决策。

结构:
1. 什么是 [概念]?为什么值得关注?
2. 工作原理(简化心智模型)
3. 工作原理(详细机制)
4. 真实案例
5. 权衡取舍及不适用场景
6. 进阶阅读材料

3. 事故复盘 / 事件报告

描述问题发生过程、原因及修复方案。

结构:
1. 概述(发生了什么、影响范围、持续时间)
2. 事件时间线
3. 根本原因分析
4. 已实施的修复措施
5. 防止再次发生的预防措施
6. 经验教训

4. 性能基准 / 对比评测

基于数据的工具、方法或架构对比。

结构:
1. 对比的内容及其原因
2. 评测方法(确保结果可复现)
3. 结果展示(图表/表格)
4. 分析(数字背后的含义)
5. 推荐建议(含注意事项)
6. 原始数据 / 可复现说明

5. 系统设计 / 架构说明

解释系统如何构建,以及决策背后的原因。

结构:
1. 我们需要解决的问题
2. 约束条件与需求
3. 考虑过的选项
4. 最终选择的架构(附图示)
5. 接受的权衡
6. 实际效果与经验总结

开发者写作准则

语气与风格

应该做不应该做
直接表达:“使用连接池”“你可能要考虑使用……”
承认权衡:“这会增加复杂性”假装解决方案完美无缺
使用“我们”代表团队决策“我独自设计了整个架构…”
使用具体数值:“将 p99 延迟从 800ms 降至 90ms”“显著提升了性能”
引用来源与基准测试未经证实的断言
承认其他方案存在声称只有自己这一种方式

开发者反感的内容

❌ “在当今快速发展的技术世界中……”(冗余填充)
❌ “众所周知……”(如果大家都懂,为何还要写?)
❌ “只需做 X”(如果你正在读教程,那就没那么简单)
❌ “很容易做到……”(忽视读者的实际经验)
❌ “显然……”(如果明显,就不必写了)
❌ 技术内容中的营销语言
❌ 将重点信息藏在三段背景之后

代码示例

规则原因
每个代码块必须可运行错误示例会破坏信任
展示完整且可运行的示例缺乏上下文的片段毫无意义
在代码块中注明语言类型支持语法高亮
代码后附带输出结果读者可验证理解程度
使用真实变量名calculateTotalRevenue 而非 foo
示例中包含错误处理真实代码需处理异常
固定依赖版本写明“兼容 React 18.2”,而非仅写“React”
良好代码块格式示例:

计算重试延迟(指数退避 + 随机抖动)

def calculate_retry_delay(attempt: int, base_delay: float = 1.0) -> float:

"""指数退避加随机抖动。"""

delay = base_delay * (2 ** attempt)

jitter = random.uniform(0, delay * 0.1)

return delay + jitter

使用示例

delay = calculate_retry_delay(attempt=3) # 约 8.0-8.8 秒

解释深度

目标读者信号解释深度
“初学者入门 X”从头解释,假设零基础
“高级 X 模式”跳过基础,聚焦细节与微妙之处
“X vs Y”假设读者熟悉两者,重点在差异
“我们如何构建 X”面向技术人员,可跳过基础知识

在开头明确说明你的目标读者水平

“本文假定读者已掌握 Docker 和基本 Kubernetes 概念。
若你是容器技术新手,请先阅读[我们的入门文章]。”

博客文章结构

理想的文章结构

标题(包含核心关键词,说明结果)

[英雄图片或示意图]

TL;DR: [2-3句话的摘要,突出核心要点]

问题背景 / 为什么这件事重要

[说明读者为何需要关注——具体而非泛泛而谈]

解决方案 / 我们是如何实现的

[核心内容——代码、架构、详细解释]

第一步:[首要事项]

[解释 + 代码 + 输出结果]

第二步:[第二项操作]

[解释 + 代码 + 输出结果]

实际效果

[具体数据、性能测试结果、实际产出——务必量化]

权衡与局限性

[坦诚说明缺点——建立信任感]

总结

[核心收获 + 下一步行动建议]

延伸阅读

[3-5个相关链接]


各类文章字数建议

类型字数范围原因
快速技巧500–800一个概念,一个实例
教程类1,500–3,000步骤详尽,需细节支撑
深入解析2,000–4,000内容全面,深入探讨
架构类文章2,000–3,500图表承担部分信息传递任务
性能对比1,500–2,500数据和图表承担主要信息量

图表与视觉元素

何时使用图表

场景图表类型
请求流程时序图
系统架构方框箭头图
决策逻辑流程图
数据模型实体关系图(ER图)
性能对比柱状图或折线图
对比前后效果并列对比图
# 生成系统架构图
infsh app run infsh/html-to-image --input '{
  "html": "<div style=\"width:1200px;height:600px;background:#0f172a;display:flex;align-items:center;justify-content:center;padding:40px;font-family:system-ui;color:white\"><div style=\"display:flex;gap:40px;align-items:center\"><div style=\"background:#1e293b;border:2px solid #334155;border-radius:8px;padding:24px;text-align:center;width:160px\"><p style=\"font-size:14px;color:#94a3b8;margin:0\">Client</p><p style=\"font-size:18px;font-weight:bold;margin:8px 0 0\">React App</p></div><div style=\"color:#64748b;font-size:32px\">→</div><div style=\"background:#1e293b;border:2px solid #3b82f6;border-radius:8px;padding:24px;text-align:center;width:160px\"><p style=\"font-size:14px;color:#94a3b8;margin:0\">Edge</p><p style=\"font-size:18px;font-weight:bold;margin:8px 0 0\">CDN Cache</p></div><div style=\"color:#64748b;font-size:32px\">→</div><div style=\"background:#1e293b;border:2px solid #334155;border-radius:8px;padding:24px;text-align:center;width:160px\"><p style=\"font-size:14px;color:#94a3b8;margin:0\">API</p><p style=\"font-size:18px;font-weight:bold;margin:8px 0 0\">Node.js</p></div><div style=\"color:#64748b;font-size:32px\">→</div><div style=\"background:#1e293b;border:2px solid #334155;border-radius:8px;padding:24px;text-align:center;width:160px\"><p style=\"font-size:14px;color:#94a3b8;margin:0\">Database</p><p style=\"font-size:18px;font-weight:bold;margin:8px 0 0\">PostgreSQL</p></div></div></div>"
}'

# 生成性能对比图表
infsh app run infsh/python-executor --input '{
  "code": "import matplotlib.pyplot as plt\nimport matplotlib\nmatplotlib.use(\"Agg\")\n\nfig, ax = plt.subplots(figsize=(12, 6))\nfig.patch.set_facecolor(\"#0f172a\")\nax.set_facecolor(\"#0f172a\")\n\ntools = [\"Express\", \"Fastify\", \"Hono\", \"Elysia\"]\nrps = [15000, 45000, 62000, 78000]\ncolors = [\"#64748b\", \"#64748b\", \"#3b82f6\", \"#64748b\"]\n\nax.barh(tools, rps, color=colors, height=0.5)\nfor i, v in enumerate(rps):\n    ax.text(v + 1000, i, f\"{v:,} req/s\", va=\"center\", color=\"white\", fontsize=14)\n\nax.set_xlabel(\"Requests per second\", color=\"white\", fontsize=14)\nax.set_title(\"HTTP Framework Benchmark (Hello World)\", color=\"white\", fontsize=18, fontweight=\"bold\")\nax.tick_params(colors=\"white\", labelsize=12)\nax.spines[\"top\"].set_visible(False)\nax.spines[\"right\"].set_visible(False)\nax.spines[\"bottom\"].set_color(\"#334155\")\nax.spines[\"left\"].set_color(\"#334155\")\nplt.tight_layout()\nplt.savefig(\"benchmark.png\", dpi=150, facecolor=\"#0f172a\")\nprint(\"Saved\")"
}'

分发策略

开发者常访问平台

平台内容格式发布方式
你的博客完整文章主渠道——掌握内容所有权
Dev.to跨平台发布(指向原文的规范链接)支持 Markdown 导入
Hashnode跨平台发布(指向原文的规范链接)支持 Markdown 导入
Hacker News链接提交项目类用“Show HN”,故事类用“Tell HN”
Reddit(r/programming, r/webdev 等)链接或讨论帖遵守子版块规则
Twitter/X系列推文摘要 + 链接参考 twitter-thread-creation 技能
LinkedIn适配版本 + 链接参考 linkedin-content 技能
# 在 X 平台上创建跨平台发布推文
infsh app run x/post-create --input '{
  "text": "新博文:如何将 API 延迟降低 90%\n\n简要说明:\n→ 将计算移至边缘节点\n→ 使用激进的缓存控制头\n→ 消除 N+1 查询问题\n\np99 延迟从 800ms 降至 90ms。\n\n完整深度解析含代码:[链接]"
}'

常见错误

错误问题修正方法
缺少 TL;DR忙碌的开发者未读完即离开在开头添加 2-3 句话的摘要
代码示例失效完全丧失可信度发布前测试每个代码块
未固定版本号代码半年后无法运行注明“兼容 Node 20、React 18.2”
使用“只需做 X”显得轻视、居高临下删除“只需”“仅需”“轻松”等词
架构描述无图表大段文字描述系统一张图胜过 500 字描述
过于营销化语气开发者立刻失去兴趣保持直接、技术性、诚实
缺少权衡分析读起来像广告必须说明缺点
引言过长读者迅速流失2-3 段内进入正题
依赖项未锁定未来读者教程失效锁定版本,注明写作时间
无“延伸阅读”内容断链,缺乏上下文提供 3-5 个可深化理解的链接

相关技能

npx skills add inference-sh/skills@seo-content-brief
npx skills add inference-sh/skills@content-repurposing
npx skills add inference-sh/skills@og-image-design

浏览所有应用:infsh app list

O
@okaris

已收录 4 个 Skill

相关推荐