当AI学会了刷小红书帮你做旅行攻略… 我们3天搞出的网站有点“野”!

307 阅读9分钟

大家好!还是我,那个在AI时代“瞎折腾”的普通创业者落叶。很高兴又和大家在这里相遇了。

上周在AI“员工”们的帮助下,2天搞定了公司官网 (还没看过的朋友可以戳这里 ),然而我们这个“啥都不会”但“啥都敢想”的微型团队,在AI的“加持”下有点膨胀了并不满足于此,于是准备搞点新花样。

这次,我们挑战升级,用3天时间,从一个想法开始,完成一个Web应用(对,就是那种有交互、能跑起来的网页应用)的开发,并成功部署到我们自己的域名上。

我们也给这个网站起了个蹭流量好玩的名字:不知道去哪儿


一切的开始:关于假期的“灵魂拷问”

清明假期刚过完那会儿,周边的朋友们就开始弥漫着对五一假期的“焦虑”。聊来聊去发现一个经典问题反复出现:

“假期去哪儿玩啊?”

“不知道啊,没啥想法...”

“好像哪儿都人多...”

是不是又像极了屏幕前的你

大家嘴上说着“没想法”,但心里或多或少都有点小偏好:有人想爬山,有人想看海;有人想去个清净地儿,有人就爱凑热闹;有人预算有限,有人追求体验…… (单押X1)


灵光一闪:让 AI 当你的专属旅行规划师?

既然大家有需求但选择困难,那我们全能的AI“员工”们是不是又能派上用场了?

场景很简单:做一个工具,你告诉它你的大致想法(从哪出发、想去几天、几个人、预算多少、喜欢什么样的地方),AI就可以基于你的需求,结合各种信息(天气、交通便利度、距离远近等),推荐合适的目的地,并且还能帮你把具体行程都规划好!

于是,我们这个名为“不知道去哪儿”的Web应用项目就启动了。


做出差异:不止规划,还要“接地气”的参考

稍微搜索一下就会发现,市场上这类旅行规划工具其实已经很多了,但经过我们的观察调研,发现一个现象:很多人做攻略,最后还是会一头扎进小红书,看别人的真实分享和“避坑指南”。那些图文并茂的笔记、真情实感的评论,往往比官方介绍更有说服力。

“真实用户的经验”,这不就是最好的参考吗?

所以,我们决定给我们的 AI 旅行规划师加一个“杀手锏”:不仅给你推荐和规划,还能自动去小红书上扒拉相关的热门笔记和评论,然后用大模型给你总结提炼出精华参考!  让你在做决定前,就能看到过来人的“经验之谈”。

这样一来,AI 的高效规划 + 小红书的真实反馈,岂不美哉?


说干就干:我们的 AI “流水线” 2.0

老规矩,先上“成品”供大家体验(和吐槽):travelplan.huanyuliuguang.cn

(温馨提示:目前还是 MVP 版本,依然推荐电脑端食用)

依然贴心的为想偷懒的你们准备好了页面截图:

首页

结果页

话不多说,继续展示我们这次“造物”的完整流程:

(因为这不是一篇“手把手教学”的文章,下面的每一步都只写了操作流程,其中会有不少细节没有展开,如果有朋友对某个环节感兴趣,欢迎私信来交流,对于需求比较多的环节,后面会考虑单独开一期教学篇)

1 产品设计 (还是没设计师,AI上!)

  • 负责“员工”:Cursor-Agent 模式
  • 目标: 把上面那些想法,变成看得见摸得着的界面设计稿。
  • 过程:
    • 提示词唤醒AI设计师,给AI设定明确的身份和任务
    • 进入持续沟通阶段,比如配色、优化交互逻辑等,得到你最终期望的设计稿
    • 每完成一个修改步骤,都能实时预览网页样式,所见即所得

2 需求文档 (把设计图“翻译”成开发语言)

  • 负责“员工”: Gemini 2.5 Pro / Claude 3.7 Sonnet / DeepSeek R1 (老规矩,谁顺手用谁)

  • 目标:  将设计稿和功能逻辑,转化为开发人员(这次是 AI 开发)能看懂的、清晰结构化的需求文档(PRD)。

  • 过程:

    • 把设计图丢给 AI,告诉它每个页面的功能、按钮点击后的反应、需要调用的数据等。
    • 让 AI 生成一份详细的需求文档,明确前后端交互逻辑、数据格式等。
    • 检查几遍,确保没啥明显遗漏。

3 核心引擎打造 (Coze工作流——这次的新武器)

  • 负责“员工”:Coze(国内版)
  • 目标:  搭建整个应用的核心后台逻辑,实现从接收用户需求到分析、推荐、查找小红书内容、总结并最终输出完整规划的自动化流程。
  • 过程: 在Coze里创建一个新的对话流(因为要接收用户的输入信息)
  1. 理解用户需求。  用大模型(这里用的是豆包)解析用户输入的自然语言,提取关键信息(目的地偏好、预算、天数、兴趣点等)。
  2. 推荐目的地。  结合Coze接入的插件/工具,根据用户需求和实时信息(如天气)筛选推荐目的地。
  3. 抓取小红书参考。  针对推荐的目的地,调用小红书的官方插件批量获取小红书上的相关笔记和评论内容。
  4. 内容总结。  将获取到的小红书笔记和评论集合起来,“喂”给另一个大模型节点,让它进行阅读理解和总结,分别提炼出推荐和踩坑的Tips。
  5. 调试和发布。 通过试运行观察输出的结果,如果发现输出的内容不符合预期,就不断通过调整提示词进行优化。

