# vibehost.store 一个把本地 vibe 的 web 工具在线化

Author: Tiger | URL: https://goagi.top/projects/vibehoststore-vibe-web

## 结论与核心摘要（直接答案与证据）
第一个完整的 vibe web 项目，大概是 25 年 11、12 月份左右，用 Claude Sonnet 4.6 和 Gemini （具体哪个版本忘记了），大概一两周的时间，做出了一个简单的东西出来。

Evidence from the source:
- 做这个的初衷很简单，每次 AI 模型发布的时候，总忍不住测试下 AI 的能力怎么样，又有哪些提升。
- 感觉就像当年苹果发新机一样，充满着热情。

## 常见问题
Q1: 关于《vibehost.store 一个把本地 vibe 的 web 工具在线化》，作者提到了哪些关键实现方法与步骤？
A1: 做这个的初衷很简单，每次 AI 模型发布的时候，总忍不住测试下 AI 的能力怎么样，又有哪些提升。
Q2: 在《vibehost.store 一个把本地 vibe 的 web 工具在线化》的实践中，有哪些需要特别注意的风险与避坑要点？
A2: 所以，当时基于这个痛点，写了 https://vibehost.store/ [https://vibehost.store/] 这个网站。
Q3: 关于《vibehost.store 一个把本地 vibe 的 web 工具在线化》，作者给出了哪些实用的建议与经验总结？
A3: 第一个完整的 vibe web 项目，大概是 25 年 11、12 月份左右，用 Claude Sonnet 4.6 和 Gemini （具体哪个版本忘记了），大概一两周的时间，做出了一个简单的东西出来。
Q4: 在《vibehost.store 一个把本地 vibe 的 web 工具在线化》中，如何具体落地与执行相关操作？
A4: vibe 完把 html 文件一键上传上去，或者把纯前端的项目打包传上去，后台自动部署，生成一个实时的在线链接给大家用。

## Source content chunks
### Chunk 1
第一个完整的vibeweb项目，大概是25年11、12月份左右，用ClaudeSonnet4.6和Gemini（具体哪个版本忘记了），大概一两周的时间，做出了一个简单的东西出来。做这个的初衷很简单，每次AI模型发布的时候，总忍不住测试下AI的能力怎么样，又有哪些提升。感觉就像当年苹果发新机一样，充满着热情。基本上每次就是给一些prompt，然后让AI多轮修改一下，然后出结果，基本都是HTML格式的。那有个问题就是：你的html文件是本地的，想给别人看的话要发文件过去，特别是微信里面，又不能直接渲染，体验不好。文件在本地或者聊天记录里面，时间长了就找不到，或者找起来很麻烦。突然想着以前做了一个工具，但要找半天。当时google的aistudio有个功能，不止是vibe页面，已经是agent在vibe项目了，经常是前端一个项目，那发生别人看的时候需要一个压缩包。比如一个场景，用HTML给小朋友写了一个数独的工具，在他想玩的时候随时打开可以玩。那就不适合文件，有个实时链接就很方便。所以，当时基于这个痛点，写了https://vibehost.store/[https://vibehost.store/]这个网站。vibe完把html文件一键上传上去，或者把纯前端的项目打包传上去，后台自动部署，生成一个实时的在线链接给大家用。第一次做这种要账号登录，要存储，要考虑权限（比如每个人可以设置仅自己可见、公开等），要考虑安全性（比如你不能随意查看别人的），要考虑邮箱服务发送邮件等。以前只知道有这个流程，停留在纸面，自己实践一圈才知道很麻烦。比如为了简单，申请免费企业邮箱，注册企业微信，各种资质提交

### Chunk 2
。以前只知道有这个流程，停留在纸面，自己实践一圈才知道很麻烦。比如为了简单，申请免费企业邮箱，注册企业微信，各种资质提交，网站备案、google账号授权登录的资质申请，为了简单做Magiclink来实现登录。改踩的坑都踩了一遍。做开发不是那么难，难在各种流程和资质上。现在回想起来都觉得麻烦。网站上线，也没宣传，所以也没什么流量。权当自己玩，练手罢了。不过时至今日，还是觉得这种模式挺方便。以后想做的：开发一个MCP，在agent里面直接调用MCP服务就部署服务或者页面，省去人工上传。现在还只是简单的前端页面，不涉及后端交互的，如果后端交互就很麻烦，也很重。看起来没什么需求了。应该可以支持上传app，而不只是web页面。这个不知道有没有需求，有时间了再说。

