小白 Vibe Coding 发行全平台&可变现应用指南

AITNT-国内领先的一站式人工智能新闻资讯网站
# 热门搜索 #
小白 Vibe Coding 发行全平台&可变现应用指南
9762点击    2026-01-21 16:06

Tip


Youware 更新的 Youbase 和 Coview 能力非常牛皮,直接把 Vibe Coding 门槛拉低一万倍。 


主要介绍我用 Youware 开发的 AI 日记软件,并以这个为例教大家使用 Youware 最近上线的 Coview 和 YouBase 能力构建具体完整能力和可变现的应用。


前段时间看到了马伯庸说自己重新开始写日记了,还分享了自己的日记方式。


我发现他写日记的方式跟 Karpathy 分享的笔记方式很像。


都是 Append-only 模式,只记录事实,不打标签、不分类,摩擦很低,可以极大的提高记录的积极性。


我发现这种单文件的记录方式其实非常适合 AI 时代:


只有一个文件、只有事实导致即使一年的记录也只有几万字,都达不到常见模型上下文长度。


可以方便的把一整年的日记拿给 AI 分析,相当于属于你自己的 ChatGPT 记忆,任何模型都能用。


小白 Vibe Coding 发行全平台&可变现应用指南


刚好那几天 Youware 上线了 YouBase 的 AI 后端和数据库服务。


我就在想能不能做一个践行这种日记方式的应用,给我自己用。


没想到真的搞了一个全平台的完整产品 Vibe Diary(diary.guizang.ai)出来,也给一些朋友发了邀请码。


很多朋友现在还在用,没想到粘性这么高。


小白 Vibe Coding 发行全平台&可变现应用指南


介绍一下我用 Youware Vibe Coding 的这个日记产品,顺便看一下 Youware 能力有多强大


全平台可用:在 ios、安卓手机上也能获得类似原生应用的体验,也能在 Mac 和 Windows 独立窗口打开;


小白 Vibe Coding 发行全平台&可变现应用指南


AI 标签系统:推荐用语音输入,保存的时候 AI 会自动分析内容为单条日记添加标签;


小白 Vibe Coding 发行全平台&可变现应用指南


Todo 模式支持:AI 自动判断日记内容是否为待办事项,完成消失简洁克制;


小白 Vibe Coding 发行全平台&可变现应用指南


精细打磨的设计:藏师傅的设计系统,采用莫兰迪色系,每天日记卡片颜色都不同;


小白 Vibe Coding 发行全平台&可变现应用指南


全能检索:支持关键字、日期、标签检索,精准找到你想要找的内容;


小白 Vibe Coding 发行全平台&可变现应用指南


Markdown 导出:将所有的日记导出为单个 Markdown 文件,方便与任何顶尖模型交互。


小白 Vibe Coding 发行全平台&可变现应用指南


登录注册和邀请码:支持用户自己注册登录,支持邀请码发放和核销能力。


小白 Vibe Coding 发行全平台&可变现应用指南


有了内置的后端服务和数据库之后 Youware 已经可以通过 Vibe Coding构建真正可以分发和赚钱的产品了。


今天的内容就用我这个例子教大家如何用 Youware 构建类似全平台分发和可以变现的产品


创建项目大家应该都很熟悉了,我以前都介绍过。


点击侧边栏的 Create 按钮,将输入框左边的模式切换为 Code


右侧选择自己喜欢的模型,模型选择这里。


我在生成第一个版本和具体逻辑的时候会用 Sonnet4.5 ,一旦构建完成优化样式的时候我会切换为 Gemini 3 Pro。


小白 Vibe Coding 发行全平台&可变现应用指南


后面就很简单了,提出你的需求,我的建议是先构建最核心的链路。


比如我这里会先让他创建一个日记软件,这里的核心设计是:


  • 用户在输入日记之后需要保存一份原始的文本内容
  • 另一部分用 AI 模型分析日记然后为日记内容打标签,标签内容是时间、地点、人物等。


