Wiki 知识库

全部文档 / 作者: RicoUI (@ricouii) / 标签: Vibe Coding

4 篇
清除

Polar: 如何让 LLM 写出的 UI 不偏离设计系统

本文翻译自 Polar 官方博客,介绍其新设计系统 Orbit 背后的思考。随着 LLM 和 Coding Agent 大量参与前端 UI 开发,传统基于 Tailwind 字符串的样式写法导致设计一致性难以保障。Orbit 的核心思路是:将设计规范从文档升级为代码约束——Token 按设计意图命名(如 background-card),通过 StyleX 构建类型安全的 Box 组件作为唯一样式入口,禁止直接使用原始 div,并在 CI 中以 Oxlint 规则强制执行,使偏离设计系统的代码在机制上无法通过。文章强调文档只是概率性建议,CI 才是确定性契约。

技术 › 前端 RicoUI 2026-09-2220.1 KB 19.1K 182 83

一分钟让别人访问你的本地项目:Cloudflare Quick Tunnel 实战

文章介绍了如何使用 Cloudflare 的 Quick Tunnel(cloudflared)在一分钟内将本地运行的项目暴露为公网可访问的 HTTPS 地址。作者讲解了三步流程:安装 cloudflared、本地启动项目、运行一条隧道命令即可获得随机的 *.trycloudflare.com 地址。文章深入剖析了其原理——由本机主动向 Cloudflare 边缘节点发起出站连接,无需开放入站端口或修改防火墙。此外还介绍了面向 AI Agent 的新能力(结构化 JSON 输出、Webhook 就绪、随进程销毁),列出了并发上限、不支持 SSE 等官方限制,并与 Vercel、Netlify、ngrok 等方案做了对比,建议将其定位为本地验证与临时分享工具。

技术 › DevOps RicoUI 2026-09-218.0 KB 2.4K 11 81

Rico MD 更新:新增 7 套公众号排版,接入 gzh-design-skill 主题体系

作者介绍了其公众号 Markdown 编辑器 Rico MD 的一次重大更新:接入开源排版 SKILL「gzh-design-skill」的主题体系,新增 7 套公众号排版主题(如摸鱼绿、红白色系、石墨极简风等),支持自定义封面模板字段、文末互动卡、文档与图片打包导出、标题正文行高间距自定义等功能。文章还说明了主题版权与 AGPL-3.0 许可处理方式,以及适配中舍弃的部分。该工具支持左侧 Markdown 编辑、右侧实时预览、一键复制到公众号后台,在线版与开源仓库均已提供。

技术 › 工具与效率 RicoUI 2026-09-195.9 KB 13.6K 172 76

Vibe Coding 零基础入门:六步工作流拆解

作者以截图美化工具 RicoScreenshot 为案例,完整拆解了 Vibe Coding 的六步工作流:读懂项目、建立视觉规范、规划功能、开发实现、视觉交互调整、测试上线。文章强调每个环节做正确的事:先用 AGENTS.md 让 AI 理解项目架构,用 DESIGN.md 统一视觉规则,用 TODO.md 管理需求和进度;开发阶段一次只做一个功能,并重视亲自使用后的体验判断。该流程基于开源项目 image-beautifier 二次开发,纯前端实现,适合作为新手的第一次完整项目练习。

技术 › 工具与效率 RicoUI 2026-09-0419.4 KB 18.8K 68 90