OpsKitPro logo
OpsKitPro_
返回部落格
工程2026-04-226 min

服務矩陣、國際化與 Cloudflare 部署:OpsKitPro 的工程收斂

把普通工具統一成標準卡片,Tools 保留獨立風格,再把整站部署到 Cloudflare Workers。

這裡是主站的整理版,必要時可以回到下方文章列表繼續看。
瀏覽文章列表
服務矩陣、國際化與 Cloudflare 部署:OpsKitPro 的工程收斂
關於正文

這裡按主站文章來整理,保留要點與結構,方便快速閱讀。

正文

服务矩阵是站点的“导航总览”

01

服务矩阵不是单纯的工具列表,它更像站点的中央目录:普通运维工具、密码管理、安全分析、自动化、云原生、零信任、AI 节点都能在这里被快速定位。

我后来把大多数工具统一成标准卡片,只保留 Tools 使用独立视觉,是因为服务矩阵本身必须稳定、可扫视,不能每一块都抢注意力。

參考檔案src/app/services/ServicesClient.tsxsrc/dictionaries/zh.jsonsrc/dictionaries/ja.jsonsrc/dictionaries/en.jsonsrc/dictionaries/tw.json

国际化不是“翻译文件”,而是页面节奏

02

项目的多语言不只是文案翻译,而是整个页面节奏都要重做一遍。日文更偏克制、中文更偏直接、英文更偏线性说明,标题长度、 badge 位置、行距和空白都需要跟着变。

这也是为什么我一直在调整首页、about、blog、tools 的视觉密度:同一份信息,在不同语言里不应该有完全不同的阅读压力。

參考檔案src/middleware.tssrc/components/LanguageToggle.tsxsrc/dictionaries.ts

Cloudflare Workers 是这个项目的落点

03

整个站点最终跑在 Cloudflare Workers 上,通过 OpenNext 做 Next.js 的适配和边缘部署。这样做的好处很明显:边缘就近、诊断场景一致、部署流程单一,也更符合这个项目“运维工具要快”的定位。

博客、README、Backlog 和实际页面一起更新,也是在强调一个点:这个项目不是先写文档再做产品,而是产品、文章和工程记录同步推进。

參考檔案src/app/layout.tsxwrangler.jsoncopen-next.config.tsREADME.mdOpsKitPro_Backlog.md