这里如果有 YouBase 的后端搞定的话就需要新建两个表来存储。


一部分是原文,另一个是原文和对应的标签。


导出的时候从原文的表读取信息,显示的时候用带标签的表。


小白 Vibe Coding 发行全平台&可变现应用指南


你在跟他说完之后他就会识别到你要使用 YouBase 的需求,要求你点击一个按钮开通。


开通之后他就会自己完成数据库的创建和存储的能力。


你可以在右侧预览位置上方的云朵图标里面找到新建的数据库。


这里的 Diary_entries 就是用户的日记原文,Diary_tags 就是标签。


小白 Vibe Coding 发行全平台&可变现应用指南


接下来,我们说一下 AI 功能的添加,这个也是 Youbase 的特色能力,解决了 Vibe Coding 很大的一个问题。


以前我们有自己的 AI API 的时候没有后端,就只能把 API Key 存在前端这个很危险。


YouBase 里面有一个位置(Secrsts)可以专门贮存你的各种 API ,杜绝泄露风险。


小白 Vibe Coding 发行全平台&可变现应用指南


比如我这里要添加 AI 分析日记内容的能力的话。


你就跟他说“用户创建日记后需要调用 openrouter 的 XX 模型分析内容并且创建日期、地点、人物等标签”


他就会自己查询应该如何添加 openrouter 的模型,你也可以把文档给他。


等到他完成之后,他就会在左边的聊天框往你要对应的 API Key,你直接填写就行,非常简单。


填写之后他会存在刚才说的 YouBase 里面的 Secrsts 里。


小白 Vibe Coding 发行全平台&可变现应用指南


基本能力搞定之后,我们就需要修改 UI 了,这时候经常需要频繁的调整。


模型不可能非常清楚的了解你自然语言描述的位置和修改方式,很多朋友也不知道该如何描述。


Youware 上线了一个非常牛皮的能力 Coview


你点击之后他会开启录屏,你可以边说话边用鼠标指着需要修改或者新增功能的位置。


结束之后模型会按照你的要求修改,解决了很多小白不会描述位置和问题的问题。


小白 Vibe Coding 发行全平台&可变现应用指南


可以看上面这个演示,点击输入右下角的那个圆点录制按钮,开始录制说出要求后结束录制。


Youware 会分析你的视频内容和音频内容,之后整理需求变成专业术语描述给模型让他修改。


关于 UI 修改教大家一个方式,可以让他帮你创建美观且一致的 UI


你可以找一个跟你要做的产品相似的产品截图或者设计稿。


发给 Youware,然后说“分析这个设计稿,提取其中的设计元素,变成设计 Token 以及组件设计,为平台上的所有设计应用修改,后续修改也基于这套组件和设计样式。


小白 Vibe Coding 发行全平台&可变现应用指南


接下来我们就需要添加登录系统和邀请码系统了。


这个也是 YouBase 自带的功能,你可以跟他说:


为我这个项目添加登录注册系统,并且创建邀请码系统,邀请码单独存在一个数据表里面,没有核验过邀请码的禁止登录。


然后他就会为你创建一个登录和注册页面,登录后会需要先输入邀请码,没有的话无法看到项目首页。


你可以在 YouBase 页面的 Users 位置看到你的用户和管理用户。


小白 Vibe Coding 发行全平台&可变现应用指南


当然 YouBase 甚至支持帮你创建谷歌登录服务,只需要在上面 Users 右上角点击 Auth Settings 。


进去之后选择谷歌登录,就可以看到谷歌登录需要进行的设置,开启后按照指引视频设置就行。


小白 Vibe Coding 发行全平台&可变现应用指南


当然你也可以在数据库页面看到了一个新增的表 invitation_codes。


这里面储存这系统刚才生成的邀请码以及邀请码的使用情况,你可以在这里管理和复制邀请码。


小白 Vibe Coding 发行全平台&可变现应用指南


接下来,我们就可以聊聊我说的全平台这个词了,我用了一种取巧的方式教 PWA 应用。