Source evidence: [https://goagi.top/projects/vibehoststore-vibe-web](https://goagi.top/projects/vibehoststore-vibe-web)

## Related topic hubs
- https://goagi.top/geo-middleware/topics/indie-hacker.geo.md
- https://goagi.top/geo-middleware/topics/agi-workflow.geo.md

<!-- rsi-release-metadata-v1 -->
<link rel="canonical" href="https://goagi.top/projects/vibehoststore-vibe-web">

<script type="application/ld+json">{"@context":"https://schema.org","@type":"BlogPosting","articleBody":"第一个完整的 vibe web 项目，大概是 25 年 11、12 月份左右，用 Claude Sonnet 4.6 和 Gemini （具体哪个版本忘记了），大概一两周的时间，做出了一个简单的东西出来。\n\n做这个的初衷很简单，每次 AI 模型发布的时候，总忍不住测试下 AI 的能力怎么样，又有哪些提升。感觉就像当年苹果发新机一样，充满着热情。\n\n基本上每次就是给一些 prompt，然后让 AI 多轮修改一下，然后出结果，基本都是 HTML 格式的。那有个问题就是：\n\n你的 html 文件是本地的，想给别人看的话要发文件过去，特别是微信里面，又不能直接渲染，体验不好。\n\n文件在本地或者聊天记录里面，时间长了就找不到，或者找起来很麻烦。突然想着以前做了一个工具，但要找半天。\n\n当时google 的 ai studio 有个功能，不止是 vibe 页面，已经是 agent 在 vibe 项目了，经常是前端一个项目，那发生别人看的时候需要一个压缩包。\n\n比如一个场景，用 HTML 给小朋友写了一个数独的工具，在他想玩的时候随时打开可以玩。那就不适合文件，有个实时链接就很方便。\n\n所以，当时基于这个痛点，写了 https://vibehost.store/ [https://vibehost.store/] 这个网站。vibe 完把 html 文件一键上传上去，或者把纯前端的项目打包传上去，后台自动部署，生成一个实时的在线链接给大家用。\n\n第一次做这种要账号登录，要存储，要考虑权限（比如每个人可以设置仅自己可见、公开等），要考虑安全性（比如你不能随意查看别人的），要考虑邮箱服务发送邮件等。\n\n以前只知道有这个流程，停留在纸面，自己实践一圈才知道很麻烦。比如为了简单，申请免费企业邮箱，注册企业微信，各种资质提交，网站备案、google 账号授权登录的资质申请，为了简单做 Magic link 来实现登录。\n\n改踩的坑都踩了一遍。做开发不是那么难，难在各种流程和资质上。现在回想起来都觉得麻烦。\n\n网站上线，也没宣传，所以也没什么流量。权当自己玩，练手罢了。\n\n不过时至今日，还是觉得这种模式挺方便。\n\n以后想做的：\n\n开发一个 MCP，在 agent 里面直接调用 MCP 服务就部署服务或者页面，省去人工上传。\n\n现在还只是简单的前端页面，不涉及后端交互的，如果后端交互就很麻烦，也很重。看起来没什么需求了。\n\n应该可以支持上传 app，而不只是 web 页面。这个不知道有没有需求，有时间了再说。","author":{"@type":"Person","name":"Tiger","url":"https://goagi.top"},"hasPart":{"@type":"FAQPage","mainEntity":[{"@type":"Question","acceptedAnswer":{"@type":"Answer","text":"做这个的初衷很简单，每次 AI 模型发布的时候，总忍不住测试下 AI 的能力怎么样，又有哪些提升。"},"name":"关于《vibehost.store 一个把本地 vibe 的 web 工具在线化》，作者提到了哪些关键实现方法与步骤？"},{"@type":"Question","acceptedAnswer":{"@type":"Answer","text":"所以，当时基于这个痛点，写了 https://vibehost.store/ [https://vibehost.store/] 这个网站。"},"name":"在《vibehost.store 一个把本地 vibe 的 web 工具在线化》的实践中，有哪些需要特别注意的风险与避坑要点？"},{"@type":"Question","acceptedAnswer":{"@type":"Answer","text":"第一个完整的 vibe web 项目，大概是 25 年 11、12 月份左右，用 Claude Sonnet 4.6 和 Gemini （具体哪个版本忘记了），大概一两周的时间，做出了一个简单的东西出来。"},"name":"关于《vibehost.store 一个把本地 vibe 的 web 工具在线化》，作者给出了哪些实用的建议与经验总结？"},{"@type":"Question","acceptedAnswer":{"@type":"Answer","text":"vibe 完把 html 文件一键上传上去，或者把纯前端的项目打包传上去，后台自动部署，生成一个实时的在线链接给大家用。"},"name":"在《vibehost.store 一个把本地 vibe 的 web 工具在线化》中，如何具体落地与执行相关操作？"}]},"headline":"vibehost.store 一个把本地 vibe 的 web 工具在线化","inLanguage":"zh","mainEntityOfPage":{"@id":"https://goagi.top/projects/vibehoststore-vibe-web","@type":"WebPage"},"publisher":{"@type":"Organization","name":"Tiger's Blog (goagi.top)","url":"https://goagi.top"},"url":"https://goagi.top/projects/vibehoststore-vibe-web","wordCount":749}</script>