飞书如何搜索文档？我用AI打造高效飞书搜索网站助手
我用claude+bolt+vercel+trae(cursor)，从0开发快速上线了一个飞书搜索的网站，界面效果如下，不得不说，AI是真的很强大！目前网站已上线，示例网址如下：https://www.feisous.com/
不想看AI整合流程的朋友，可以直接跳转飞书搜索体验一把！
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774345779741-a75f79da-27fe-42e9-9fbb-5579b82e38f6.png
下面是飞书搜索的结果页面：
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774346814916-d3849539-e042-4137-a738-c401c84e10a6.png
那我是怎么开发出来的？大概分为3步：
1、和claude讨论需求，画出简版原型图
2、bolt开发前端界面
3、使用trae（cursor）完成前端+后端的整合
4、vercel完成线上部署
以往可能要好几天时间才能干出来的活，现在只要1天的时间就搞定了！下面我们来逐步拆解......
一、和claude讨论需求
你需要把AI想象成一个和你交流的人，你可以赞美他，鼓励他，给他丰富的报酬，如果他做的不好，你也可以狠狠地批评他。
我给他的提示词如下：
我想要做一个网站：飞书搜索站，大概得需求是这样的：我输入一个关键词，就能够搜索飞书(https://www.feishu.cn/)这个网站下所有的网址并聚合返回
我们讨论一下需求。你建议我们怎么设计需求?界面交互大概是什么样?这是AI给我的回答
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774346393875-41272c63-0b90-4d59-8abf-e20715f3648e.png
但是我觉得他一开始想的有点复杂了，所以我紧接着明确告诉他，我只需要一个MVP产品（这个MVP，不是游戏里的MVP哈，而是“最小可行产品”的意思！）
此项目是公开给其他用户使用的，我想先做MVP，请帮我产出“MPV需求文档”，尽可能简化。紧接着claude给我输出了详细的产品需求方案，我觉得设计的非常合理，也很符合我心中的产品的样子。
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774346521504-eb48c646-ac65-4368-8c81-af1f5c6288aa.png
下面是他给我的技术实现方案，如果你不懂技术，也没有任何关系，后面直接把这些技术发给AI，让AI去帮你实现即可。
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774402776680-7deea94f-c767-4dcc-a00d-5d127c7b20e5.png
接下来就是要使劲的夸AI，奖励AI，就比如我下面这样的：世界级水平，奖励你1万美元！
带上这些吹爆AI的提示词后，AI大概率会设计的更好，更美观，所以要记住：AI也是需要赞美的！
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774346563996-4e2749e9-245e-4f33-8e11-676d9eb28784.png
我们来看下claude产出的原型图，可以说已经是很美观了！样式的设计都符合大师级的水准。
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774347212319-360f60cd-6165-4939-b749-a9b7ce0ac9e2.png
而且他里面的搜索按钮，也是可以点击的，等于说，他这里产出的原型是可以直接进行交互操作的，我们来看下搜索结果页：
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774347346015-b3a4a13c-6743-4304-aa67-9238b968c546.png
二、bolt开发前端界面
有了需求文档和原型图之后，我们就可以让bolt来给我完成前端开发啦！
直接把claude产出的需求文档，一字不漏的全部扔给bolt，并且把claude产出的原型图截图一并给到bolt，他就会开始思考和设计前端页面了。提示词如下：
我要做一个飞书搜索的产品，使用NextJS框架 以下是需求文档。你暂时只做产品原型，不需要做具体功能。
{填入claude输出的需要文档}https://cdn.nlark.com/yuque/0/2026/png/27571985/1774347533964-97b157ff-baee-4638-8ae6-7b9d6a8e06e8.png
然后去外面散个步，摸摸鱼，过个十几分钟再来看结果吧....
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774347649763-eb870968-afb6-42bf-a1ae-d7956fccdf31.png
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774347674899-66113e69-da49-48a9-9e0e-f3709163a6bb.png
效果基本上很完美了！我们把bolt生成的页面，全部下载到本地，然后导入到trae中，去完成最后的集成吧！
三、trae整合前后端
由于上面的bolt他更擅长于前端页面的编写，并不是太擅长后端的设计。于是就有了trae或cursor这样的IDE开发工具。
先看提示词：
请阅读并理解我所有的代码，并告诉我他是做什么用的？一上来并不是跟他直接说需求，让他开发，而是让他先通读并理解代码，这样他写出来的逻辑才会更严谨！下面是AI告诉我，这个项目是干什么用的？而且把整个项目的技术架构也全部都告知我了，可以说，他分析的相当准确！
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774404217657-0f284860-8434-4268-aedc-fd4330bf3300.png
我这里以google search API为例，演示一下如何完成前后端的交互过程，给他提示词：
请参照这个页面的API示例：https://developers.google.com/custom-search/v1/overview?hl=zh-cn，帮我完成搜索的前后端交互集成等他集成完了之后，你就跟AI说：
帮我运行一下代码https://cdn.nlark.com/yuque/0/2026/png/27571985/1774404586689-ced8590a-0123-49d1-9e14-586a6f0462f5.png
他就会告诉我们项目如何运行了，就算你不懂任何技术或编程技巧，你只要会和AI沟通，把你的问题抛给AI，AI基本上都能帮助你解决。
四、线上部署
线上部署其实可以不用自己买服务器，如果是小网站，我们直接白嫖大公司的服务器即可，Vercel就是Next.js官方推出来的部署网站。所以他对Next.js的集成相对来说会更好！还是那句话，如果你不知道怎么继承，问AI就完事了！（嘿嘿！其实作为后端程序员，我之前听都没听过这个，我也不知道怎么继承）
提示词如下：
我需要把此项目部署到vercel这个网站上，并且每次提交代码，在vercel上都可以自动部署。
请帮我改好，如果部署正确，我将会给你丰富的奖励哦！接下来就是慢慢的等待了，我们按照他给我们的操作说明，一步一步的去操作，就可以把我们的网站发布到线上了！
https://cdn.nlark.com/yuque/0/2026/png/27571985/1774405553485-f420814b-3c19-453a-ab08-3ab46e6840e9.png
最后，咱们总结一下各AI能力：
1、claude：讨论需求
2、bolt：开发前端页面
3、trae：前后端交互整合
4、vercel：部署上线
提示词总结：
1、我想要做一个网站：xxxxx，我们讨论一下需求。你建议我们怎么设计需求?界面交互大概是什么样?
2、我想先做MVP，请帮我产出“MPV需求文档”，尽可能简化
3、帮我输出一份markdown格式的需求文档
4、请阅读并理解我的代码，告诉我他是干什么的？
5、夸AI的提示词：世界级水平，做得好奖励你1万美元！
AI 编程早已经不是“花架子”，而是能实实在在提高开发效率、帮我们赚钱的一个工具。这个时代，唯有拥抱AI，才能不被浪潮吞没！记住一点：遇事不决问AI，自己不知道的通通问AI，基本上都可以为你带来正确的解决方案！
--------------------------------------------
我是 @王哪跑，持续分享python实操案例，各类副业技巧及AI应用！
首发地址-----> 我用AI搞了个飞书搜索，真的牛X！
来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！
页:
[1]