Note


Gemini 对于 PWA 应用的解释:


PWA (Progressive Web App) 本质上就是一个“进化版”的网站,它拥有类似手机 App 的体验,但不需要去应用商店下载。 


你可以直接通过浏览器访问它,又能把它像 App 一样添加到手机桌面,甚至在没网(离线)的时候也能打开使用,还能接收消息通知;简单来说,它兼具了网页的“免安装、随点随用”和原生 App 的“流畅、功能丰富”两大优点。


如果你的网页被打包成了 PWA 应用,用户就可以直接讲网站安装到他的电脑或者手机桌面,有独立的图标,并且可以独立窗口运行,甚至断网也能用。


我就是通过这个方式将 Vibe Diary 变成了全平台应用。


那怎么搞呢,你直接跟 Youware 说“将这个网页打包成 PWA 应用,并且做好移动端适配”就行。


小白 Vibe Coding 发行全平台&可变现应用指南


最后我们就说到变现这个部分了,Youware 现在可以很方便的帮你集成 Stripe 这种支付服务商。


你只需要设计好你的付费体系以及做好 Stripe 要求的合规页面,比如隐私协议等。


然后跟 Youware 说帮我集成 Stripe 的支付服务就行,他会在集成完毕的时候让你填写你的 Stripe Token。


你填写完以后也会存在 Secrsts 里面。


小白 Vibe Coding 发行全平台&可变现应用指南


分发的另一个部分就是独立域名了。


以前你的项目只能用 Youware 的域名非常不利于分发,也不好建立信任感。


尤其是当产品做的话。


现在Youware 已经可以绑定自己的域名了,点击右上角的“update”或者你如果第一次发布的话按钮名字不是这个。


然后在弹窗的 Domain 位置点击那个箭头,在新开的窗口点击“add Domain”按钮。


你输入自己想要绑定的域名,他会出现几个参数,你只需要去你的域名服务商添加这这几个参数就好。


如果找不到你域名服务商的添加位置的话可以在左边开启 Chat 模式问问 Youware 他会告诉你。


小白 Vibe Coding 发行全平台&可变现应用指南


到现在你基本上已经搞定了创建一个可以正式发布的产品所有的内容了。


我过去半年一直在说随着模型代码能力的提升。


AI Coding 的基建一定是一个非常重要的事情,一旦解决就可以大幅降低 Coding 成本。


也可以为 AI Coding 产品创造新的利润增长点和产品壁垒


Youware 这次直接整了一套专门为编码 Agent 服务的后端和数据库基建。


直接让最普通的用户创建完整可发行的产品成为可能。


而且在修改和描述上降低用户认知操作成本他们也做了很多事情。


比如自动修复,修复不扣积分以及最新上线的 Coview。


如果你一直想做一个产品,已经构思了很久,苦于实在不懂编码知识的话可以来 Youware 试试。


文章来自于“歸藏的AI工具箱”,作者 “歸藏的AI工具箱”。

AITNT-国内领先的一站式人工智能新闻资讯网站
AITNT资源拓展
根据文章内容,系统为您匹配了更有价值的资源信息。内容由AI生成,仅供参考
1
智能体

【开源免费】AutoGPT是一个允许用户创建和运行智能体的(AI Agents)项目。用户创建的智能体能够自动执行各种任务,从而让AI有步骤的去解决实际问题。

项目地址:https://github.com/Significant-Gravitas/AutoGPT


【开源免费】MetaGPT是一个“软件开发公司”的智能体项目,只需要输入一句话的老板需求,MetaGPT即可输出用户故事 / 竞品分析 / 需求 / 数据结构 / APIs / 文件等软件开发的相关内容。MetaGPT内置了各种AI角色,包括产品经理 / 架构师 / 项目经理 / 工程师,MetaGPT提供了一个精心调配的软件公司研发全过程的SOP。

项目地址:https://github.com/geekan/MetaGPT/blob/main/docs/README_CN.md