最终是个不算复杂的对话流,大概长这样:

Coze工作流

4 产品开发 (让代码“长”出来)

  • 负责“员工”: 我们的老朋友,Cur ·这个家没我不行· sor
  • 目标:  基于设计稿和需求文档,生成前后端代码,这次要复杂一些,后端需要调用Coze对话流的API接口。
  • 过程: 和上次做官网类似,把设计图、需求文档一股脑“喂”给 Cursor。
    重点来了:  这次项目比官网复杂得多,页面多,还有前后端交互。直接让Cursor一步到位生成整个项目?大概率一定会翻车。
    我们的经验是:分步执行!
    最好能严格按照项目开发的节奏来,比如先写前端页面、测一下、再写后端接口、再测一下、然后做API的接口联调……等等,你说我不会代码怎么会知道这些步骤?当然还是AI告诉我的~

5 调试&优化 (漫长而痛苦的环节)

  • 负责“员工”: 还是Cursor (谁生的娃谁带)
  • 目标:  修复Bug,优化样式和用户体验,让应用能跑起来。
  • 过程: 越复杂的项目,这一步越难,因为AI编程工具的记忆力是真的有限,和Cursor们的合作是个长期磨合的过程。
    这个过程就是不断地:发现问题 -> 描述问题给 Cursor -> 尝试它的解决方案 -> 不行?-> 再换个方式描述、再尝试……直到问题解决或者干掉这个功能

在Cursor上调试的过程

6 网站部署 (让全世界都能看到)

  • 负责“员工”: Gemini 2.5 Pro (指导顾问)+ (执行)
  • 目标: 把本地开发好的应用部署到公网上,并绑定到自己的域名
  • 过程: 上一篇用的是直接操作云服务器(远程连接),还是有点过于复杂了,所以这次换了个相对简单的方式。
    这里会用到两个,对于开发人员来说是老熟人,但对我来说是新朋友的网站:Github、CloudFlare
    工作模式和上次是一样的:依然是Gemini一步步指导我如何去操作。
  1. 注册 Cloudflare 账号, 把项目代码上传到 GitHub (或其他 Git 仓库,这样后期维护之后只要更新上去,Cloudflare就会自动重新构建)。
  2. 在Cloudflare Pages连接 Git 仓库, 选择项目,做好配置。
  3. Cloudflare自动完成构建和部署后,会生成一个.pages.dev的域名。
  4. 绑定自定义域名,在Cloudflare 添加自己的域名,按照指引修改域名的DNS解析记录(主要是 CNAME),将自己想要让大家访问的域名地址指向上一步创建的域名。
  5. 等待 DNS 生效。

是不是又看不懂了
你仍然不需要关心每一步是做什么的:遇事不决,找Gemini
遇到不懂的、报错的,截图+描述+错误日志,直接丢过去,让它一步步教我操作,解释每个命令是干嘛的,分析错误原因并给出解决方案。

CloudFlare成功部署


后记

目前我们这个 “不知道去哪儿” 还只是个 MVP (最小可行产品) 版本,我们深知它还有很多地方可以优化,比如小红书的内容获取和返回并不稳定、规划的行程还不够个性化,等等。

所以,真诚的欢迎每一位体验过的朋友来评论区吐槽,毕竟我们团队主打一个“听劝”。你们的每一个建议,都可能成为我们下一步迭代的方向!


写在最后

虽然这次的项目看起来也不算复杂(毕竟也只有两个页面、一个流程),但如果有懂开发的同学,一定会知道它相比于公司官网来说,难度是指数级提升的。

所以诚实的说,这次的确有些“标题党”,如果你对所有AI工具的使用都只是初学者,那么这个项目三天之内是很难做出来的(更何况还要做部署上线),甚至我们自己一开始也并不认为可以在本周完成这个项目,即便是初级版本。

我们最终超出预期的完成了,其实复盘下来,是得益于前期对各种工具使用的积累:无论是Coze工作流的搭建还是Cursor的进阶使用,我们已经踩过很多的坑,也成功的减少了各个环节的调试时间。

这也是我想继续上一篇的观点接着说的,现阶段的AI绝不是“我听过了等于我会用了”,如果想让AI“员工”们发挥更大的价值,需要把它们当做真正的“搭子”,不断地磨合。

最后的最后,如果你对 AI 应用、AI 创业,或者对我正在“瞎折腾”的事情感兴趣,欢迎关注点赞支持一下,也期待在评论区看到你们的想法和交流。一句很俗但很真的话:你们的支持是我最大的动力~